Skip to content

Commit c23a007

Browse files
Guten-Morgen1302Guten-Morgen1302
committed
files added
0 parents  commit c23a007

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

82 files changed

+10498
-0
lines changed

‎.gitignore

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
6+
# next.js
7+
/.next/
8+
/out/
9+
10+
# production
11+
/build
12+
13+
# debug
14+
npm-debug.log*
15+
yarn-debug.log*
16+
yarn-error.log*
17+
.pnpm-debug.log*
18+
19+
# env files
20+
.env*
21+
22+
# vercel
23+
.vercel
24+
25+
# typescript
26+
*.tsbuildinfo
27+
next-env.d.ts

‎app/calendar/page.tsx

+164
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,164 @@
1+
import { DashboardLayout } from "@/components/layout/dashboard-layout"
2+
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
3+
import { Button } from "@/components/ui/button"
4+
import { Badge } from "@/components/ui/badge"
5+
import { ChevronLeft, ChevronRight, Plus } from "lucide-react"
6+
7+
// Helper function to generate calendar days
8+
const generateCalendarDays = () => {
9+
const days = []
10+
const today = new Date()
11+
const currentMonth = today.getMonth()
12+
const currentYear = today.getFullYear()
13+
14+
// Get the first day of the month
15+
const firstDay = new Date(currentYear, currentMonth, 1)
16+
const startingDay = firstDay.getDay() // 0 = Sunday, 1 = Monday, etc.
17+
18+
// Get the number of days in the month
19+
const lastDay = new Date(currentYear, currentMonth + 1, 0)
20+
const totalDays = lastDay.getDate()
21+
22+
// Add empty cells for days before the first day of the month
23+
for (let i = 0; i < startingDay; i++) {
24+
days.push({ day: "", isCurrentMonth: false })
25+
}
26+
27+
// Add days of the current month
28+
for (let i = 1; i <= totalDays; i++) {
29+
days.push({
30+
day: i,
31+
isCurrentMonth: true,
32+
isToday: i === today.getDate(),
33+
hasEvents: [5, 12, 15, 20, 25].includes(i), // Sample days with events
34+
})
35+
}
36+
37+
// Add empty cells to complete the last week if needed
38+
const remainingCells = 42 - days.length // 6 rows of 7 days
39+
for (let i = 0; i < remainingCells; i++) {
40+
days.push({ day: "", isCurrentMonth: false })
41+
}
42+
43+
return days
44+
}
45+
46+
const events = [
47+
{
48+
id: 1,
49+
title: "Team Meeting",
50+
time: "10:00 AM - 11:30 AM",
51+
type: "meeting",
52+
color: "bg-blue-500/20 text-blue-500",
53+
},
54+
{
55+
id: 2,
56+
title: "Project Deadline: Website Redesign",
57+
time: "5:00 PM",
58+
type: "deadline",
59+
color: "bg-red-500/20 text-red-500",
60+
},
61+
{
62+
id: 3,
63+
title: "Client Call: ABC Corp",
64+
time: "2:00 PM - 3:00 PM",
65+
type: "call",
66+
color: "bg-green-500/20 text-green-500",
67+
},
68+
{
69+
id: 4,
70+
title: "Review Mobile App Wireframes",
71+
time: "4:00 PM - 5:00 PM",
72+
type: "task",
73+
color: "bg-purple-500/20 text-purple-500",
74+
},
75+
]
76+
77+
export default function CalendarPage() {
78+
const calendarDays = generateCalendarDays()
79+
const weekdays = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]
80+
const currentMonth = new Date().toLocaleString("default", { month: "long", year: "numeric" })
81+
82+
return (
83+
<DashboardLayout>
84+
<div className="flex justify-between items-center mb-6">
85+
<div>
86+
<h2 className="text-2xl font-bold">Calendar</h2>
87+
<p className="text-muted-foreground">Manage your schedule and events</p>
88+
</div>
89+
<Button className="flex items-center gap-2">
90+
<Plus className="h-5 w-5" />
91+
New Event
92+
</Button>
93+
</div>
94+
95+
<div className="grid grid-cols-1 lg:grid-cols-4 gap-6">
96+
<div className="lg:col-span-3">
97+
<Card>
98+
<CardHeader className="flex flex-row items-center justify-between pb-2">
99+
<CardTitle>{currentMonth}</CardTitle>
100+
<div className="flex items-center gap-2">
101+
<Button variant="outline" size="icon">
102+
<ChevronLeft className="h-4 w-4" />
103+
</Button>
104+
<Button variant="outline" size="icon">
105+
<ChevronRight className="h-4 w-4" />
106+
</Button>
107+
</div>
108+
</CardHeader>
109+
<CardContent>
110+
<div className="grid grid-cols-7 gap-1">
111+
{weekdays.map((day) => (
112+
<div key={day} className="text-center font-medium text-sm py-2">
113+
{day}
114+
</div>
115+
))}
116+
{calendarDays.map((day, index) => (
117+
<div
118+
key={index}
119+
className={`aspect-square p-2 border ${
120+
day.isCurrentMonth ? "bg-card" : "bg-muted/50 text-muted-foreground"
121+
} ${day.isToday ? "border-primary" : "border-border"} relative`}
122+
>
123+
{day.day && (
124+
<>
125+
<span className="text-sm">{day.day}</span>
126+
{day.hasEvents && (
127+
<div className="absolute bottom-1 right-1 h-2 w-2 rounded-full bg-primary"></div>
128+
)}
129+
</>
130+
)}
131+
</div>
132+
))}
133+
</div>
134+
</CardContent>
135+
</Card>
136+
</div>
137+
138+
<div>
139+
<Card>
140+
<CardHeader>
141+
<CardTitle>Today's Events</CardTitle>
142+
</CardHeader>
143+
<CardContent>
144+
<div className="space-y-4">
145+
{events.map((event) => (
146+
<div key={event.id} className="border rounded-lg p-3">
147+
<h4 className="font-medium">{event.title}</h4>
148+
<div className="flex items-center justify-between mt-2">
149+
<p className="text-sm text-muted-foreground">{event.time}</p>
150+
<Badge variant="outline" className={event.color}>
151+
{event.type}
152+
</Badge>
153+
</div>
154+
</div>
155+
))}
156+
</div>
157+
</CardContent>
158+
</Card>
159+
</div>
160+
</div>
161+
</DashboardLayout>
162+
)
163+
}
164+

‎app/globals.css

+77
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
@layer base {
6+
:root {
7+
--background: 0 0% 100%;
8+
--foreground: 0 0% 3.9%;
9+
10+
--card: 0 0% 100%;
11+
--card-foreground: 0 0% 3.9%;
12+
13+
--popover: 0 0% 100%;
14+
--popover-foreground: 0 0% 3.9%;
15+
16+
--primary: 265 100% 55%;
17+
--primary-foreground: 0 0% 98%;
18+
19+
--secondary: 0 0% 96.1%;
20+
--secondary-foreground: 0 0% 9%;
21+
22+
--muted: 0 0% 96.1%;
23+
--muted-foreground: 0 0% 45.1%;
24+
25+
--accent: 265 100% 95%;
26+
--accent-foreground: 265 100% 45%;
27+
28+
--destructive: 0 84.2% 60.2%;
29+
--destructive-foreground: 0 0% 98%;
30+
31+
--border: 0 0% 89.8%;
32+
--input: 0 0% 89.8%;
33+
--ring: 265 100% 55%;
34+
35+
--radius: 0.5rem;
36+
}
37+
38+
.dark {
39+
--background: 0 0% 13%;
40+
--foreground: 0 0% 98%;
41+
42+
--card: 0 0% 16%;
43+
--card-foreground: 0 0% 98%;
44+
45+
--popover: 0 0% 16%;
46+
--popover-foreground: 0 0% 98%;
47+
48+
--primary: 265 100% 55%;
49+
--primary-foreground: 0 0% 98%;
50+
51+
--secondary: 0 0% 20%;
52+
--secondary-foreground: 0 0% 98%;
53+
54+
--muted: 0 0% 20%;
55+
--muted-foreground: 0 0% 63.9%;
56+
57+
--accent: 265 100% 25%;
58+
--accent-foreground: 0 0% 98%;
59+
60+
--destructive: 0 62.8% 30.6%;
61+
--destructive-foreground: 0 0% 98%;
62+
63+
--border: 0 0% 20%;
64+
--input: 0 0% 20%;
65+
--ring: 265 100% 55%;
66+
}
67+
}
68+
69+
@layer base {
70+
* {
71+
@apply border-border;
72+
}
73+
body {
74+
@apply bg-background text-foreground;
75+
}
76+
}
77+

‎app/layout.tsx

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import type React from "react"
2+
import type { Metadata } from "next"
3+
import { Open_Sans } from "next/font/google"
4+
import "./globals.css"
5+
import { ThemeProvider } from "@/components/theme-provider"
6+
7+
const openSans = Open_Sans({
8+
subsets: ["latin"],
9+
variable: "--font-open-sans",
10+
})
11+
12+
export const metadata: Metadata = {
13+
title: "TaskFlow - Task Management",
14+
description: "Manage your tasks and projects efficiently with TaskFlow",
15+
generator: 'v0.dev'
16+
}
17+
18+
export default function RootLayout({
19+
children,
20+
}: {
21+
children: React.ReactNode
22+
}) {
23+
return (
24+
<html lang="en" suppressHydrationWarning>
25+
<body className={`${openSans.variable} font-sans`}>
26+
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem disableTransitionOnChange>
27+
{children}
28+
</ThemeProvider>
29+
</body>
30+
</html>
31+
)
32+
}
33+
34+
35+
36+
import './globals.css'

0 commit comments

Comments
 (0)