Skip to content

Commit

Permalink
🥉🦡 ↝ [SGV2-22]: I have a phobia that someone's always there
Browse files Browse the repository at this point in the history
  • Loading branch information
@Gizmotronn
Gizmotronn committed Apr 24, 2024
1 parent fe8eb14 commit 598cdf5
Show file tree
Hide file tree
Showing 3 changed files with 55 additions and 57 deletions.
40 changes: 20 additions & 20 deletions components/_Core/Section/Header.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,29 +3,29 @@ import React from "react";
export default function Header() {
return (
<div className="navbar bg-base-100 h-full w-full bg-red-100 rounded-md bg-clip-padding backdrop-filter backdrop-blur-xl bg-opacity-10">
<div className="navbar-start">
<div className="dropdown">
<div tabIndex={0} role="button" className="btn btn-ghost btn-circle">
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 6h16M4 12h16M4 18h7" /></svg>
<div className="navbar-start">
<div className="dropdown">
<div tabIndex={0} role="button" className="btn btn-ghost btn-circle">
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 6h16M4 12h16M4 18h7" /></svg>
</div>
<ul tabIndex={0} className="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-100 rounded-box w-52">
<li><a>Homepage</a></li>
<li><a>Portfolio</a></li>
<li><a>About</a></li>
</ul>
</div>
</div>
<ul tabIndex={0} className="menu menu-sm dropdown-content mt-3 z-[1] p-2 shadow bg-base-100 rounded-box w-52">
<li><a>Homepage</a></li>
<li><a>Portfolio</a></li>
<li><a>About</a></li>
</ul>
<div className="navbar-center">
<a className="btn btn-ghost text-xl">[Planet Name]</a>
</div>
</div>
<div className="navbar-center">
<a className="btn btn-ghost text-xl">[Planet Name]</a>
</div>
<div className="navbar-end">
<button className="btn btn-ghost btn-circle">
<div className="indicator">
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" /></svg>
<span className="badge badge-xs badge-primary indicator-item"></span>
<div className="navbar-end">
<button className="btn btn-ghost btn-circle">
<div className="indicator">
<svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" /></svg>
<span className="badge badge-xs badge-primary indicator-item"></span>
</div>
</button>
</div>
</button>
</div>
</div>
);
};
67 changes: 32 additions & 35 deletions components/_Core/Section/Planet.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,13 +35,13 @@ const Planet: React.FC<PlanetProps> = ({
src={backgroundImage}
className="object-cover absolute inset-0 size-full"
/>
<Header
{/* <Header
logoImage={logoImage}
planetName={planetName}
leftArrowImage={leftArrowImage}
rightArrowImage={rightArrowImage}
compassImage={compassImage}
/>
/> */}
<RoverSection
structureImage={structureImage}
activeRoverImage={activeRoverImage}
Expand All @@ -68,45 +68,42 @@ const Header: React.FC<HeaderProps> = ({
rightArrowImage,
compassImage,
}) => {
return (
<div className="flex relative flex-col justify-center w-full backdrop-blur-[5px] bg-white bg-opacity-0 max-md:max-w-full">
<div className="flex gap-2.5 justify-between items-center px-12 py-5 w-full max-md:flex-wrap max-md:px-5 max-md:max-w-full">
<img
loading="lazy"
src={logoImage}
className="shrink-0 self-stretch my-auto max-w-full aspect-square w-[100px]"
/>
<div className="flex flex-col justify-center self-stretch max-md:max-w-full">
<div className="flex flex-col justify-center items-center py-1.5 max-md:max-w-full">
<div className="justify-center px-4 py-1 text-xl font-medium text-center text-white whitespace-nowrap rounded-xl shadow-sm bg-indigo-600 bg-opacity-40">
Main
</div>
<div className="flex gap-5 justify-center items-center self-stretch px-3 mt-2 text-3xl font-semibold text-center text-white uppercase tracking-[5.12px] max-md:flex-wrap">
return (
<div className="flex relative flex-col justify-center w-full backdrop-blur-[5px] bg-white bg-opacity-0 max-md:max-w-full">
<div className="flex flex-col justify-center items-center px-12 py-5 w-full max-md:px-5 max-md:max-w-full md:flex-row md:justify-between">
<div className="flex flex-col justify-center items-center md:flex-row md:items-center">
<img
loading="lazy"
src={leftArrowImage}
className="shrink-0 self-stretch my-auto border-white border-solid aspect-square border-[3px] stroke-[3px] stroke-white w-[33px]"
src={logoImage}
className="shrink-0 self-stretch my-auto max-w-full aspect-square w-[100px] md:w-auto"
/>
<div className="self-stretch">{planetName}</div>
<img
loading="lazy"
src={rightArrowImage}
className="shrink-0 self-stretch my-auto border-white border-solid aspect-square border-[3px] stroke-[3px] stroke-white w-[33px]"
/>
</div>
<div className="flex justify-center items-center p-1.5 mt-2 w-[47px]">
<img loading="lazy" src={compassImage} className="w-full aspect-square" />
<div className="flex flex-col justify-center self-stretch">
<div className="flex gap-5 justify-center items-center self-stretch mt-2 text-3xl font-semibold text-center text-white uppercase tracking-[5.12px] md:mt-0">
<img
loading="lazy"
src={leftArrowImage}
className="shrink-0 self-stretch my-auto border-white border-solid aspect-square border-[3px] stroke-[3px] stroke-white w-[33px]"
/>
<div className="self-stretch">{planetName}</div>
<img
loading="lazy"
src={rightArrowImage}
className="shrink-0 self-stretch my-auto border-white border-solid aspect-square border-[3px] stroke-[3px] stroke-white w-[33px]"
/>
</div>
<div className="flex justify-center items-center p-1.5 mt-2 w-[47px] md:mt-0">
<img loading="lazy" src={compassImage} className="w-full aspect-square" />
</div>
</div>
</div>
<img
loading="lazy"
src={logoImage}
className="shrink-0 self-stretch my-auto max-w-full aspect-square w-[100px] md:w-auto"
/>
</div>
</div>
<img
loading="lazy"
src={logoImage}
className="shrink-0 self-stretch my-auto max-w-full aspect-square w-[100px]"
/>
</div>
</div>
);
);
};

interface RoverSectionProps {
Expand Down
5 changes: 3 additions & 2 deletions pages/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import { useMediaQuery } from 'react-responsive';
import { Metadata } from "next";
import PublicLanding from "../components/_Core/LandingContent";
import Layout from "../components/_Core/Section/Layout";
import Planet from "../components/_Core/Section/Planet";

export const metadata: Metadata = {
title: "Star Sailors",
Expand All @@ -19,9 +20,9 @@ export default function Home() {
if (session) {
return (
<Layout>
<p>Run into the shadows</p>
<Planet backgroundImage="https://cdn.cloud.scenario.com/assets/asset_J8Mo3eYBJWMjdC8wSQQ15edx?p=100&Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uY2xvdWQuc2NlbmFyaW8uY29tL2Fzc2V0cy9hc3NldF9KOE1vM2VZQkpXTWpkQzh3U1FRMTVlZHg~cD0xMDAqIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzE1MTI2Mzk5fX19XX0_&Key-Pair-Id=K36FIAB9LE2OLR&Signature=OuEtnaPodT1W4BsZZep27dJD5Sk3jzwsrSj1Dktkh2GoojVG~Ttn0WFhDvEBx~m6bX0~~8tEIcqk-NuornLcTtfG0TIE0H18LOPj-BWhTS9dg72-Zkg3ris1MwpAkSuQ~9GUlKPt3N4VgYz5b6h7TmDa06u7PPATCEuIwcjXBs23sNZbW4bAOS9EQTzv9bjPY6rc1IPFq~9ua8xx8~3q8qMlcZ1NoB1pYhCJEM7ROBPBu0fWtp2IlUYNAX21zBJFTgvnqjsIazuual3wLR1ennoO3mRuMS8uzTq6eoHBiIwKkY4rQUFsUpuORWcOpevh7Wz6eGBn7d4X5xDhuBV6oA__&format=jpeg" logoImage="https://cdn-icons-png.flaticon.com/512/7717/7717354.png" leftArrowImage="https://www.svgrepo.com/show/27797/left-arrow.svg" rightArrowImage="https://www.svgrepo.com/show/27797/right-arrow.svg" structureImage="https://github.com/Signal-K/client/blob/initialClassification/public/assets/Inventory/Structures/TelescopeReceiver.png?raw=true" compassImage="https://www.svgrepo.com/show/532904/compass-drafting.svg" planetName="HelloWorld" activeRoverImage="https://cdn-icons-png.flaticon.com/512/7717/7717354.png" idleRoverImage="https://www.svgrepo.com/show/440444/space-rover-2.svg" galleryImages={['https://www.svgrepo.com/show/440444/space-rover-2.svg']} centerButtonImage="https://www.svgrepo.com/show/440396/black-hole.svg" />
</Layout>
// <Planet backgroundImage="https://cdn.cloud.scenario.com/assets/asset_J8Mo3eYBJWMjdC8wSQQ15edx?p=100&Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uY2xvdWQuc2NlbmFyaW8uY29tL2Fzc2V0cy9hc3NldF9KOE1vM2VZQkpXTWpkQzh3U1FRMTVlZHg~cD0xMDAqIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzE1MTI2Mzk5fX19XX0_&Key-Pair-Id=K36FIAB9LE2OLR&Signature=OuEtnaPodT1W4BsZZep27dJD5Sk3jzwsrSj1Dktkh2GoojVG~Ttn0WFhDvEBx~m6bX0~~8tEIcqk-NuornLcTtfG0TIE0H18LOPj-BWhTS9dg72-Zkg3ris1MwpAkSuQ~9GUlKPt3N4VgYz5b6h7TmDa06u7PPATCEuIwcjXBs23sNZbW4bAOS9EQTzv9bjPY6rc1IPFq~9ua8xx8~3q8qMlcZ1NoB1pYhCJEM7ROBPBu0fWtp2IlUYNAX21zBJFTgvnqjsIazuual3wLR1ennoO3mRuMS8uzTq6eoHBiIwKkY4rQUFsUpuORWcOpevh7Wz6eGBn7d4X5xDhuBV6oA__&format=jpeg" logoImage="https://avatars.githubusercontent.com/u/78838067?s=200&v=4" leftArrowImage="https://www.svgrepo.com/show/27797/left-arrow.svg" rightArrowImage="https://www.svgrepo.com/show/27797/right-arrow.svg" structureImage="https://github.com/Signal-K/client/blob/initialClassification/public/assets/Inventory/Structures/TelescopeReceiver.png?raw=true" compassImage="https://www.svgrepo.com/show/532904/compass-drafting.svg" planetName="HelloWorld" activeRoverImage="https://cdn-icons-png.flaticon.com/512/7717/7717354.png" idleRoverImage="https://www.svgrepo.com/show/440444/space-rover-2.svg" galleryImages={['https://www.svgrepo.com/show/440444/space-rover-2.svg']} centerButtonImage="https://www.svgrepo.com/show/440396/black-hole.svg" />
// <Planet backgroundImage="https://cdn.cloud.scenario.com/assets/asset_J8Mo3eYBJWMjdC8wSQQ15edx?p=100&Policy=eyJTdGF0ZW1lbnQiOlt7IlJlc291cmNlIjoiaHR0cHM6Ly9jZG4uY2xvdWQuc2NlbmFyaW8uY29tL2Fzc2V0cy9hc3NldF9KOE1vM2VZQkpXTWpkQzh3U1FRMTVlZHg~cD0xMDAqIiwiQ29uZGl0aW9uIjp7IkRhdGVMZXNzVGhhbiI6eyJBV1M6RXBvY2hUaW1lIjoxNzE1MTI2Mzk5fX19XX0_&Key-Pair-Id=K36FIAB9LE2OLR&Signature=OuEtnaPodT1W4BsZZep27dJD5Sk3jzwsrSj1Dktkh2GoojVG~Ttn0WFhDvEBx~m6bX0~~8tEIcqk-NuornLcTtfG0TIE0H18LOPj-BWhTS9dg72-Zkg3ris1MwpAkSuQ~9GUlKPt3N4VgYz5b6h7TmDa06u7PPATCEuIwcjXBs23sNZbW4bAOS9EQTzv9bjPY6rc1IPFq~9ua8xx8~3q8qMlcZ1NoB1pYhCJEM7ROBPBu0fWtp2IlUYNAX21zBJFTgvnqjsIazuual3wLR1ennoO3mRuMS8uzTq6eoHBiIwKkY4rQUFsUpuORWcOpevh7Wz6eGBn7d4X5xDhuBV6oA__&format=jpeg" logoImage="https://cdn-icons-png.flaticon.com/512/7717/7717354.png" leftArrowImage="https://www.svgrepo.com/show/27797/left-arrow.svg" rightArrowImage="https://www.svgrepo.com/show/27797/right-arrow.svg" structureImage="https://github.com/Signal-K/client/blob/initialClassification/public/assets/Inventory/Structures/TelescopeReceiver.png?raw=true" compassImage="https://www.svgrepo.com/show/532904/compass-drafting.svg" planetName="HelloWorld" activeRoverImage="https://cdn-icons-png.flaticon.com/512/7717/7717354.png" idleRoverImage="https://www.svgrepo.com/show/440444/space-rover-2.svg" galleryImages={['https://www.svgrepo.com/show/440444/space-rover-2.svg']} centerButtonImage="https://www.svgrepo.com/show/440396/black-hole.svg" />
);
};

Expand Down

0 comments on commit 598cdf5

Please sign in to comment.