Skip to content

Commit

Permalink
Styling fixes.
Browse files Browse the repository at this point in the history
  • Loading branch information
Matt Welsh committed May 7, 2024
1 parent 91617f5 commit 4c52e3f
Showing 2 changed files with 5 additions and 53 deletions.
40 changes: 4 additions & 36 deletions astro/src/components/Header.astro
Original file line number Diff line number Diff line change
@@ -11,42 +11,10 @@ const { activeNav } = Astro.props;
---

<header>
<a id="skip-to-content" href="#main-content">Skip to content</a>
<div class="nav-container">
<div class="top-nav-wrap">
<a href="/" class="logo whitespace-nowrap">
{SITE.title}
</a>
<nav id="nav-menu">
<button
class="hamburger-menu focus-outline"
aria-label="Open Menu"
aria-expanded="false"
aria-controls="menu-items"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="1.5"
stroke-linecap="round"
stroke-linejoin="round"
class="menu-icon"
>
<line x1="7" y1="12" x2="21" y2="12" class="line"></line>
<line x1="3" y1="6" x2="21" y2="6" class="line"></line>
<line x1="12" y1="18" x2="21" y2="18" class="line"></line>
<line x1="18" y1="6" x2="6" y2="18" class="close"></line>
<line x1="6" y1="6" x2="18" y2="18" class="close"></line>
</svg>
</button>
</nav>
<div class="w-full">
<Socials centered />
</div>
<div class="max-w-3xl mx-auto flex flex-row items-center justify-between px-4 py-4">
<a class="py-1 text-xl font-semibold" href="/">{SITE.title}</a>
<div class="md:block hidden">
<Socials centered />
</div>
</div>
<Hr />
18 changes: 1 addition & 17 deletions astro/src/styles/base.css
Original file line number Diff line number Diff line change
@@ -7,15 +7,7 @@

@layer base {
:root,
html[data-theme="light"] {
--color-fill: 251, 254, 251;
--color-text-base: 40, 39, 40;
--color-accent: 0, 108, 172;
--color-card: 230, 230, 230;
--color-card-muted: 205, 205, 205;
--color-border: 236, 233, 233;
}
html[data-theme="dark"] {
html {
--color-fill: 20, 21, 20;
/* --color-text-base: 234, 237, 243; */
--color-text-base: 200, 200, 200;
@@ -24,14 +16,6 @@
--color-card-muted: 138, 51, 2;
--color-border: 171, 75, 8;
}
#sun-svg,
html[data-theme="dark"] #moon-svg {
display: none;
}
#moon-svg,
html[data-theme="dark"] #sun-svg {
display: block;
}
body {
@apply flex min-h-[100svh] flex-col bg-skin-fill font-mono text-skin-base
selection:bg-skin-accent selection:bg-opacity-70 selection:text-skin-inverted;

0 comments on commit 4c52e3f

Please sign in to comment.