Brought over most of the changes from go-web-starter-kit.

This commit is contained in:
Zed A. Shaw 2025-08-31 11:23:12 -04:00
parent 01fcb964be
commit 8d70b57299
11 changed files with 143 additions and 57 deletions

View file

@ -29,6 +29,7 @@
--color-gray-900: oklch(21% 0.0 264.665);
--color-gray-950: oklch(13% 0.0 261.692);
--color-black: #000;
--color-white: #fff;
--spacing: 0.25rem;
--container-xs: 20rem;
--container-sm: 24rem;
@ -477,9 +478,6 @@
.\!p-4 {
padding: calc(var(--spacing) * 4) !important;
}
.p-0 {
padding: calc(var(--spacing) * 0);
}
.p-0\! {
padding: calc(var(--spacing) * 0) !important;
}
@ -640,7 +638,11 @@
}
@layer theme;
body {
background-color: var(--color-gray-100);
color: var(--color-gray-950);
@media (prefers-color-scheme: dark) {
background-color: var(--color-gray-950);
}
@media (prefers-color-scheme: dark) {
color: var(--color-gray-50);
}
@ -662,13 +664,15 @@ main {
}
header {
display: flex;
flex-direction: column;
justify-content: stretch;
}
nav {
display: flex;
width: 100%;
align-items: center;
justify-content: center;
justify-content: space-evenly;
background-color: var(--color-gray-950);
padding: calc(var(--spacing) * 6);
:is(& > *) {
flex: 1;
}
@ -680,6 +684,12 @@ nav {
color: var(--color-gray-50);
}
}
nav > a {
display: flex;
align-items: center;
justify-content: center;
padding-top: calc(var(--spacing) * 1);
}
code {
speak-as: literal-punctuation;
display: inline-block;
@ -688,10 +698,9 @@ code {
}
pre {
margin-bottom: calc(var(--spacing) * 4);
border-radius: var(--radius-lg);
border-style: var(--tw-border-style);
border-width: 1px;
border-color: var(--color-gray-300);
border-color: var(--color-gray-600);
background-color: var(--color-gray-950);
padding: calc(var(--spacing) * 1);
}
@ -859,6 +868,23 @@ button {
color: var(--color-gray-950);
}
}
blockquote {
border-left-style: var(--tw-border-style);
border-left-width: 5px;
border-color: var(--color-gray-800);
background-color: var(--color-gray-200);
padding: calc(var(--spacing) * 2);
color: var(--color-black);
@media (prefers-color-scheme: dark) {
border-color: var(--color-black);
}
@media (prefers-color-scheme: dark) {
background-color: var(--color-gray-700);
}
@media (prefers-color-scheme: dark) {
color: var(--color-white);
}
}
shape {
display: flex;
aspect-ratio: 1 / 1;
@ -911,7 +937,6 @@ shape.video {
width: 100%;
}
block {
margin-bottom: calc(var(--spacing) * 10);
display: flex;
flex-direction: column;
gap: calc(var(--spacing) * 4);