-
Coming Soon
+
+
{siteConfig.name}
+
+
Home Page
);
-}
\ No newline at end of file
+}
diff --git a/src/app/providers.tsx b/src/app/providers.tsx
index be02117..08e75ea 100644
--- a/src/app/providers.tsx
+++ b/src/app/providers.tsx
@@ -1,8 +1,28 @@
-'use client';
+// "use client";
-import './globals.css';
-import { NextUIProvider } from '@nextui-org/react';
+// import "./globals.css";
+// import { NextUIProvider } from '@nextui-org/react';
-export function Providers({ children }: { children: React.ReactNode }) {
- return
{children};
+// export function Providers({ children }: { children: React.ReactNode }) {
+// return
{children};
+// }
+
+"use client";
+
+import * as React from "react";
+import { NextUIProvider } from "@nextui-org/system";
+import { ThemeProvider as NextThemesProvider } from "next-themes";
+import { ThemeProviderProps } from "next-themes/dist/types";
+
+export interface ProvidersProps {
+ children: React.ReactNode;
+ themeProps?: ThemeProviderProps;
+}
+
+export function Providers({ children, themeProps }: ProvidersProps) {
+ return (
+
+ {children}
+
+ );
}
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
new file mode 100644
index 0000000..edbedfc
--- /dev/null
+++ b/src/components/Footer.tsx
@@ -0,0 +1,11 @@
+import { siteConfig } from "@/config/site";
+
+export default function Footer() {
+ return (
+
+ );
+}
diff --git a/src/components/box.tsx b/src/components/box.tsx
new file mode 100644
index 0000000..5be63a8
--- /dev/null
+++ b/src/components/box.tsx
@@ -0,0 +1,17 @@
+import React from 'react';
+
+const Box = ({ icon, name, para }: any) => {
+ return (
+
+
+
{icon}
+
+ {name}
+
+
{para}
+
+
+ );
+};
+
+export default Box;
diff --git a/src/components/icons.tsx b/src/components/icons.tsx
new file mode 100644
index 0000000..5697f69
--- /dev/null
+++ b/src/components/icons.tsx
@@ -0,0 +1,76 @@
+import {
+ RiFacebookLine,
+ RiGithubLine,
+ RiInstagramLine,
+ RiLinkedinLine,
+ RiTwitterXLine,
+} from 'react-icons/ri';
+import { MdDarkMode, MdLightMode } from 'react-icons/md';
+import Image from 'next/image';
+
+const iconSize = 18;
+const className = 'text-default-500 hover:text-[#1E50FF] transition-all duration-300 ease-in-out';
+
+interface ThemedImageProps {
+ className?: string;
+ width?: number;
+ height?: number;
+ priority?: boolean;
+}
+
+export const Logo = ({
+ className,
+ width = 200,
+ height = 112.5,
+ priority = false,
+}: ThemedImageProps) => (
+ <>
+ {/* When the theme is dark */}
+
+
+ {/* When the theme is light */}
+
+
+);
+
+export const FacebookIcon = () => {
+ return
;
+};
+
+export const InstagramIcon = () => {
+ return
;
+};
+
+export const TwitterIcon = () => {
+ return
;
+};
+
+export const GithubIcon = () => {
+ return
;
+};
+
+export const LinkedinIcon = () => {
+ return
;
+};
+
+export const DarkModeIcon = () => {
+ return
;
+};
+
+export const LightModeIcon = () => {
+ return
;
+};
diff --git a/src/components/map.tsx b/src/components/map.tsx
new file mode 100644
index 0000000..1f85dd3
--- /dev/null
+++ b/src/components/map.tsx
@@ -0,0 +1,23 @@
+import { motion } from 'framer-motion';
+import { fadeIn } from '../utils/variants';
+
+export default function Map() {
+ return (
+
+
+
+ );
+}
diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx
new file mode 100644
index 0000000..fd0444e
--- /dev/null
+++ b/src/components/navbar.tsx
@@ -0,0 +1,136 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import {
+ Navbar as NextUINavbar,
+ NavbarContent,
+ NavbarMenu,
+ NavbarMenuToggle,
+ NavbarBrand,
+ NavbarItem,
+ NavbarMenuItem,
+} from '@nextui-org/navbar';
+import { Button } from '@nextui-org/react';
+import { Link } from '@nextui-org/link';
+import { link as linkStyles } from '@nextui-org/theme';
+import { siteConfig } from '@/config/site';
+import NextLink from 'next/link';
+import clsx from 'clsx';
+import { usePathname } from 'next/navigation';
+import { Logo } from '@/components/icons';
+
+export const Navbar = () => {
+ const [scrolling, setScrolling] = useState(false);
+ const pathname = usePathname();
+
+ useEffect(() => {
+ const handleScroll = () => {
+ if (window.scrollY > 50) {
+ setScrolling(true);
+ } else {
+ setScrolling(false);
+ }
+ };
+
+ window.addEventListener('scroll', handleScroll);
+
+ return () => {
+ window.removeEventListener('scroll', handleScroll);
+ };
+ }, []);
+
+ return (
+
+
+
+
+
+
+
+
+
+
+
+ {siteConfig.navItems.map((item) => (
+
+
+ {item.label}
+
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {siteConfig.navItems.map((item, index) => (
+
+
+ {item.label}
+
+
+ ))}
+
+
+
+ Membership
+
+
+
+
+
+ );
+};
diff --git a/src/components/social.tsx b/src/components/social.tsx
new file mode 100644
index 0000000..bf7cc91
--- /dev/null
+++ b/src/components/social.tsx
@@ -0,0 +1,43 @@
+'use client';
+
+import {
+ RiInstagramLine,
+ RiFacebookLine,
+ RiGithubLine,
+ RiLinkedinLine,
+ RiTwitterXLine,
+} from 'react-icons/ri';
+import Link from 'next/link';
+
+export const socialData = [
+ { path: 'https://instagram.com/nibmcs', icon:
},
+ { path: 'https://facebook.com/nibmcs', icon:
},
+ { path: 'https://github.com/nibmcs', icon:
},
+ { path: 'https://linkedin.com/company/nibmcs', icon:
},
+ { path: 'https://twitter.com/nibmcs', icon:
},
+];
+
+const Social = () => {
+ return (
+
+
+ {socialData.map((link, index) => {
+ return (
+
+
+ {link.icon}
+
+
+ );
+ })}
+
+
+ );
+};
+
+export default Social;
diff --git a/src/components/theme-switch.tsx b/src/components/theme-switch.tsx
new file mode 100644
index 0000000..e4089bc
--- /dev/null
+++ b/src/components/theme-switch.tsx
@@ -0,0 +1,79 @@
+"use client";
+
+import { FC } from "react";
+import { VisuallyHidden } from "@react-aria/visually-hidden";
+import { SwitchProps, useSwitch } from "@nextui-org/switch";
+import { useTheme } from "next-themes";
+import { useIsSSR } from "@react-aria/ssr";
+import clsx from "clsx";
+
+import { DarkModeIcon, LightModeIcon } from "@/components/icons";
+
+export interface ThemeSwitchProps {
+ className?: string;
+ classNames?: SwitchProps["classNames"];
+}
+
+export const ThemeSwitch: FC
= ({
+ className,
+ classNames,
+}) => {
+ const { theme, setTheme } = useTheme();
+ const isSSR = useIsSSR();
+
+ const onChange = () => {
+ theme === "light" ? setTheme("dark") : setTheme("light");
+ };
+
+ const {
+ Component,
+ slots,
+ isSelected,
+ getBaseProps,
+ getInputProps,
+ getWrapperProps,
+ } = useSwitch({
+ isSelected: theme === "light" || isSSR,
+ "aria-label": `Switch to ${
+ theme === "light" || isSSR ? "dark" : "light"
+ } mode`,
+ onChange,
+ });
+
+ return (
+
+
+
+
+
+ {!isSelected || isSSR ? : }
+
+
+ );
+};
diff --git a/src/config/fonts.ts b/src/config/fonts.ts
new file mode 100644
index 0000000..43a02f4
--- /dev/null
+++ b/src/config/fonts.ts
@@ -0,0 +1,8 @@
+import { Poppins } from 'next/font/google';
+
+export const fontSans = Poppins({
+ subsets: ['latin'],
+ weight: ['400', '500', '600', '700', '800'],
+ variable: '--font-sans',
+ style: 'normal',
+});
diff --git a/src/config/site.ts b/src/config/site.ts
new file mode 100644
index 0000000..c09a802
--- /dev/null
+++ b/src/config/site.ts
@@ -0,0 +1,41 @@
+export type SiteConfig = typeof siteConfig;
+
+export const siteConfig = {
+ name: 'NIBM Computing Society',
+ description:
+ 'We are a student community organization for the NIBM - Sri Lanka, established with the aim of enabling us to learn, share, and build our professions.',
+ navItems: [
+ {
+ label: 'Events',
+ href: '/events',
+ active: false,
+ },
+ {
+ label: 'Leaderboard',
+ href: '/leaderboard',
+ active: false,
+ },
+ {
+ label: 'Blog',
+ href: '/blog',
+ active: false,
+ },
+ {
+ label: 'About',
+ href: '/about',
+ active: false,
+ },
+ {
+ label: 'Contact',
+ href: '/contact',
+ active: false,
+ },
+ ],
+ // links: {
+ // facebook: 'https://facebook.com/nibmcs',
+ // instagram: 'https://instagram.com/nibmcs',
+ // twitter: 'https://twitter.com/nibmcs',
+ // linkedin: 'https://linkedin.com/company/nibmcs',
+ // github: 'https://github.com/nibmcs',
+ // },
+};
diff --git a/src/utils/variants.ts b/src/utils/variants.ts
new file mode 100644
index 0000000..d1c8af1
--- /dev/null
+++ b/src/utils/variants.ts
@@ -0,0 +1,26 @@
+export const fadeIn = (direction: any, delay: any) => {
+ return {
+ hidden: {
+ y: direction === 'up' ? 80 : direction === 'down' ? -80 : 0,
+ opacity: 0,
+ x: direction === 'left' ? 80 : direction === 'right' ? -80 : 0,
+ transition: {
+ type: 'tween',
+ duration: 1.5,
+ delay: delay,
+ ease: [0.25, 0.6, 0.3, 0.8],
+ },
+ },
+ show: {
+ y: 0,
+ x: 0,
+ opacity: 1,
+ transition: {
+ type: 'tween',
+ duration: 1.4,
+ delay: delay,
+ ease: [0.25, 0.25, 0.25, 0.75],
+ },
+ },
+ };
+};