From 7813e42e3ac29f0360e36d5d2b753e4860066836 Mon Sep 17 00:00:00 2001 From: cdricms <36056008+cdricms@users.noreply.github.com> Date: Mon, 13 Jan 2025 11:08:33 +0100 Subject: [PATCH] home page --- latosa-frontend/app/layout.tsx | 2 + latosa-frontend/app/page.tsx | 168 ++++--- latosa-frontend/components/features.tsx | 79 ++++ latosa-frontend/components/hero.tsx | 46 ++ latosa-frontend/components/nav-bar.tsx | 416 ++++++++++++++++++ latosa-frontend/components/ui/accordion.tsx | 57 +++ latosa-frontend/components/ui/badge.tsx | 36 ++ .../components/ui/navigation-menu.tsx | 128 ++++++ latosa-frontend/components/ui/select.tsx | 12 +- latosa-frontend/components/ui/sheet.tsx | 138 ++++++ latosa-frontend/package-lock.json | 160 +++++++ latosa-frontend/package.json | 3 + latosa-frontend/tailwind.config.ts | 22 + 13 files changed, 1197 insertions(+), 70 deletions(-) create mode 100644 latosa-frontend/components/features.tsx create mode 100644 latosa-frontend/components/hero.tsx create mode 100644 latosa-frontend/components/nav-bar.tsx create mode 100644 latosa-frontend/components/ui/accordion.tsx create mode 100644 latosa-frontend/components/ui/badge.tsx create mode 100644 latosa-frontend/components/ui/navigation-menu.tsx create mode 100644 latosa-frontend/components/ui/sheet.tsx diff --git a/latosa-frontend/app/layout.tsx b/latosa-frontend/app/layout.tsx index 2c606dd..a0b797c 100644 --- a/latosa-frontend/app/layout.tsx +++ b/latosa-frontend/app/layout.tsx @@ -1,6 +1,7 @@ import type { Metadata } from "next"; import { Geist, Geist_Mono } from "next/font/google"; import "./globals.css"; +import Navbar from "@/components/nav-bar"; const geistSans = Geist({ variable: "--font-geist-sans", @@ -27,6 +28,7 @@ export default function RootLayout({ + {children} diff --git a/latosa-frontend/app/page.tsx b/latosa-frontend/app/page.tsx index abd9a63..0a76db9 100644 --- a/latosa-frontend/app/page.tsx +++ b/latosa-frontend/app/page.tsx @@ -1,69 +1,109 @@ -import { Button } from "@/components/ui/button"; -import { - Card, - CardContent, - CardDescription, - CardFooter, - CardHeader, - CardTitle, -} from "@/components/ui/card"; -import { Input } from "@/components/ui/input"; -import { Label } from "@/components/ui/label"; -import { - Select, - SelectContent, - SelectItem, - SelectTrigger, - SelectValue, -} from "@/components/ui/select"; -import Image from "next/image"; +import Features, { FeatureItem } from "@/components/features"; +import Hero from "@/components/hero"; export default function Home() { return ( - - - Create project - - Deploy your new project in one-click. - - - -
-
-
- - -
-
- - -
-
-
- - - - - - +
+ + + +
    +
  1. + Un Système Centré sur les Concepts{" "} +
      +
    • + Étude et application des meilleurs concepts + et stratégies issus de différentes approches + martiales. +
      • +
    • + Comprendre ce que l’on fait, comment on le + fait et pourquoi on le fait. +
      • +
    +
    2. +
  2. + Éducation au Mouvement et à l’Efficacité +
      +
    • + Plus qu’un enchaînement de techniques : une + véritable éducation aux mouvements corporels + et à l’efficacité des armes. +
      • +
    • + Priorité à l’authenticité et à la réalité. +
      • +
    +
    3. +
+ + +
    +
  1. + + Les Premières Étapes + +
      +
    • + Initialement centré sur les techniques et + mouvements, le système s’est montré efficace + mais incomplet. +
      • +
    • + Recherche de ce qui différencie les arts + martiaux philippins des autres disciplines. +
      • +
    +
    2. +
  2. + + La Découverte des Concepts Clés + {" "} +
      +
    • + Rôle central des concepts de combat : +
        +
      • Puissance dans les frappes.
        • +
      • Blocage ferme.
        • +
      • Équilibre et attitude.
        • +
      +
      • +
    • + Restructuration des exercices pour intégrer + et transmettre ces concepts fondamentaux. +
      • +
    +
    3. +
+ + + Latosa Escrima Concepts repose sur cinq concepts + fondamentaux : +
    +
  • Équilibre
    • +
  • Vitesse (Timing et Distance)
    • +
  • Puissance
    • +
  • Concentration
    • +
  • Transition
    • +
+ + +
); } diff --git a/latosa-frontend/components/features.tsx b/latosa-frontend/components/features.tsx new file mode 100644 index 0000000..94988d5 --- /dev/null +++ b/latosa-frontend/components/features.tsx @@ -0,0 +1,79 @@ +import { ArrowRight } from "lucide-react"; + +const Features: React.FC< + React.PropsWithChildren<{ + title: string; + description: string; + cta: string; + }> +> = ({ title, description, cta, children }) => { + return ( +
+
+
+

+ {title} +

+

+ {description} +

+ + {cta} + + +
+
+ {children} +
+
+
+ ); +}; + +export default Features; + +export const FeatureItem: React.FC< + React.PropsWithChildren<{ + title: string; + image: string; + position: "left" | "right"; + }> +> = ({ title, children, image, position }) => { + const _image = () => ( +
+ {title} +
+ ); + const _content = () => ( +
+

+ {title} +

+
{children}
+
+ ); + return ( +
+ {position === "left" ? ( + <> + <_image /> + <_content /> + + ) : ( + <> + <_content /> + <_image /> + + )} +
+ ); +}; diff --git a/latosa-frontend/components/hero.tsx b/latosa-frontend/components/hero.tsx new file mode 100644 index 0000000..42e5de1 --- /dev/null +++ b/latosa-frontend/components/hero.tsx @@ -0,0 +1,46 @@ +import { ExternalLink } from "lucide-react"; + +import { cn } from "@/lib/utils"; + +import { Badge } from "@/components/ui/badge"; +import { Button, buttonVariants } from "@/components/ui/button"; + +const Hero = () => { + return ( +
+
+
+
+
+ logo + Latosa-Escrima +
+

+ Trouvez votre équilibre avec Latosa-Escrima +

+

+ Une évolution des arts martiaux Philippins +

+
+
+ + +
+
+
+
+
+ ); +}; + +export default Hero; diff --git a/latosa-frontend/components/nav-bar.tsx b/latosa-frontend/components/nav-bar.tsx new file mode 100644 index 0000000..2f3f793 --- /dev/null +++ b/latosa-frontend/components/nav-bar.tsx @@ -0,0 +1,416 @@ +import { Book, Menu, Sunset, Trees, Zap } from "lucide-react"; + +import { cn } from "@/lib/utils"; + +import { + Accordion, + AccordionContent, + AccordionItem, + AccordionTrigger, +} from "@/components/ui/accordion"; +import { Button, buttonVariants } from "@/components/ui/button"; +import { + NavigationMenu, + NavigationMenuContent, + NavigationMenuItem, + NavigationMenuLink, + NavigationMenuList, + NavigationMenuTrigger, + navigationMenuTriggerStyle, +} from "@/components/ui/navigation-menu"; +import { + Sheet, + SheetContent, + SheetHeader, + SheetTitle, + SheetTrigger, +} from "@/components/ui/sheet"; + +const subMenuItemsOne = [ + { + title: "Blog", + description: "The latest industry news, updates, and info", + icon: , + }, + { + title: "Compnay", + description: "Our mission is to innovate and empower the world", + icon: , + }, + { + title: "Careers", + description: "Browse job listing and discover our workspace", + icon: , + }, + { + title: "Support", + description: + "Get in touch with our support team or visit our community forums", + icon: , + }, +]; + +const subMenuItemsTwo = [ + { + title: "Help Center", + description: "Get all the answers you need right here", + icon: , + }, + { + title: "Contact Us", + description: "We are here to help you with any questions you have", + icon: , + }, + { + title: "Status", + description: "Check the current status of our services and APIs", + icon: , + }, + { + title: "Terms of Service", + description: "Our terms and conditions for using our services", + icon: , + }, +]; + +const Navbar = () => { + return ( +
+
+ +
+
+
+ logo + + Shadcn Blocks + +
+ + + + + + + +
+ logo + + Shadcn Blocks + +
+ + +
+ + Home + + + + + Products + + + {subMenuItemsOne.map( + (item, idx) => ( + + {item.icon} +
+
+ {item.title} +
+

+ { + item.description + } +

+
+ + ), + )} + + + + + Resources + + + {subMenuItemsTwo.map( + (item, idx) => ( + + {item.icon} +
+
+ {item.title} +
+

+ { + item.description + } +

+
+ + ), + )} + + + + + Pricing + + + Blog + +
+ + + +
+
+
+
+ ); +}; + +export default Navbar; diff --git a/latosa-frontend/components/ui/accordion.tsx b/latosa-frontend/components/ui/accordion.tsx new file mode 100644 index 0000000..772b183 --- /dev/null +++ b/latosa-frontend/components/ui/accordion.tsx @@ -0,0 +1,57 @@ +"use client"; + +import * as React from "react"; +import * as AccordionPrimitive from "@radix-ui/react-accordion"; +import { ChevronDown } from "lucide-react"; + +import { cn } from "@/lib/utils"; + +const Accordion = AccordionPrimitive.Root; + +const AccordionItem = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +AccordionItem.displayName = "AccordionItem"; + +const AccordionTrigger = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + svg]:rotate-180", + className, + )} + {...props} + > + {children} + + + +)); +AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName; + +const AccordionContent = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + +
{children}
+ +)); +AccordionContent.displayName = AccordionPrimitive.Content.displayName; + +export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }; diff --git a/latosa-frontend/components/ui/badge.tsx b/latosa-frontend/components/ui/badge.tsx new file mode 100644 index 0000000..b5a6bd1 --- /dev/null +++ b/latosa-frontend/components/ui/badge.tsx @@ -0,0 +1,36 @@ +import * as React from "react"; +import { cva, type VariantProps } from "class-variance-authority"; + +import { cn } from "@/lib/utils"; + +const badgeVariants = cva( + "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", + { + variants: { + variant: { + default: + "border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80", + secondary: + "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80", + destructive: + "border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80", + outline: "text-foreground", + }, + }, + defaultVariants: { + variant: "default", + }, + }, +); + +export interface BadgeProps + extends React.HTMLAttributes, + VariantProps {} + +function Badge({ className, variant, ...props }: BadgeProps) { + return ( +
+ ); +} + +export { Badge, badgeVariants }; diff --git a/latosa-frontend/components/ui/navigation-menu.tsx b/latosa-frontend/components/ui/navigation-menu.tsx new file mode 100644 index 0000000..17334d7 --- /dev/null +++ b/latosa-frontend/components/ui/navigation-menu.tsx @@ -0,0 +1,128 @@ +import * as React from "react"; +import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu"; +import { cva } from "class-variance-authority"; +import { ChevronDown } from "lucide-react"; + +import { cn } from "@/lib/utils"; + +const NavigationMenu = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + {children} + + +)); +NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName; + +const NavigationMenuList = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName; + +const NavigationMenuItem = NavigationMenuPrimitive.Item; + +const navigationMenuTriggerStyle = cva( + "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-accent/50", +); + +const NavigationMenuTrigger = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + {children}{" "} + +)); +NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName; + +const NavigationMenuContent = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName; + +const NavigationMenuLink = NavigationMenuPrimitive.Link; + +const NavigationMenuViewport = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( +
+ +
+)); +NavigationMenuViewport.displayName = + NavigationMenuPrimitive.Viewport.displayName; + +const NavigationMenuIndicator = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +
+ +)); +NavigationMenuIndicator.displayName = + NavigationMenuPrimitive.Indicator.displayName; + +export { + navigationMenuTriggerStyle, + NavigationMenu, + NavigationMenuList, + NavigationMenuItem, + NavigationMenuContent, + NavigationMenuTrigger, + NavigationMenuLink, + NavigationMenuIndicator, + NavigationMenuViewport, +}; diff --git a/latosa-frontend/components/ui/select.tsx b/latosa-frontend/components/ui/select.tsx index 204704d..30fcaa5 100644 --- a/latosa-frontend/components/ui/select.tsx +++ b/latosa-frontend/components/ui/select.tsx @@ -33,7 +33,7 @@ const SelectTrigger = React.forwardRef< SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; const SelectScrollUpButton = React.forwardRef< - React.ElementRef, + React.ComponentRef, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( , + React.ComponentRef, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( , + React.ComponentRef, React.ComponentPropsWithoutRef >(({ className, children, position = "popper", ...props }, ref) => ( @@ -100,7 +100,7 @@ const SelectContent = React.forwardRef< SelectContent.displayName = SelectPrimitive.Content.displayName; const SelectLabel = React.forwardRef< - React.ElementRef, + React.ComponentRef, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( , + React.ComponentRef, React.ComponentPropsWithoutRef >(({ className, children, ...props }, ref) => ( , + React.ComponentRef, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( , + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SheetOverlay.displayName = SheetPrimitive.Overlay.displayName; + +const sheetVariants = cva( + "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out", + { + variants: { + side: { + top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top", + bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", + left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm", + right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm", + }, + }, + defaultVariants: { + side: "right", + }, + }, +); + +interface SheetContentProps + extends React.ComponentPropsWithoutRef, + VariantProps {} + +const SheetContent = React.forwardRef< + React.ComponentRef, + SheetContentProps +>(({ side = "right", className, children, ...props }, ref) => ( + + + + + + Close + + {children} + + +)); +SheetContent.displayName = SheetPrimitive.Content.displayName; + +const SheetHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +SheetHeader.displayName = "SheetHeader"; + +const SheetFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+); +SheetFooter.displayName = "SheetFooter"; + +const SheetTitle = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SheetTitle.displayName = SheetPrimitive.Title.displayName; + +const SheetDescription = React.forwardRef< + React.ComponentRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)); +SheetDescription.displayName = SheetPrimitive.Description.displayName; + +export { + Sheet, + SheetPortal, + SheetOverlay, + SheetTrigger, + SheetClose, + SheetContent, + SheetHeader, + SheetFooter, + SheetTitle, + SheetDescription, +}; diff --git a/latosa-frontend/package-lock.json b/latosa-frontend/package-lock.json index e327ff9..1d25209 100644 --- a/latosa-frontend/package-lock.json +++ b/latosa-frontend/package-lock.json @@ -8,7 +8,10 @@ "name": "latosa-frontend", "version": "0.1.0", "dependencies": { + "@radix-ui/react-accordion": "^1.2.2", + "@radix-ui/react-dialog": "^1.1.4", "@radix-ui/react-label": "^2.1.1", + "@radix-ui/react-navigation-menu": "^1.2.3", "@radix-ui/react-select": "^2.1.4", "@radix-ui/react-slot": "^1.1.1", "class-variance-authority": "^0.7.1", @@ -923,6 +926,37 @@ "integrity": "sha512-SJ31y+Q/zAyShtXJc8x83i9TYdbAfHZ++tUZnvjJJqFjzsdUnKsxPL6IEtBlxKkU7yzer//GQtZSV4GbldL3YA==", "license": "MIT" }, + "node_modules/@radix-ui/react-accordion": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-accordion/-/react-accordion-1.2.2.tgz", + "integrity": "sha512-b1oh54x4DMCdGsB4/7ahiSrViXxaBwRPotiZNnYXjLha9vfuURSAZErki6qjDoSIV0eXx5v57XnTGVtGwnfp2g==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-collapsible": "1.1.2", + "@radix-ui/react-collection": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-direction": "1.1.0", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-primitive": "2.0.1", + "@radix-ui/react-use-controllable-state": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-arrow": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-arrow/-/react-arrow-1.1.1.tgz", @@ -946,6 +980,36 @@ } } }, + "node_modules/@radix-ui/react-collapsible": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-collapsible/-/react-collapsible-1.1.2.tgz", + "integrity": "sha512-PliMB63vxz7vggcyq0IxNYk8vGDrLXVWw4+W4B8YnwI1s18x7YZYqlG9PLX7XxAJUi0g2DxP4XKJMFHh/iVh9A==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-presence": "1.1.2", + "@radix-ui/react-primitive": "2.0.1", + "@radix-ui/react-use-controllable-state": "1.1.0", + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-collection": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-collection/-/react-collection-1.1.1.tgz", @@ -1002,6 +1066,42 @@ } } }, + "node_modules/@radix-ui/react-dialog": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/@radix-ui/react-dialog/-/react-dialog-1.1.4.tgz", + "integrity": "sha512-Ur7EV1IwQGCyaAuyDRiOLA5JIUZxELJljF+MbM/2NC0BYwfuRrbpS30BiQBJrVruscgUkieKkqXYDOoByaxIoA==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-dismissable-layer": "1.1.3", + "@radix-ui/react-focus-guards": "1.1.1", + "@radix-ui/react-focus-scope": "1.1.1", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-portal": "1.1.3", + "@radix-ui/react-presence": "1.1.2", + "@radix-ui/react-primitive": "2.0.1", + "@radix-ui/react-slot": "1.1.1", + "@radix-ui/react-use-controllable-state": "1.1.0", + "aria-hidden": "^1.1.1", + "react-remove-scroll": "^2.6.1" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-direction": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/@radix-ui/react-direction/-/react-direction-1.1.0.tgz", @@ -1125,6 +1225,42 @@ } } }, + "node_modules/@radix-ui/react-navigation-menu": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/@radix-ui/react-navigation-menu/-/react-navigation-menu-1.2.3.tgz", + "integrity": "sha512-IQWAsQ7dsLIYDrn0WqPU+cdM7MONTv9nqrLVYoie3BPiabSfUVDe6Fr+oEt0Cofsr9ONDcDe9xhmJbL1Uq1yKg==", + "license": "MIT", + "dependencies": { + "@radix-ui/primitive": "1.1.1", + "@radix-ui/react-collection": "1.1.1", + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-context": "1.1.1", + "@radix-ui/react-direction": "1.1.0", + "@radix-ui/react-dismissable-layer": "1.1.3", + "@radix-ui/react-id": "1.1.0", + "@radix-ui/react-presence": "1.1.2", + "@radix-ui/react-primitive": "2.0.1", + "@radix-ui/react-use-callback-ref": "1.1.0", + "@radix-ui/react-use-controllable-state": "1.1.0", + "@radix-ui/react-use-layout-effect": "1.1.0", + "@radix-ui/react-use-previous": "1.1.0", + "@radix-ui/react-visually-hidden": "1.1.1" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-popper": { "version": "1.2.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-popper/-/react-popper-1.2.1.tgz", @@ -1181,6 +1317,30 @@ } } }, + "node_modules/@radix-ui/react-presence": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/@radix-ui/react-presence/-/react-presence-1.1.2.tgz", + "integrity": "sha512-18TFr80t5EVgL9x1SwF/YGtfG+l0BS0PRAlCWBDoBEiDQjeKgnNZRVJp/oVBl24sr3Gbfwc/Qpj4OcWTQMsAEg==", + "license": "MIT", + "dependencies": { + "@radix-ui/react-compose-refs": "1.1.1", + "@radix-ui/react-use-layout-effect": "1.1.0" + }, + "peerDependencies": { + "@types/react": "*", + "@types/react-dom": "*", + "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + }, + "@types/react-dom": { + "optional": true + } + } + }, "node_modules/@radix-ui/react-primitive": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.0.1.tgz", diff --git a/latosa-frontend/package.json b/latosa-frontend/package.json index 614df50..89268ba 100644 --- a/latosa-frontend/package.json +++ b/latosa-frontend/package.json @@ -9,7 +9,10 @@ "lint": "next lint" }, "dependencies": { + "@radix-ui/react-accordion": "^1.2.2", + "@radix-ui/react-dialog": "^1.1.4", "@radix-ui/react-label": "^2.1.1", + "@radix-ui/react-navigation-menu": "^1.2.3", "@radix-ui/react-select": "^2.1.4", "@radix-ui/react-slot": "^1.1.1", "class-variance-authority": "^0.7.1", diff --git a/latosa-frontend/tailwind.config.ts b/latosa-frontend/tailwind.config.ts index 5f8e2f0..20c4a37 100644 --- a/latosa-frontend/tailwind.config.ts +++ b/latosa-frontend/tailwind.config.ts @@ -56,6 +56,28 @@ export default { md: "calc(var(--radius) - 2px)", sm: "calc(var(--radius) - 4px)", }, + keyframes: { + "accordion-down": { + from: { + height: "0", + }, + to: { + height: "var(--radix-accordion-content-height)", + }, + }, + "accordion-up": { + from: { + height: "var(--radix-accordion-content-height)", + }, + to: { + height: "0", + }, + }, + }, + animation: { + "accordion-down": "accordion-down 0.2s ease-out", + "accordion-up": "accordion-up 0.2s ease-out", + }, }, }, plugins: [require("tailwindcss-animate")],