mirror of
https://github.com/Ategon/Jamjar.git
synced 2025-02-12 06:16:21 +00:00
Move forum to main page
This commit is contained in:
parent
0e35c13292
commit
a879690129
4 changed files with 305 additions and 66 deletions
|
@ -1,29 +0,0 @@
|
||||||
import Posts from "@/components/posts";
|
|
||||||
import Timers from "@/components/timers";
|
|
||||||
import { Image } from "@nextui-org/react";
|
|
||||||
|
|
||||||
export default function Home() {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<div className="absolute left-0 top-0 w-full h-full z-0">
|
|
||||||
<Image
|
|
||||||
src="/images/bg.jpg"
|
|
||||||
alt="Home background"
|
|
||||||
className="object-cover w-full h-full"
|
|
||||||
radius="none"
|
|
||||||
loading="eager"
|
|
||||||
removeWrapper
|
|
||||||
/>
|
|
||||||
<div className="absolute left-0 top-0 w-full h-full bg-gradient-to-r from-black/50 to-transparent z-10" />
|
|
||||||
</div>
|
|
||||||
<div className="z-10 relative flex">
|
|
||||||
<div>
|
|
||||||
<Posts />
|
|
||||||
</div>
|
|
||||||
<div className="w-1/3 flex justify-end">
|
|
||||||
<Timers />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
|
@ -2,11 +2,13 @@ import { Image } from "@nextui-org/image";
|
||||||
import { Button } from "@nextui-org/button";
|
import { Button } from "@nextui-org/button";
|
||||||
import { SiDiscord } from "@icons-pack/react-simple-icons";
|
import { SiDiscord } from "@icons-pack/react-simple-icons";
|
||||||
import { Link } from "@nextui-org/react";
|
import { Link } from "@nextui-org/react";
|
||||||
|
import Posts from "@/components/posts";
|
||||||
|
import Timers from "@/components/timers";
|
||||||
|
|
||||||
export default async function Home() {
|
export default async function Home() {
|
||||||
return (
|
return (
|
||||||
<div>
|
<div className="w-full">
|
||||||
<div className="absolute left-0 top-0 w-full h-full z-0">
|
<div className="fixed left-0 top-0 w-full h-full z-0">
|
||||||
<Image
|
<Image
|
||||||
src="/images/bg.jpg"
|
src="/images/bg.jpg"
|
||||||
alt="Home background"
|
alt="Home background"
|
||||||
|
@ -17,9 +19,9 @@ export default async function Home() {
|
||||||
/>
|
/>
|
||||||
<div className="absolute left-0 top-0 w-full h-full bg-gradient-to-r from-black/50 to-transparent z-10" />
|
<div className="absolute left-0 top-0 w-full h-full bg-gradient-to-r from-black/50 to-transparent z-10" />
|
||||||
</div>
|
</div>
|
||||||
<div className="relative left-0 top-0 z-10 px-8">
|
<div className="z-10 relative flex w-full flex-wrap">
|
||||||
<div className="flex gap-20">
|
<div>
|
||||||
<div className="flex flex-col gap-4 py-16 sm:py-36 md:py-72">
|
<div className="flex flex-col gap-4 py-4 sm:py-8 md:py-12 pl-16">
|
||||||
<h1 className="text-3xl sm:text-4xl md:text-5xl">Dare2Jam</h1>
|
<h1 className="text-3xl sm:text-4xl md:text-5xl">Dare2Jam</h1>
|
||||||
<p className="text-lg sm:text-xl">April 4th - 7th</p>
|
<p className="text-lg sm:text-xl">April 4th - 7th</p>
|
||||||
<div className="flex gap-2">
|
<div className="flex gap-2">
|
||||||
|
@ -34,8 +36,47 @@ export default async function Home() {
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<Posts />
|
||||||
|
</div>
|
||||||
|
<div className="w-1/3 flex justify-end py-4 sm:py-8 md:py-12 flex-grow">
|
||||||
|
<Timers />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
{
|
||||||
|
/* <div>
|
||||||
|
<div className="absolute left-0 top-0 w-full h-full z-0">
|
||||||
|
<Image
|
||||||
|
src="/images/bg.jpg"
|
||||||
|
alt="Home background"
|
||||||
|
className="object-cover w-full h-full"
|
||||||
|
radius="none"
|
||||||
|
loading="eager"
|
||||||
|
removeWrapper
|
||||||
|
/>
|
||||||
|
<div className="absolute left-0 top-0 w-full h-full bg-gradient-to-r from-black/50 to-transparent z-10" />
|
||||||
|
</div>
|
||||||
|
<div className="relative left-0 top-0 z-10 px-8">
|
||||||
|
<div className="flex gap-20">
|
||||||
|
<div className="flex flex-col gap-4 py-16 sm:py-36 md:py-72">
|
||||||
|
<h1 className="text-3xl sm:text-4xl md:text-5xl">Dare2Jam</h1>
|
||||||
|
<p className="text-lg sm:text-xl">April 4th - 7th</p>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Link href="https://discord.gg/rfmKzM6ASw" target="_blank">
|
||||||
|
<Button
|
||||||
|
variant="bordered"
|
||||||
|
className="border-white/50 text-white"
|
||||||
|
startContent={<SiDiscord />}
|
||||||
|
>
|
||||||
|
Join the Discord
|
||||||
|
</Button>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div> */
|
||||||
|
}
|
||||||
|
|
|
@ -20,7 +20,7 @@ import {
|
||||||
Tooltip,
|
Tooltip,
|
||||||
} from "@nextui-org/react";
|
} from "@nextui-org/react";
|
||||||
import { SiDiscord, SiForgejo, SiGithub } from "@icons-pack/react-simple-icons";
|
import { SiDiscord, SiForgejo, SiGithub } from "@icons-pack/react-simple-icons";
|
||||||
import { LogInIcon, NotebookPen, SquarePen } from "lucide-react";
|
import { LogInIcon, Menu, NotebookPen, SquarePen } from "lucide-react";
|
||||||
import { useEffect, useState } from "react";
|
import { useEffect, useState } from "react";
|
||||||
import { hasCookie, getCookie } from "@/helpers/cookie";
|
import { hasCookie, getCookie } from "@/helpers/cookie";
|
||||||
import { usePathname } from "next/navigation";
|
import { usePathname } from "next/navigation";
|
||||||
|
@ -29,6 +29,7 @@ import { UserType } from "@/types/UserType";
|
||||||
export default function Navbar() {
|
export default function Navbar() {
|
||||||
const [user, setUser] = useState<UserType>();
|
const [user, setUser] = useState<UserType>();
|
||||||
const pathname = usePathname();
|
const pathname = usePathname();
|
||||||
|
const [isMobile, setIsMobile] = useState(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
loadUser();
|
loadUser();
|
||||||
|
@ -55,6 +56,15 @@ export default function Navbar() {
|
||||||
}
|
}
|
||||||
}, [pathname]);
|
}, [pathname]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const handleResize = () => {
|
||||||
|
setIsMobile(window.innerWidth <= 768); // Adjust breakpoint as needed
|
||||||
|
};
|
||||||
|
handleResize();
|
||||||
|
window.addEventListener("resize", handleResize);
|
||||||
|
return () => window.removeEventListener("resize", handleResize);
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<NavbarBase
|
<NavbarBase
|
||||||
shouldHideOnScroll
|
shouldHideOnScroll
|
||||||
|
@ -69,18 +79,248 @@ export default function Navbar() {
|
||||||
<Image src="/images/dare2jam.png" alt="Dare2Jam logo" width={80} />
|
<Image src="/images/dare2jam.png" alt="Dare2Jam logo" width={80} />
|
||||||
</Link>
|
</Link>
|
||||||
</NavbarBrand>
|
</NavbarBrand>
|
||||||
<NavbarContent>
|
|
||||||
<NavbarItem>
|
|
||||||
<Link
|
|
||||||
href="/app"
|
|
||||||
className="text-white flex justify-center duration-500 ease-in-out transition-all transform hover:scale-110"
|
|
||||||
>
|
|
||||||
Beta Site
|
|
||||||
</Link>
|
|
||||||
</NavbarItem>
|
|
||||||
</NavbarContent>
|
|
||||||
<NavbarContent justify="end">
|
<NavbarContent justify="end">
|
||||||
{user && (
|
{isMobile ? (
|
||||||
|
user ? (
|
||||||
|
<Dropdown>
|
||||||
|
<DropdownTrigger>
|
||||||
|
<Avatar src={user.profilePicture} />
|
||||||
|
</DropdownTrigger>
|
||||||
|
<DropdownMenu className="text-black">
|
||||||
|
<DropdownItem key="create-post" href="/create-post">
|
||||||
|
Create Post
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem
|
||||||
|
key="github"
|
||||||
|
href="https://github.com/Ategon/Jamjar"
|
||||||
|
>
|
||||||
|
GitHub
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem
|
||||||
|
key="forgejo"
|
||||||
|
href="https://git.edikoyo.com/Ategon/Jamjar"
|
||||||
|
>
|
||||||
|
Forgejo
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem
|
||||||
|
key="discord"
|
||||||
|
href="https://discord.gg/rfmKzM6ASw"
|
||||||
|
>
|
||||||
|
Discord
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="logout" color="danger" href="/logout">
|
||||||
|
Logout
|
||||||
|
</DropdownItem>
|
||||||
|
</DropdownMenu>
|
||||||
|
</Dropdown>
|
||||||
|
) : (
|
||||||
|
<Dropdown>
|
||||||
|
<DropdownTrigger>
|
||||||
|
<Menu />
|
||||||
|
</DropdownTrigger>
|
||||||
|
<DropdownMenu className="text-black">
|
||||||
|
<DropdownItem
|
||||||
|
key="github"
|
||||||
|
href="https://github.com/Ategon/Jamjar"
|
||||||
|
>
|
||||||
|
GitHub
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem
|
||||||
|
key="forgejo"
|
||||||
|
href="https://git.edikoyo.com/Ategon/Jamjar"
|
||||||
|
>
|
||||||
|
Forgejo
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem
|
||||||
|
key="discord"
|
||||||
|
href="https://discord.gg/rfmKzM6ASw"
|
||||||
|
>
|
||||||
|
Discord
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="login" href="/login">
|
||||||
|
Log In
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="signup" href="/signup">
|
||||||
|
Sign Up
|
||||||
|
</DropdownItem>
|
||||||
|
</DropdownMenu>
|
||||||
|
</Dropdown>
|
||||||
|
)
|
||||||
|
) : (
|
||||||
|
<div className="flex gap-3 items-center">
|
||||||
|
{user && (
|
||||||
|
<NavbarItem>
|
||||||
|
<Link href="/create-post">
|
||||||
|
<Button
|
||||||
|
endContent={<SquarePen />}
|
||||||
|
className="text-white border-white/50 hover:border-green-100/50 hover:text-green-100 hover:scale-110 transition-all transform duration-500 ease-in-out"
|
||||||
|
variant="bordered"
|
||||||
|
>
|
||||||
|
Create Post
|
||||||
|
</Button>
|
||||||
|
</Link>
|
||||||
|
<Spacer x={32} />
|
||||||
|
</NavbarItem>
|
||||||
|
)}
|
||||||
|
<NavbarItem>
|
||||||
|
<Tooltip
|
||||||
|
delay={1000}
|
||||||
|
content={
|
||||||
|
<div className="px-1 py-2 text-black text-center">
|
||||||
|
<div className="text-small font-bold">GitHub</div>
|
||||||
|
<div className="text-tiny">Source Code</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Link
|
||||||
|
href="https://github.com/Ategon/Jamjar"
|
||||||
|
className="text-white flex justify-center duration-500 ease-in-out transition-all transform hover:scale-125 hover:text-red-100"
|
||||||
|
isExternal
|
||||||
|
>
|
||||||
|
<SiGithub title="" />
|
||||||
|
</Link>
|
||||||
|
</Tooltip>
|
||||||
|
</NavbarItem>
|
||||||
|
<NavbarItem>
|
||||||
|
<Tooltip
|
||||||
|
delay={1000}
|
||||||
|
content={
|
||||||
|
<div className="px-1 py-2 text-black text-center">
|
||||||
|
<div className="text-small font-bold">Forgejo</div>
|
||||||
|
<div className="text-tiny">Source Code</div>
|
||||||
|
</div>
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Link
|
||||||
|
href="https://git.edikoyo.com/Ategon/Jamjar"
|
||||||
|
className="text-white flex justify-center duration-500 ease-in-out transition-all transform hover:scale-125 hover:text-red-100"
|
||||||
|
isExternal
|
||||||
|
>
|
||||||
|
<SiForgejo title="" />
|
||||||
|
</Link>
|
||||||
|
</Tooltip>
|
||||||
|
</NavbarItem>
|
||||||
|
<NavbarItem>
|
||||||
|
<Link
|
||||||
|
href="https://discord.gg/rfmKzM6ASw"
|
||||||
|
className="text-white flex justify-center duration-500 ease-in-out transition-all transform hover:scale-125 hover:text-indigo-100"
|
||||||
|
isExternal
|
||||||
|
>
|
||||||
|
<SiDiscord />
|
||||||
|
</Link>
|
||||||
|
</NavbarItem>
|
||||||
|
<Divider orientation="vertical" className="h-1/2" />
|
||||||
|
{!user ? (
|
||||||
|
<div className="flex gap-3 items-center">
|
||||||
|
<NavbarItem>
|
||||||
|
<Link href="/login">
|
||||||
|
<Button
|
||||||
|
endContent={<LogInIcon />}
|
||||||
|
className="text-white border-white/50 hover:border-green-100/50 hover:text-green-100 hover:scale-110 transition-all transform duration-500 ease-in-out"
|
||||||
|
variant="bordered"
|
||||||
|
>
|
||||||
|
Log In
|
||||||
|
</Button>
|
||||||
|
</Link>
|
||||||
|
</NavbarItem>
|
||||||
|
<NavbarItem>
|
||||||
|
<Link href="/signup">
|
||||||
|
<Button
|
||||||
|
endContent={<NotebookPen />}
|
||||||
|
className="text-white border-white/50 hover:border-green-100/50 hover:text-green-100 hover:scale-110 transition-all transform duration-500 ease-in-out"
|
||||||
|
variant="bordered"
|
||||||
|
>
|
||||||
|
Sign up
|
||||||
|
</Button>
|
||||||
|
</Link>
|
||||||
|
</NavbarItem>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
<Dropdown>
|
||||||
|
<DropdownTrigger>
|
||||||
|
<Avatar src={user.profilePicture} />
|
||||||
|
</DropdownTrigger>
|
||||||
|
<DropdownMenu>
|
||||||
|
{/* <DropdownItem
|
||||||
|
key="profile"
|
||||||
|
className="text-black"
|
||||||
|
href="/profile"
|
||||||
|
>
|
||||||
|
Profile
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem
|
||||||
|
showDivider
|
||||||
|
key="settings"
|
||||||
|
className="text-black"
|
||||||
|
href="/settings"
|
||||||
|
>
|
||||||
|
Settings
|
||||||
|
</DropdownItem> */}
|
||||||
|
<DropdownItem
|
||||||
|
key="logout"
|
||||||
|
color="danger"
|
||||||
|
className="text-danger"
|
||||||
|
href="/logout"
|
||||||
|
>
|
||||||
|
Logout
|
||||||
|
</DropdownItem>
|
||||||
|
</DropdownMenu>
|
||||||
|
</Dropdown>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</NavbarContent>
|
||||||
|
</NavbarBase>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
/*
|
||||||
|
|
||||||
|
{isMobile ? (
|
||||||
|
// Mobile view
|
||||||
|
user ? (
|
||||||
|
<Dropdown>
|
||||||
|
<DropdownTrigger>
|
||||||
|
<Avatar src={user.profilePicture} />
|
||||||
|
</DropdownTrigger>
|
||||||
|
<DropdownMenu>
|
||||||
|
<DropdownItem key="create-post" href="/create-post">
|
||||||
|
Create Post
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="logout" color="danger" href="/logout">
|
||||||
|
Logout
|
||||||
|
</DropdownItem>
|
||||||
|
</DropdownMenu>
|
||||||
|
</Dropdown>
|
||||||
|
) : (
|
||||||
|
<Dropdown>
|
||||||
|
<DropdownTrigger>
|
||||||
|
<Button auto flat className="text-white">
|
||||||
|
☰
|
||||||
|
</Button>
|
||||||
|
</DropdownTrigger>
|
||||||
|
<DropdownMenu>
|
||||||
|
<DropdownItem key="github" href="https://github.com/Ategon/Jamjar" isExternal>
|
||||||
|
GitHub
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="forgejo" href="https://git.edikoyo.com/Ategon/Jamjar" isExternal>
|
||||||
|
Forgejo
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="discord" href="https://discord.gg/rfmKzM6ASw" isExternal>
|
||||||
|
Discord
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="login" href="/login">
|
||||||
|
Log In
|
||||||
|
</DropdownItem>
|
||||||
|
<DropdownItem key="signup" href="/signup">
|
||||||
|
Sign Up
|
||||||
|
</DropdownItem>
|
||||||
|
</DropdownMenu>
|
||||||
|
</Dropdown>
|
||||||
|
)
|
||||||
|
) : (
|
||||||
|
|
||||||
|
|
||||||
|
user && (
|
||||||
<NavbarItem>
|
<NavbarItem>
|
||||||
<Link href="/create-post">
|
<Link href="/create-post">
|
||||||
<Button
|
<Button
|
||||||
|
@ -93,7 +333,7 @@ export default function Navbar() {
|
||||||
</Link>
|
</Link>
|
||||||
<Spacer x={32} />
|
<Spacer x={32} />
|
||||||
</NavbarItem>
|
</NavbarItem>
|
||||||
)}
|
)
|
||||||
<NavbarItem>
|
<NavbarItem>
|
||||||
<Tooltip
|
<Tooltip
|
||||||
delay={1000}
|
delay={1000}
|
||||||
|
@ -173,21 +413,7 @@ export default function Navbar() {
|
||||||
<Avatar src={user.profilePicture} />
|
<Avatar src={user.profilePicture} />
|
||||||
</DropdownTrigger>
|
</DropdownTrigger>
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
{/* <DropdownItem
|
|
||||||
key="profile"
|
|
||||||
className="text-black"
|
|
||||||
href="/profile"
|
|
||||||
>
|
|
||||||
Profile
|
|
||||||
</DropdownItem>
|
|
||||||
<DropdownItem
|
|
||||||
showDivider
|
|
||||||
key="settings"
|
|
||||||
className="text-black"
|
|
||||||
href="/settings"
|
|
||||||
>
|
|
||||||
Settings
|
|
||||||
</DropdownItem> */}
|
|
||||||
<DropdownItem
|
<DropdownItem
|
||||||
key="logout"
|
key="logout"
|
||||||
color="danger"
|
color="danger"
|
||||||
|
@ -199,7 +425,5 @@ export default function Navbar() {
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
)}
|
)}
|
||||||
</NavbarContent>
|
)
|
||||||
</NavbarBase>
|
</NavbarContent> */
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
import { Spacer } from "@nextui-org/react";
|
||||||
import Timer from "./Timer";
|
import Timer from "./Timer";
|
||||||
|
|
||||||
export default function Timers() {
|
export default function Timers() {
|
||||||
|
@ -7,6 +8,8 @@ export default function Timers() {
|
||||||
name="Jam Start"
|
name="Jam Start"
|
||||||
targetDate={new Date("2025-04-04T18:00:00-05:00")}
|
targetDate={new Date("2025-04-04T18:00:00-05:00")}
|
||||||
/>
|
/>
|
||||||
|
<Spacer y={8} />
|
||||||
|
<p>Site under construction</p>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue