Skip to content

Commit

Permalink
added landing page
Browse files Browse the repository at this point in the history
  • Loading branch information
chuma-beep committed Dec 30, 2024
1 parent 30f91af commit 3eb3b49
Show file tree
Hide file tree
Showing 27 changed files with 1,246 additions and 110 deletions.
92 changes: 92 additions & 0 deletions app/community/page.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@

'use client'
import DeployButton from "../../components/LogoButton";
import AuthButton from "../../components/AuthButton";
import MainFooter from "@/components/main-footer";
import PostList from "@/app/postlist/PostList";
import { WriteIcon } from '@/components/WriteIcon';
import Search from '@/components/Search/Search'
import { ComponentsBlogSidebar } from "@/components/BlogSideBar";
import { ModeToggle } from "@/components/toggle-theme";
import * as Tooltip from "@radix-ui/react-tooltip"


export default function Community() {

return (
<div data-testid="Home" className="w-full flex flex-col gap-20 items-center">
<nav className="w-full flex justify-center border-b border-b-foreground/10 h-16">
<div className="w-full max-w-4xl flex items-center text-sm gap-0">
<DeployButton />
<div className="flex flex-row-reverse w-full mr-1 items-end gap-1">
<Tooltip.Provider>
<Tooltip.Root>
<Tooltip.Trigger asChild>
<span className="IconButton">
<WriteIcon />
</span>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="TooltipContent" sideOffset={5}>
Write
{/* <Tooltip.Arrow className="TooltipArrow" > */}
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
</Tooltip.Provider>
<Tooltip.Provider>
<Tooltip.Root>
<Tooltip.Trigger asChild>
<span className="IconButton">
<ModeToggle/>
</span>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="TooltipContent" sideOffset={5}>
Theme
{/* <Tooltip.Arrow className="TooltipArrow" /> */}
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
</Tooltip.Provider>
<Tooltip.Provider>
<Tooltip.Root>
<Tooltip.Trigger asChild>
<span className="IconButton">
<Search />
</span>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="TooltipContent" sideOffset={5}>
Search
{/* <Tooltip.Arrow className="TooltipArrow" /> */}
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
</Tooltip.Provider>
</div>
<AuthButton />
</div>
</nav>
<div className="flex-1 flex flex-col gap-20 max-w-4xl px-3">

<main className="flex flex-row justify-between">
<span className="h-fit">

<ComponentsBlogSidebar />
</span>
<span
className=""
>

<PostList />
</span>
</main>

</div>
<div>
<MainFooter />
</div>
</div>
);
}
14 changes: 13 additions & 1 deletion app/globals.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
@tailwind components;
@tailwind utilities;


@layer base {
:root {
--background: 0 0% 100%;
Expand Down Expand Up @@ -65,5 +66,16 @@
}
body {
@apply bg-background text-foreground;
}
/* width: 100%; */
/* display: flex; */
/* flex-direction: column; */
/* justify-content: center; */
}
}
html{
width: 100vw !important;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
5 changes: 3 additions & 2 deletions app/layout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,11 +31,12 @@ export default function RootLayout({
</head>
<body
className={cn(
"min-h-screen bg-background font-sans antialiased",
"min-w-[100%] bg-background font-sans antialiased w-[100%]",
fontSans.variable
)}
>
<main className="min-h-screen flex flex-col items-center">

<main className="min-h-screen flex flex-col items-center justify-center w-[100%]">
<ThemeProvider
attribute="class"
defaultTheme="system"
Expand Down
109 changes: 18 additions & 91 deletions app/page.tsx
Original file line number Diff line number Diff line change
@@ -1,101 +1,28 @@
// 'use client'
"use client";

import DeployButton from "../components/LogoButton";
import HomeButton from "../components/LogoButton";
import AuthButton from "../components/AuthButton";
import MainFooter from "@/components/main-footer";
import PostList from "@/app/postlist/PostList";
import { WriteIcon } from '@/components/WriteIcon';
import Search from '@/components/Search/Search'
import { ComponentsBlogSidebar } from "@/components/BlogSideBar";
import { WriteIcon } from "@/components/WriteIcon";
import Search from "@/components/Search/Search";
import { ModeToggle } from "@/components/toggle-theme";
// import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent } from "@/components/ui/tooltip"
import * as Tooltip from "@radix-ui/react-tooltip"
import Write from './protected/account/write/page';
import * as Tooltip from "@radix-ui/react-tooltip";
import LandingPage from "../components/LandingPage";


// import { Tooltip } from "@/components/ui/tooltip";





export default function Index() {

return (
<div data-testid="Home" className="w-full flex flex-col gap-20 items-center">
<nav className="w-full flex justify-center border-b border-b-foreground/10 h-16">
<div className="w-full max-w-4xl flex items-center text-sm gap-0">
<DeployButton />
<div className="flex flex-row-reverse w-full mr-1 items-end gap-1">
<Tooltip.Provider>
<Tooltip.Root>
<Tooltip.Trigger asChild>
<span className="IconButton">
<WriteIcon />
</span>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="TooltipContent" sideOffset={5}>
Write
{/* <Tooltip.Arrow className="TooltipArrow" > */}
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
</Tooltip.Provider>
<Tooltip.Provider>
<Tooltip.Root>
<Tooltip.Trigger asChild>
<span className="IconButton">
<ModeToggle/>
</span>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="TooltipContent" sideOffset={5}>
Theme
{/* <Tooltip.Arrow className="TooltipArrow" /> */}
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
</Tooltip.Provider>
<Tooltip.Provider>
<Tooltip.Root>
<Tooltip.Trigger asChild>
<span className="IconButton">
<Search />
</span>
</Tooltip.Trigger>
<Tooltip.Portal>
<Tooltip.Content className="TooltipContent" sideOffset={5}>
Search
{/* <Tooltip.Arrow className="TooltipArrow" /> */}
</Tooltip.Content>
</Tooltip.Portal>
</Tooltip.Root>
</Tooltip.Provider>
</div>
<AuthButton />
</div>
</nav>
<div className="flex-1 flex flex-col gap-20 max-w-4xl px-3">

<main className="flex flex-row justify-between">
<span className="h-fit">

<ComponentsBlogSidebar />
</span>
<span
className=""
>

<PostList />
</span>
</main>

</div>
<div>
<>
{/* <div
data-testid="Home"
className="flex flex-col items-center min-h-screen w-[]"
> */}
<LandingPage />

{/* Footer */}
<footer className="w-full">
<MainFooter />
</div>
</div>
</footer>
{/* </div> */}
</>
);
}
}
28 changes: 28 additions & 0 deletions components/AnalyticsVideo.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import Image from 'next/image';

export default function AnalyticsVideo() {
return (
<div className="">
{/* <Image
src="/thumbnail.jpg"
alt="Video Placeholder"
layout="fill"
objectFit="cover"
quality={80}
priority
/> */}
<video
autoPlay
loop
muted
playsInline
// className='h-auto object-cover rounded-lg shadow-slate-600 shadow-lg min-w-[50vw] min-h-[30vw] max-w-[500px] max-h-[500px]'
className='h-auto object-cover rounded-lg shadow-slate-600 shadow-lg'

>
<source src="/Analyticsrecord1.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
</div>
);
}
21 changes: 21 additions & 0 deletions components/CommunityIcon.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
import { Button } from "@/components/ui/button"
import Link from "next/link";
import { useRouter } from "next/navigation";
import { HiOutlineUserGroup } from "react-icons/hi2";


export default function CommunityIcon() {
return (
<div data-testid="write-icon">
<Button variant="outline" className="bg-transparent text-primary rounded-full flex flex-row hover:text-blue-300">
<Link
href="/community"
>
<HiOutlineUserGroup
className="w-5 h-5"
/>
</Link>
</Button>
</div>
)
}
Loading

0 comments on commit 3eb3b49

Please sign in to comment.