site/web/public/style.css
2024-03-06 06:38:23 -05:00

105 lines
1.8 KiB
CSS

@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo&display=swap');
html {
height: 100dvh;
margin: 0 auto;
max-width: 600px;
}
* {
display: block;
box-sizing: border-box;
flex-shrink: 0;
text-wrap: balance;
font-family: 'Atkinson Hyperlegible', sans-serif;
text-rendering: optimizeLegibility;
}
title, style, script {
display: none;
}
body {
height: 100dvh;
margin: 0 auto; padding: 0;
line-height: 1.5;
background-color: #808080;
color: #000;
}
main {
height: 100dvh;
margin: 0 auto;
/* padding-top: 64px; */
display: flex;
flex-flow: column;
align-items: center;
}
h1, h2 {
letter-spacing: 2px;
}
h1 {
color: #fff;
}
a, b, i, code, span {
display: inline;
font-family: inherit;
font-size: inherit;
color: inherit;
}
a {
cursor: pointer;
text-decoration: underline;
}
a:focus {
filter: brightness(1.333);
}
b { font-weight: bold; }
i { font-style: italic; }
code {
font-family: 'DM Mono', monospace;
font-weight: 500;
color: #0000FF;
}
ul {
all: revert;
width: 90%;
margin: 0 auto;
margin-bottom: 1rem;
}
li {
all: revert;
}
img, video, canvas {
overflow: hidden;
}
img {
all: revert-layer;
display: block;
margin: 0 auto;
border-radius: 6px;
}
video {
border-radius: 6px;
}
.t_symbol {
margin: 2rem auto;
font-family: "Nanum Myeongjo", serif;
text-align: center;
font-size: 64px;
/* font-weight: bold; */
color: #666;
}
footer {
margin-top: 128px;
height: 64px;
line-height: 64px;
letter-spacing: 0.5px;
font-size: 0.75em;
}
input {
outline: none;
border: none;
padding: 8px 16px;
border-radius: 32px;
letter-spacing: 1px;
font-size: 16px;
}