Skip to content

Commit

Permalink
update colors
Browse files Browse the repository at this point in the history
  • Loading branch information
@tireymorris
tireymorris committed May 1, 2024
1 parent bdc6c5a commit 59ea652
Show file tree
Hide file tree
Showing 5 changed files with 17 additions and 22 deletions.
17 changes: 8 additions & 9 deletions public/styles/uno.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,24 +58,23 @@
.gap-8{gap:2rem;}
.border{border-width:1px;}
.border-b-1{border-bottom-width:1px;}
.border-amber-300{--un-border-opacity:1;border-color:rgb(252 211 77 / var(--un-border-opacity));}
.border-blue-300{--un-border-opacity:1;border-color:rgb(147 197 253 / var(--un-border-opacity));}
.border-gray-2{--un-border-opacity:1;border-color:rgb(229 231 235 / var(--un-border-opacity));}
.focus\:border-blue-200:focus{--un-border-opacity:1;border-color:rgb(191 219 254 / var(--un-border-opacity));}
.rounded-md{border-radius:0.375rem;}
.border-none{border-style:none;}
.border-solid{border-style:solid;}
.border-b-solid{border-bottom-style:solid;}
.bg-amber-200{--un-bg-opacity:1;background-color:rgb(253 230 138 / var(--un-bg-opacity));}
.bg-amber-300{--un-bg-opacity:1;background-color:rgb(252 211 77 / var(--un-bg-opacity));}
.bg-amber-50{--un-bg-opacity:1;background-color:rgb(255 251 235 / var(--un-bg-opacity));}
.bg-amber-900{--un-bg-opacity:1;background-color:rgb(120 53 15 / var(--un-bg-opacity));}
.bg-blue-100{--un-bg-opacity:1;background-color:rgb(219 234 254 / var(--un-bg-opacity));}
.bg-slate-700{--un-bg-opacity:1;background-color:rgb(51 65 85 / var(--un-bg-opacity));}
.bg-blue-200{--un-bg-opacity:1;background-color:rgb(191 219 254 / var(--un-bg-opacity));}
.bg-blue-300{--un-bg-opacity:1;background-color:rgb(147 197 253 / var(--un-bg-opacity));}
.bg-blue-50{--un-bg-opacity:1;background-color:rgb(239 246 255 / var(--un-bg-opacity));}
.bg-blue-700{--un-bg-opacity:1;background-color:rgb(29 78 216 / var(--un-bg-opacity));}
.bg-blue-900{--un-bg-opacity:1;background-color:rgb(30 58 138 / var(--un-bg-opacity));}
.bg-transparent{background-color:transparent;}
.bg-white{--un-bg-opacity:1;background-color:rgb(255 255 255 / var(--un-bg-opacity));}
.hover\:bg-amber-300:hover{--un-bg-opacity:1;background-color:rgb(252 211 77 / var(--un-bg-opacity));}
.hover\:bg-amber-400:hover{--un-bg-opacity:1;background-color:rgb(251 191 36 / var(--un-bg-opacity));}
.hover\:bg-slate-700:hover{--un-bg-opacity:1;background-color:rgb(51 65 85 / var(--un-bg-opacity));}
.hover\:bg-blue-400:hover{--un-bg-opacity:1;background-color:rgb(96 165 250 / var(--un-bg-opacity));}
.hover\:bg-blue-700:hover{--un-bg-opacity:1;background-color:rgb(29 78 216 / var(--un-bg-opacity));}
.fill-neutral-500{--un-fill-opacity:1;fill:rgb(115 115 115 / var(--un-fill-opacity));}
.fill-white{--un-fill-opacity:1;fill:rgb(255 255 255 / var(--un-fill-opacity));}
.p-0{padding:0;}
Expand Down
2 changes: 1 addition & 1 deletion src/components/Button.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export default function PinkButton({
}: Props) {
return (
<button
class={`flex cursor-pointer items-center justify-center gap-3 rounded-md border-none px-4 py-2 text-base font-bold shadow-md bg-amber-300 text-brown-800 hover:bg-amber-400 ${className}`}
class={`flex cursor-pointer items-center justify-center gap-3 rounded-md border-none px-4 py-2 text-base font-bold shadow-md bg-blue-300 text-brown-800 hover:bg-blue-400 ${className}`}
{...rest}
>
{children}
Expand Down
8 changes: 4 additions & 4 deletions src/components/Layout.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ export default function Layout({ title, children, currentPath }: Props) {
<title>{title}</title>
<link
rel="icon"
href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🥞</text></svg>"
href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🌊</text></svg>"
/>
<script src="https://unpkg.com/[email protected]" />
<link rel="stylesheet" href="/styles/uno.css" />
Expand All @@ -28,8 +28,8 @@ export default function Layout({ title, children, currentPath }: Props) {

<style>{`* { box-sizing: border-box; margin: 0; outline: none; color: unset; }`}</style>

<body class="font-lato m-0 bg-amber-50 text-base">
<header class="border-b-solid border-b-1 fixed sticky flex w-full gap-4 border-amber-300 bg-amber-200 py-3 px-4 leading-5">
<body class="font-lato m-0 bg-blue-50 text-base">
<header class="border-b-solid border-b-1 fixed sticky flex w-full gap-4 border-blue-300 bg-blue-200 py-3 px-4 leading-5">
<a
href="/"
class="no-underline text-brown-800"
Expand All @@ -46,7 +46,7 @@ export default function Layout({ title, children, currentPath }: Props) {

<Nav currentPath={currentPath} />

<main class="m-auto flex flex-col justify-center gap-8 py-4 pl-20 md:pl-60 md:pr-10 bg-cream-200">
<main class="m-auto flex flex-col justify-center gap-8 py-4 pl-20 md:pl-60 md:pr-10">
{children}
</main>
</body>
Expand Down
7 changes: 2 additions & 5 deletions src/components/Nav.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { routes } from "../routes";

export default function Nav({ currentPath }: { currentPath: string }) {
return (
<aside class="transition-width group fixed top-14 block h-full w-16 bg-amber-900 leading-5 duration-200 hover:w-56 md:w-56 text-cream-100">
<aside class="transition-width group fixed top-14 block h-full w-16 bg-blue-900 leading-5 duration-200 hover:w-56 md:w-56 text-cream-100">
<nav>
<ul class="m-0 flex w-full flex-col items-center p-0">
<Button class="items-start! justify-start! my-4 w-5/6 pl-5 ">
Expand All @@ -17,10 +17,7 @@ export default function Nav({ currentPath }: { currentPath: string }) {
<NavItem
currentPath={currentPath}
route={route}
style="bg-amber-200 hover:bg-amber-300 text-brown-900 hover:text-brown-700"
>
{route.label}
</NavItem>
/>
))}
</ul>
</nav>
Expand Down
5 changes: 2 additions & 3 deletions src/components/NavItem.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,9 +8,8 @@ type NavItemProps = {
export default function NavItem({ currentPath, route }: NavItemProps) {
return (
<li
class={`m-0 w-full list-none pl-6 text-slate-400 hover:bg-slate-700 hover:text-white ${
currentPath === route.link && "bg-slate-700 text-white"
}`}
class={`m-0 w-full list-none pl-6 text-slate-400 hover:bg-blue-700 hover:text-white ${currentPath === route.link && "bg-blue-700 text-white"
}`}
>
<a
href={route.link}
Expand Down

0 comments on commit 59ea652

Please sign in to comment.