diff --git a/app/page.tsx b/app/page.tsx index 340011d..756943e 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,17 +1,19 @@ import { HeroSection } from "@/components/hero"; -import { Programs } from "@/components/programs"; +import Services from "@/components/programs"; import { Partners } from "@/components/footer/partners"; import StickyEventBottomBanner from "@/components/sticky-bottom-banner"; import Contributors from "@/components/contributers"; +import CommunitySupport from "@/components/community"; export default function IndexPage() { return ( -
+
- - + + +
diff --git a/bun.lockb b/bun.lockb index 00d85e0..646bec9 100755 Binary files a/bun.lockb and b/bun.lockb differ diff --git a/components/community/index.tsx b/components/community/index.tsx new file mode 100644 index 0000000..1fa30c0 --- /dev/null +++ b/components/community/index.tsx @@ -0,0 +1,133 @@ +import Link from "next/link" + +const MyCommunitySections = [ + { + title: "Getting Started", + links: [ + { + title: "Introduction to Codenight", + link: "", + }, + { + title: "About Codenight", + link: "", + }, + { + title: "Technical Steering Committee", + link: "", + }, + { + title: "Governance model", + link: "", + }, + { + title: "Working Groups", + link: "", + }, + ], + }, + { + title: "Projects", + links: [ + { + title: "Project #1", + link: "", + }, + { + title: "Project #2", + link: "", + }, + { + title: "Project #3", + link: "", + }, + { + title: "Project #4", + link: "", + }, + { + title: "Project #5", + link: "", + }, + ], + }, + { + title: "Contributing", + links: [ + { + title: "Contributing guidelines", + link: "", + }, + { + title: "Code contributions", + link: "", + }, + { + title: "Documentation contributions", + link: "", + }, + { + title: "Management contributions", + link: "", + }, + ], + }, + { + title: "Safety & Support", + links: [ + { + title: "Community Code of Conduct", + link: "", + }, + { + title: "Community support", + link: "", + }, + ], + }, + { + title: "Miscellaneous", + links: [ + { + title: "Frequently Asked Questions", + link: "", + }, + { + title: "Join moja global", + link: "", + }, + ], + }, +] + + +export default function Community() { + return ( +
+
+

+ Know the Community +

+
+ {MyCommunitySections.map(({ title, links }, key) => ( +
+

{title}

+
+ {links.map(({ title, link }, index) => ( +
+ +

{title}

+ +
+ ))} +
+
+ ))} +
+
+
+ ) +} diff --git a/components/events/dev-pic-component.tsx b/components/events/dev-pic-component.tsx index 57498d5..e475411 100644 --- a/components/events/dev-pic-component.tsx +++ b/components/events/dev-pic-component.tsx @@ -79,7 +79,7 @@ export const DevPicComponent = ({ indx={indx} product={product} translate={translateX} - key={product.title} + key={indx} /> ))} @@ -89,7 +89,8 @@ export const DevPicComponent = ({ indx={indx} product={product} translate={translateXReverse} - key={product.title} + key={indx} + /> ))} @@ -99,7 +100,8 @@ export const DevPicComponent = ({ indx={indx} product={product} translate={translateX} - key={product.title} + key={indx} + /> ))} @@ -150,7 +152,8 @@ export const ProductCard = ({ whileHover={{ y: -20, }} - key={product.title} + key={indx} + className="relative group/product h-96 w-[30rem] flex-shrink-0" > - {people.map((person) => ( -
  • + {people.map((person, index) => ( +
  • ( - @@ -14,7 +14,7 @@ export const Partners = () => ( - @@ -22,7 +22,7 @@ export const Partners = () => ( - + @@ -103,27 +103,27 @@ export const Partners = () => ( - - - - - - - - diff --git a/components/hero/index.tsx b/components/hero/index.tsx index 8cb9779..223b9ae 100644 --- a/components/hero/index.tsx +++ b/components/hero/index.tsx @@ -1,56 +1,52 @@ -/** - * v0 by Vercel. - * @see https://v0.dev/t/b6yCYVIVCHM - * Documentation: https://v0.dev/docs#integrating-generated-code-into-your-nextjs-app - */ -import Image from 'next/image'; - -import Link from "next/link" -import { Icons } from "../icons"; export function HeroSection() { return ( -
    -
    -
    -

    - DEVELOPERS - MEETUP EVENT -

    -

    - Experience a day of innovation at Code Night - Community's event! Connect with industry - leaders in networking sessions and panel - discussions, dive into our hackathon and - game session, meet virtual friends in person - during "Unveiling Voices," gain insights from - developers, remote workers, and freelancers, - and explore open-source tech with AASTU - and AAU communities. Don't miss out—join - us and be part of the excitement! +

    +
    + +     -
    - Custom Moon - {/* Image */}
    -
    +
    • ) } diff --git a/components/icons.tsx b/components/icons.tsx index e7c4eb0..0795e06 100644 --- a/components/icons.tsx +++ b/components/icons.tsx @@ -1,13 +1,12 @@ +import Image from 'next/image'; import { LucideProps, Moon, SunMedium, - Twitter, User, Linkedin, type Icon as LucideIcon, } from "lucide-react" -import Image from 'next/image'; export type Icon = LucideIcon @@ -435,10 +434,22 @@ export const Icons = { ), - - - - - - + menuIcon: (props: LucideProps) => ( + + + + + + ), } diff --git a/components/main-nav.tsx b/components/main-nav.tsx index 269fa30..b7000af 100644 --- a/components/main-nav.tsx +++ b/components/main-nav.tsx @@ -1,6 +1,9 @@ +"use client" import * as React from "react" import Link from "next/link" - +import { Button } from "@/components/ui/button" +import { SheetTrigger, SheetContent, Sheet } from "@/components/ui/sheet" +import { NavigationMenuLink, NavigationMenuList, NavigationMenu } from "@/components/ui/navigation-menu" import { NavItem } from "@/types/nav" import { siteConfig } from "@/config/site" import { cn } from "@/lib/utils" @@ -10,7 +13,7 @@ interface MainNavProps { items?: NavItem[] } -export function MainNav({ items }: MainNavProps) { +export function MainNav2({ items }: MainNavProps) { return (
    @@ -39,3 +42,57 @@ export function MainNav({ items }: MainNavProps) {
    ) } + + +export function MainNav({ items }: MainNavProps) { + return ( +
    + + + + + + + + {siteConfig.name} + +
    + {items?.map( + (item, index) => + item.href && ( + + {item.title} + + ))} +
    +     +     + + + {siteConfig.name} + + + + {items?.map( + (item, index) => + item.href && ( + + + {item.title} + + + ))} + + +
    + ) +} + + + diff --git a/components/programs/index.tsx b/components/programs/index.tsx index 100694a..4172a57 100644 --- a/components/programs/index.tsx +++ b/components/programs/index.tsx @@ -30,14 +30,7 @@ const programs = [ }, ]; - - -/** - * v0 by Vercel. - * @see https://v0.dev/t/76MVgUUNEYZ - * Documentation: https://v0.dev/docs#integrating-generated-code-into-your-nextjs-app - */ -export function Programs() { +export default function Services() { return (

    Services

    diff --git a/components/site-header.tsx b/components/site-header.tsx index a0632b6..24a896e 100644 --- a/components/site-header.tsx +++ b/components/site-header.tsx @@ -9,44 +9,9 @@ import { ThemeToggle } from "@/components/theme-toggle" export function SiteHeader() { return (
    -
    +
    -
    - -
    +
    ) diff --git a/components/theme-toggle.tsx b/components/theme-toggle.tsx index 01e846c..480d2f8 100644 --- a/components/theme-toggle.tsx +++ b/components/theme-toggle.tsx @@ -10,14 +10,13 @@ export function ThemeToggle() { const { setTheme, theme } = useTheme() return ( - +
    ) } diff --git a/components/ui/events/dev-pic-component.tsx b/components/ui/events/dev-pic-component.tsx index 57498d5..709b981 100644 --- a/components/ui/events/dev-pic-component.tsx +++ b/components/ui/events/dev-pic-component.tsx @@ -79,7 +79,7 @@ export const DevPicComponent = ({ indx={indx} product={product} translate={translateX} - key={product.title} + key={indx} /> ))} @@ -89,7 +89,7 @@ export const DevPicComponent = ({ indx={indx} product={product} translate={translateXReverse} - key={product.title} + key={indx} /> ))} @@ -99,7 +99,7 @@ export const DevPicComponent = ({ indx={indx} product={product} translate={translateX} - key={product.title} + key={indx} /> ))} diff --git a/components/ui/navigation-menu.tsx b/components/ui/navigation-menu.tsx new file mode 100644 index 0000000..1419f56 --- /dev/null +++ b/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.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + {children} + + +)) +NavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName + +const NavigationMenuList = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +NavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName + +const NavigationMenuItem = NavigationMenuPrimitive.Item + +const navigationMenuTriggerStyle = cva( + "group inline-flex h-10 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.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + {children}{" "} + +)) +NavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName + +const NavigationMenuContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +NavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName + +const NavigationMenuLink = NavigationMenuPrimitive.Link + +const NavigationMenuViewport = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( +
    + +
    +)) +NavigationMenuViewport.displayName = + NavigationMenuPrimitive.Viewport.displayName + +const NavigationMenuIndicator = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +
    + +)) +NavigationMenuIndicator.displayName = + NavigationMenuPrimitive.Indicator.displayName + +export { + navigationMenuTriggerStyle, + NavigationMenu, + NavigationMenuList, + NavigationMenuItem, + NavigationMenuContent, + NavigationMenuTrigger, + NavigationMenuLink, + NavigationMenuIndicator, + NavigationMenuViewport, +} diff --git a/components/ui/sheet.tsx b/components/ui/sheet.tsx new file mode 100644 index 0000000..d64a6fa --- /dev/null +++ b/components/ui/sheet.tsx @@ -0,0 +1,138 @@ +import * as React from "react" +import * as SheetPrimitive from "@radix-ui/react-dialog" +import { cva, type VariantProps } from "class-variance-authority" +import { X } from "lucide-react" + +import { cn } from "@/lib/utils" + +const Sheet = SheetPrimitive.Root + +const SheetTrigger = SheetPrimitive.Trigger + +const SheetClose = SheetPrimitive.Close + +const SheetPortal = SheetPrimitive.Portal + +const SheetOverlay = React.forwardRef< + React.ElementRef, + 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=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500", + { + 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.ElementRef, + SheetContentProps +>(({ side = "right", className, children, ...props }, ref) => ( + + + + {children} + + + Close + + + +)) +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.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +SheetTitle.displayName = SheetPrimitive.Title.displayName + +const SheetDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +SheetDescription.displayName = SheetPrimitive.Description.displayName + +export { + Sheet, + SheetPortal, + SheetOverlay, + SheetTrigger, + SheetClose, + SheetContent, + SheetHeader, + SheetFooter, + SheetTitle, + SheetDescription, +} diff --git a/package.json b/package.json index 086eca3..432b3f5 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "@radix-ui/react-dialog": "^1.0.5", "@radix-ui/react-dropdown-menu": "^2.0.6", "@radix-ui/react-label": "^2.0.2", + "@radix-ui/react-navigation-menu": "^1.1.4", "@radix-ui/react-popover": "^1.0.7", "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", @@ -63,8 +64,6 @@ "@typescript-eslint/parser": "^5.61.0", "autoprefixer": "^10.4.14", "drizzle-kit": "^0.20.9", - "eslint": "^8.44.0", - "eslint-config-next": "latest", "eslint-config-prettier": "^8.8.0", "eslint-plugin-react": "^7.32.2", "eslint-plugin-tailwindcss": "^3.13.0", diff --git a/tailwind.config.js b/tailwind.config.js index ffdff01..d5eeae3 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -7,7 +7,7 @@ module.exports = { theme: { container: { center: true, - padding: "2rem", + padding: "1rem", screens: { "2xl": "1400px", },