better htmx, better css

This commit is contained in:
ari melody 2024-04-07 00:26:03 +01:00
parent 6260715057
commit f7f6254016
Signed by: ari
GPG key ID: CF99829C92678188
4 changed files with 55 additions and 32 deletions

View file

@ -16,10 +16,31 @@
}
}
body {
margin: 0;
padding: 0;
font-family: "Lora", serif;
font-size: 20px;
color: var(--foreground);
background-color: var(--background);
transition: color .2s linear, background-color .2s linear;
}
header {
position: fixed;
top: 1em;
left: 50%;
transform: translateX(-50%);
width: min(900px, calc(100vw - 4rem));
margin: 0 auto;
padding: .5em 0;
border-radius: 2em;
text-align: center;
backdrop-filter: blur(1em);
z-index: 100;
}
header nav {
@ -31,31 +52,10 @@ header nav span {
color: var(--primary-fg);
}
body {
position: absolute;
top: 0;
left: 0;
width: 100vw;
min-height: 100vh;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-family: "Lora", serif;
font-size: 1.5rem;
color: var(--foreground);
background-color: var(--background);
transition: color .2s linear, background-color .2s linear;
}
main {
width: min(720px, calc(100vw - 4rem));
min-height: calc(100vh - 8.3em);
margin: 3em auto 0 auto;
text-align: center;
}
@ -84,8 +84,16 @@ main {
}
}
.center-content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
hr {
margin: 2rem 0;
width: 100%;
margin: 1em 0;
border-width: 1px 0 0 0;
}
hr::after {
@ -133,6 +141,7 @@ button:active {
footer {
width: min(900px, calc(100vw - 4rem));
margin: 0 auto;
padding: 1em 0;
text-align: center;
opacity: .5;
transition: opacity .1s ease-out;