Skip to content

Commit 8c4363b

Browse files
committed
🎡🛀🏼 ↝ [ FCDB-24 ] Mostly finished landing page aside from content, now working on auth modal
1 parent 2e31f46 commit 8c4363b

File tree

5 files changed

+93
-70
lines changed

5 files changed

+93
-70
lines changed

components/Public/LandingContent.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -29,13 +29,13 @@ export const modules = [
2929
href: '/garden',
3030
},
3131
{
32-
name: 'Planet Hunters',
32+
name: 'Planet Huners',
3333
description: 'Employ simple data-science tools to discover real planets and add them to your collection',
3434
icon: '🪐',
3535
href: '/garden',
3636
},
3737
{
38-
name: 'Planet Hunters',
38+
name: 'Planet Hters',
3939
description: 'Employ simple data-science tools to discover real planets and add them to your collection',
4040
icon: '🪐',
4141
href: '/garden',

components/Section/Layout.tsx

+33
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,39 @@ const Layout: React.FC<DashboardLayoutProps> = ({ children }) => {
4444

4545
export default Layout;
4646

47+
export const LandingLayout: React.FC<DashboardLayoutProps> = ({ children }) => {
48+
const [isMobile, setIsMobile] = useState(false);
49+
50+
useEffect(() => { // Check if window is defined before accessing it
51+
if (typeof window !== "undefined") {
52+
const checkIsMobile = () => {
53+
setIsMobile(window.innerWidth <= 768);
54+
};
55+
checkIsMobile();
56+
window.addEventListener("resize", checkIsMobile);
57+
return () => {
58+
window.removeEventListener("resize", checkIsMobile);
59+
};
60+
}
61+
}, []);
62+
63+
return (
64+
<>
65+
<main className="h-max pb-10 grow pt-6">
66+
<div className="py-12">
67+
{children}
68+
</div>
69+
</main>
70+
{isMobile && (
71+
<div className="md:hidden overflow-y-auto h-screen p-4">
72+
<main className="h-max pb-10 grow">{children}</main>
73+
{/* <Bottombar /> */}
74+
</div>
75+
)}
76+
</>
77+
);
78+
};
79+
4780
export const InventoryLayout: React.FC<DashboardLayoutProps> = ({ children }) => {
4881
const [isMobile, setIsMobile] = useState(false);
4982
const [activeTab, setActiveTab] = useState('consumables')

components/Section/Navbar.tsx

+33-32
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ import { HiBars3 } from 'react-icons/hi2';
1919
import { AiFillCloseCircle } from 'react-icons/ai';
2020
import { CgProfile } from 'react-icons/cg';
2121
import { BiLogIn } from 'react-icons/bi';
22+
import { useRouter } from "next/router";
2223

2324
export const UserMenuItems = ({
2425
user,
@@ -27,7 +28,7 @@ export const UserMenuItems = ({
2728
user?: string; // Adjust the type based on your actual user structure
2829
setMobileMenuOpen?: React.Dispatch<React.SetStateAction<boolean>>;
2930
}) => {
30-
const path = window.location.pathname;
31+
const router = useRouter();
3132

3233
const handleMobileMenuClick = () => {
3334
if (setMobileMenuOpen) {
@@ -39,12 +40,12 @@ export const UserMenuItems = ({
3940
<>
4041
<ul
4142
className={`flex flex-col gap-5 border-b border-stroke py-4 dark:border-strokedark ${
42-
path === '/admin' ? 'px-6' : 'sm:px-6'
43+
router.pathname === '/admin' ? 'px-6' : 'sm:px-6'
4344
}`}
4445
>
45-
{path === '/' || path === '/admin' ? (
46+
{router.pathname === '/' || router.pathname === '/admin' ? (
4647
<li>
47-
<Link href='/demo-app' legacyBehavior>
48+
<Link href='/demo-app' passHref legacyBehavior>
4849
<a className='flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out hover:text-yellow-500'>
4950
<MdOutlineSpaceDashboard size='1.1rem' />
5051
AI Scheduler (Demo App)
@@ -53,19 +54,19 @@ export const UserMenuItems = ({
5354
</li>
5455
) : null}
5556
<li>
56-
<Link href='/account' legacyBehavior>
57+
<Link href='/account' passHref legacyBehavior>
5758
<a
5859
onClick={handleMobileMenuClick}
5960
className='flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out hover:text-yellow-500'
6061
>
61-
<svg
62-
className='fill-current'
63-
width='18'
64-
height='18'
65-
viewBox='0 0 22 22'
66-
fill='none'
67-
xmlns='http://www.w3.org/2000/svg'
68-
>
62+
<svg
63+
className='fill-current'
64+
width='18'
65+
height='18'
66+
viewBox='0 0 22 22'
67+
fill='none'
68+
xmlns='http://www.w3.org/2000/svg'
69+
>
6970
<path
7071
d='M20.8656 8.86874C20.5219 8.49062 20.0406 8.28437 19.525 8.28437H19.4219C19.25 8.28437 19.1125 8.18124 19.0781 8.04374C19.0437 7.90624 18.975 7.80312 18.9406 7.66562C18.8719 7.52812 18.9406 7.39062 19.0437 7.28749L19.1125 7.21874C19.4906 6.87499 19.6969 6.39374 19.6969 5.87812C19.6969 5.36249 19.525 4.88124 19.1469 4.50312L17.8062 3.12812C17.0844 2.37187 15.8469 2.33749 15.0906 3.09374L14.9875 3.16249C14.8844 3.26562 14.7125 3.29999 14.5406 3.23124C14.4031 3.16249 14.2656 3.09374 14.0937 3.05937C13.9219 2.99062 13.8187 2.85312 13.8187 2.71562V2.54374C13.8187 1.47812 12.9594 0.618744 11.8937 0.618744H9.96875C9.45312 0.618744 8.97187 0.824994 8.62812 1.16874C8.25 1.54687 8.07812 2.02812 8.07812 2.50937V2.64687C8.07812 2.78437 7.975 2.92187 7.8375 2.99062C7.76875 3.02499 7.73437 3.02499 7.66562 3.05937C7.52812 3.12812 7.35625 3.09374 7.25312 2.99062L7.18437 2.88749C6.84062 2.50937 6.35937 2.30312 5.84375 2.30312C5.32812 2.30312 4.84687 2.47499 4.46875 2.85312L3.09375 4.19374C2.3375 4.91562 2.30312 6.15312 3.05937 6.90937L3.12812 7.01249C3.23125 7.11562 3.26562 7.28749 3.19687 7.39062C3.12812 7.52812 3.09375 7.63124 3.025 7.76874C2.95625 7.90624 2.85312 7.97499 2.68125 7.97499H2.57812C2.0625 7.97499 1.58125 8.14687 1.20312 8.52499C0.824996 8.86874 0.618746 9.34999 0.618746 9.86562L0.584371 11.7906C0.549996 12.8562 1.40937 13.7156 2.475 13.75H2.57812C2.75 13.75 2.8875 13.8531 2.92187 13.9906C2.99062 14.0937 3.05937 14.1969 3.09375 14.3344C3.12812 14.4719 3.09375 14.6094 2.99062 14.7125L2.92187 14.7812C2.54375 15.125 2.3375 15.6062 2.3375 16.1219C2.3375 16.6375 2.50937 17.1187 2.8875 17.4969L4.22812 18.8719C4.95 19.6281 6.1875 19.6625 6.94375 18.9062L7.04687 18.8375C7.15 18.7344 7.32187 18.7 7.49375 18.7687C7.63125 18.8375 7.76875 18.9062 7.94062 18.9406C8.1125 19.0094 8.21562 19.1469 8.21562 19.2844V19.4219C8.21562 20.4875 9.075 21.3469 10.1406 21.3469H12.0656C13.1312 21.3469 13.9906 20.4875 13.9906 19.4219V19.2844C13.9906 19.1469 14.0937 19.0094 14.2312 18.9406C14.3 18.9062 14.3344 18.9062 14.4031 18.8719C14.575 18.8031 14.7125 18.8375 14.8156 18.9406L14.8844 19.0437C15.2281 19.4219 15.7094 19.6281 16.225 19.6281C16.7406 19.6281 17.2219 19.4562 17.6 19.0781L18.975 17.7375C19.7312 17.0156 19.7656 15.7781 19.0094 15.0219L18.9406 14.9187C18.8375 14.8156 18.8031 14.6437 18.8719 14.5406C18.9406 14.4031 18.975 14.3 19.0437 14.1625C19.1125 14.025 19.25 13.9562 19.3875 13.9562H19.4906H19.525C20.5562 13.9562 21.4156 13.1312 21.45 12.0656L21.4844 10.1406C21.4156 9.72812 21.2094 9.21249 20.8656 8.86874ZM19.8344 12.1C19.8344 12.3062 19.6625 12.4781 19.4562 12.4781H19.3531H19.3187C18.5281 12.4781 17.8062 12.9594 17.5312 13.6469C17.4969 13.75 17.4281 13.8531 17.3937 13.9562C17.0844 14.6437 17.2219 15.5031 17.7719 16.0531L17.8406 16.1562C17.9781 16.2937 17.9781 16.5344 17.8406 16.6719L16.4656 18.0125C16.3625 18.1156 16.2594 18.1156 16.1906 18.1156C16.1219 18.1156 16.0187 18.1156 15.9156 18.0125L15.8469 17.9094C15.2969 17.325 14.4719 17.1531 13.7156 17.4969L13.5781 17.5656C12.8219 17.875 12.3406 18.5625 12.3406 19.3531V19.4906C12.3406 19.6969 12.1687 19.8687 11.9625 19.8687H10.0375C9.83125 19.8687 9.65937 19.6969 9.65937 19.4906V19.3531C9.65937 18.5625 9.17812 17.8406 8.42187 17.5656C8.31875 17.5312 8.18125 17.4625 8.07812 17.4281C7.80312 17.2906 7.52812 17.2562 7.25312 17.2562C6.77187 17.2562 6.29062 17.4281 5.9125 17.8062L5.84375 17.8406C5.70625 17.9781 5.46562 17.9781 5.32812 17.8406L3.9875 16.4656C3.88437 16.3625 3.88437 16.2594 3.88437 16.1906C3.88437 16.1219 3.88437 16.0187 3.9875 15.9156L4.05625 15.8469C4.64062 15.2969 4.8125 14.4375 4.50312 13.75C4.46875 13.6469 4.43437 13.5437 4.36562 13.4406C4.09062 12.7187 3.40312 12.2031 2.6125 12.2031H2.50937C2.30312 12.2031 2.13125 12.0312 2.13125 11.825L2.16562 9.89999C2.16562 9.76249 2.23437 9.69374 2.26875 9.62499C2.30312 9.59062 2.40625 9.52187 2.54375 9.52187H2.64687C3.4375 9.55624 4.15937 9.07499 4.46875 8.35312C4.50312 8.24999 4.57187 8.14687 4.60625 8.04374C4.91562 7.35624 4.77812 6.49687 4.22812 5.94687L4.15937 5.84374C4.02187 5.70624 4.02187 5.46562 4.15937 5.32812L5.53437 3.98749C5.6375 3.88437 5.74062 3.88437 5.80937 3.88437C5.87812 3.88437 5.98125 3.88437 6.08437 3.98749L6.15312 4.09062C6.70312 4.67499 7.52812 4.84687 8.28437 4.53749L8.42187 4.46874C9.17812 4.15937 9.65937 3.47187 9.65937 2.68124V2.54374C9.65937 2.40624 9.72812 2.33749 9.7625 2.26874C9.79687 2.19999 9.9 2.16562 10.0375 2.16562H11.9625C12.1687 2.16562 12.3406 2.33749 12.3406 2.54374V2.68124C12.3406 3.47187 12.8219 4.19374 13.5781 4.46874C13.6812 4.50312 13.8187 4.57187 13.9219 4.60624C14.6437 4.94999 15.5031 4.81249 16.0875 4.26249L16.1906 4.19374C16.3281 4.05624 16.5687 4.05624 16.7062 4.19374L18.0469 5.56874C18.15 5.67187 18.15 5.77499 18.15 5.84374C18.15 5.91249 18.1156 6.01562 18.0469 6.11874L17.9781 6.18749C17.3594 6.70312 17.1875 7.56249 17.4625 8.24999C17.4969 8.35312 17.5312 8.45624 17.6 8.55937C17.875 9.28124 18.5625 9.79687 19.3531 9.79687H19.4562C19.5937 9.79687 19.6625 9.86562 19.7312 9.89999C19.8 9.93437 19.8344 10.0375 19.8344 10.175V12.1Z'
7172
fill=''
@@ -80,26 +81,26 @@ export const UserMenuItems = ({
8081
</Link>
8182
</li>
8283
</ul>
83-
<ul
84-
className={`flex flex-col gap-5 border-b border-stroke py-4 dark:border-strokedark ${
85-
path === '/admin' ? 'px-6' : 'sm:px-6'
86-
}`}
87-
>
88-
<li className='flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out hover:text-yellow-500'>
89-
<Link href='/admin' legacyBehavior>
90-
<a
91-
onClick={handleMobileMenuClick}
92-
className='flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out hover:text-yellow-500'
93-
>
94-
<TfiDashboard size='1.1rem' />
95-
Admin Dashboard
96-
</a>
97-
</Link>
98-
</li>
99-
</ul>
84+
<ul
85+
className={`flex flex-col gap-5 border-b border-stroke py-4 dark:border-strokedark ${
86+
router.pathname === '/admin' ? 'px-6' : 'sm:px-6'
87+
}`}
88+
>
89+
<li className='flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out hover:text-yellow-500'>
90+
<Link href='/admin' passHref legacyBehavior>
91+
<a
92+
onClick={handleMobileMenuClick}
93+
className='flex items-center gap-3.5 text-sm font-medium duration-300 ease-in-out hover:text-yellow-500'
94+
>
95+
<TfiDashboard size='1.1rem' />
96+
Admin Dashboard
97+
</a>
98+
</Link>
99+
</li>
100+
</ul>
100101
<button
101102
className={`flex items-center gap-3.5 py-4 text-sm font-medium duration-300 ease-in-out hover:text-yellow-500 ${
102-
path === '/admin' ? 'px-6' : 'sm:px-6'
103+
router.pathname === '/admin' ? 'px-6' : 'sm:px-6'
103104
}`}
104105
>
105106
<svg
@@ -309,7 +310,7 @@ export default function Navigation() {
309310
<Dialog.Panel className='fixed inset-y-0 right-0 z-50 w-full overflow-y-auto bg-white dark:text-white dark:bg-boxdark px-6 py-6 sm:max-w-sm sm:ring-1 sm:ring-gray-900/10'>
310311
<div className='flex items-center justify-between'>
311312
<a href='/' className='-m-1.5 p-1.5'>
312-
<span className='sr-only'>Your SaaS</span>
313+
<span className='sr-only'>Star Sailors</span>
313314
<NavLogo />
314315
</a>
315316
<button

pages/index.tsx

+21-32
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { useSession, useSupabaseClient } from "@supabase/auth-helpers-react";
22
import React, { useEffect, useState } from "react";
33
import CoreLayout from "../components/Core/Layout";
4-
import Layout from "../components/Section/Layout";
4+
import Layout, { LandingLayout } from "../components/Section/Layout";
55
import CardForum from "../components/Content/DiscussCard";
66
import { useRouter } from "next/router";
77
import Login from "./login";
@@ -43,7 +43,7 @@ export function PublicLanding () {
4343
>
4444
<NavLogo />
4545
<span className='ml-2 text-sm font-semibold leading-6 dark:text-white'>
46-
Your Saas
46+
Star Sailors
4747
</span>
4848
</a>
4949
</div>
@@ -72,9 +72,10 @@ export function PublicLanding () {
7272
{/* <!-- Dark Mode Toggler --> */}
7373
<div className='flex items-center gap-3 2xsm:gap-7'>
7474
<ul className='flex justify-center items-center gap-2 2xsm:gap-4'>
75-
{/* <DarkModeSwitcher /> */}Dark Mode Switcher
75+
{/* <DarkModeSwitcher />Dark Mode Switcher */}
7676
</ul>
77-
<UserDropdownMenu user={session?.user?.id} />
77+
{session && (
78+
<UserDropdownMenu user={session?.user?.id} />)}
7879
{/* {isUserLoading ? null : !user ? (
7980
<Link to='/login'>
8081
<div className='flex justify-end items-center duration-300 ease-in-out text-gray-900 hover:text-yellow-500 dark:text-white'>
@@ -97,7 +98,7 @@ export function PublicLanding () {
9798
<Dialog.Panel className='fixed inset-y-0 right-0 z-50 w-full overflow-y-auto bg-white px-6 py-6 sm:max-w-sm sm:ring-1 sm:ring-gray-900/10 dark:bg-boxdark dark:text-white'>
9899
<div className='flex items-center justify-between'>
99100
<a href='/' className='-m-1.5 p-1.5'>
100-
<span className='sr-only'>Your SaaS</span>
101+
<span className='sr-only'>Star Sailors</span>
101102
<NavLogo />
102103
</a>
103104
<button
@@ -167,15 +168,14 @@ export function PublicLanding () {
167168
}}
168169
/>
169170
</div>
170-
<div className='py-24 sm:py-32'>
171+
<div className='py-4 sm:py-32'>
171172
<div className='mx-auto max-w-8xl px-6 lg:px-8'>
172173
<div className='lg:mb-18 mx-auto max-w-3xl text-center'>
173174
<h1 className='text-4xl font-bold text-gray-900 sm:text-6xl dark:text-white'>
174-
Some <span className='italic'>cool</span> words about your
175-
product
175+
<span className='italic'>Star Sailors</span>
176176
</h1>
177177
<p className='mt-6 mx-auto max-w-2xl text-lg leading-8 text-gray-600 dark:text-white'>
178-
With some more exciting words about your product!
178+
One-liner about Star Sailors
179179
</p>
180180
<div className='mt-10 flex items-center justify-center gap-x-6'>
181181
<a
@@ -213,7 +213,7 @@ export function PublicLanding () {
213213
<defs>
214214
<path id='a' d='M.06.5h272v190H.06z' />
215215
</defs>
216-
<g fill-rule='evenodd'>
216+
<g fillRule='evenodd'>
217217
<path
218218
className='dark:fill-white'
219219
fill='#545454'
@@ -281,11 +281,10 @@ export function PublicLanding () {
281281
<div id='modules' className='mx-auto mt-48 max-w-7xl px-6 lg:px-8'>
282282
<div className='mx-auto max-w-2xl text-center'>
283283
<p className='mt-2 text-4xl font-bold tracking-tight text-gray-900 sm:text-5xl dark:text-white'>
284-
The <span className='text-yellow-500'>Best</span> modules
284+
<span className='text-yellow-500'>Gameplay</span>
285285
</p>
286286
<p className='mt-6 text-lg leading-8 text-gray-600 dark:text-white'>
287-
Don't work harder.
288-
<br /> Work smarter.
287+
Explore the cosmos & catalogue discoveries in different scientific disciplines
289288
</p>
290289
</div>
291290
<div className='mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-4xl'>
@@ -439,35 +438,25 @@ export default function Home() {
439438

440439
const userId = session?.user?.id;
441440

442-
useEffect(() => {
443-
if (session) {
444-
router.push('/feed');
445-
}
446-
}, [session, router]);
441+
// useEffect(() => {
442+
// if (session) {
443+
// router.push('/feed');
444+
// }
445+
// }, [session, router]);
447446

448447
if (session) {
449448
return (
450-
<Layout>
449+
<LandingLayout>
451450
{/* {userId} */}
452451
<div className="flex flex-col gap-4">
453-
452+
<PublicLanding />
454453
</div>
455-
</Layout>
454+
</LandingLayout>
456455
// <CoreLayout>
457456
)
458457
}
459458

460459
return (
461-
<div className="grid grid-cols-2 h-screen-navbar">
462-
<div className="bg-teal border-r">
463-
<div className="p-4">
464-
<div className="mx-auto tablet:mx-0">
465-
<div className="grid grid-cols-1 content-grid home-hero">
466-
<h1 className="text-4xl font-bold">Test</h1>
467-
</div>
468-
</div>
469-
</div>
470-
</div>
471-
</div>
460+
<PublicLanding />
472461
);
473462
};
+4-4
Loading

0 commit comments

Comments
 (0)