[rewrite] Added tasks, more debug options to vscode and slightly updated frontends structure

frontend/src/components/main-navbar.tsx

@@ -8,7 +8,6 @@ import { Menu } from "lucide-react";
 import { Card } from "@/components/ui/card";
 import { ThemeSwitch } from "./theme-switch";
 import { Button } from "@/components/ui/button";
-import { nanoid } from "nanoid";
 import { Link } from "@tanstack/react-router";
 
 const MainNavbar = () => {
@@ -74,52 +73,4 @@ const MainNavbar = () => {
 	);
 };
 
-const landings = [
-	{
-		id: nanoid(),
-		title: "Landing 01",
-		route: "/project-management"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 02",
-		route: "/crm-landing"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 03",
-		route: "/ai-content-landing"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 04",
-		route: "/new-intro-landing"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 05",
-		route: "/about-us-landing"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 06",
-		route: "/contact-us-landing"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 07",
-		route: "/faqs-landing"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 08",
-		route: "/pricing-landing"
-	},
-	{
-		id: nanoid(),
-		title: "Landing 09",
-		route: "/career-landing"
-	}
-];
-
 export default MainNavbar;

frontend/src/components/ui/button.tsx

@@ -1,29 +1,29 @@
 import * as React from "react";
 import { Slot } from "@radix-ui/react-slot";
 import { cva, type VariantProps } from "class-variance-authority";
+
 import { cn } from "@/lib/utils";
 
 const buttonVariants = cva(
-	"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
+	"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
 	{
 		variants: {
 			variant: {
-				default:
-					"bg-primary text-primary-foreground shadow hover:bg-primary/90",
+				default: "bg-primary text-primary-foreground hover:bg-primary/90",
 				destructive:
-					"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+					"bg-destructive text-destructive-foreground hover:bg-destructive/90",
 				outline:
-					"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+					"border border-input bg-background hover:bg-accent hover:text-accent-foreground",
 				secondary:
-					"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+					"bg-secondary text-secondary-foreground hover:bg-secondary/80",
 				ghost: "hover:bg-accent hover:text-accent-foreground",
 				link: "text-primary underline-offset-4 hover:underline"
 			},
 			size: {
-				default: "h-9 px-4 py-2",
-				sm: "h-8 rounded-md px-3 text-xs",
-				lg: "h-10 rounded-md px-8",
-				icon: "h-9 w-9"
+				default: "h-10 px-4 py-2",
+				sm: "h-9 rounded-md px-3",
+				lg: "h-11 rounded-md px-8",
+				icon: "h-10 w-10"
 			}
 		},
 		defaultVariants: {

frontend/src/components/ui/calendar.tsx

@@ -1,6 +1,7 @@
 import * as React from "react";
 import { ChevronLeft, ChevronRight } from "lucide-react";
 import { DayPicker } from "react-day-picker";
+
 import { cn } from "@/lib/utils";
 import { buttonVariants } from "@/components/ui/button";
 
@@ -31,19 +32,13 @@ function Calendar({
 				table: "w-full border-collapse space-y-1",
 				head_row: "flex",
 				head_cell:
-					"text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]",
+					"text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
 				row: "flex w-full mt-2",
-				cell: cn(
-					"relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected].day-range-end)]:rounded-r-md",
-					props.mode === "range"
-						? "[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md"
-						: "[&:has([aria-selected])]:rounded-md"
-				),
+				cell: "h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].day-range-end)]:rounded-r-md [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20",
 				day: cn(
 					buttonVariants({ variant: "ghost" }),
-					"h-8 w-8 p-0 font-normal aria-selected:opacity-100"
+					"h-9 w-9 p-0 font-normal aria-selected:opacity-100"
 				),
-				day_range_start: "day-range-start",
 				day_range_end: "day-range-end",
 				day_selected:
 					"bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",
@@ -57,8 +52,12 @@ function Calendar({
 				...classNames
 			}}
 			components={{
-				IconLeft: () => <ChevronLeft className="h-4 w-4" />,
-				IconRight: () => <ChevronRight className="h-4 w-4" />
+				IconLeft: ({ className, ...props }) => (
+					<ChevronLeft className={cn("h-4 w-4", className)} {...props} />
+				),
+				IconRight: ({ className, ...props }) => (
+					<ChevronRight className={cn("h-4 w-4", className)} {...props} />
+				)
 			}}
 			{...props}
 		/>