base font sizes on rem and var(--base)

This commit is contained in:
earlman 2021-04-04 13:05:41 -05:00
parent ff43d082f2
commit d46784a4d5

View File

@ -1,6 +1,7 @@
:root { :root {
--color-text: #fff; --color-text: #fff;
--color-background: black; --color-background: black;
--base: 20px;
} }
html { html {
@ -8,6 +9,7 @@ html {
overflow: hidden; overflow: hidden;
background: var(--color-background); background: var(--color-background);
user-select: none; user-select: none;
font-size: var(--base);
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
@ -23,8 +25,7 @@ body {
color: var(--color-text); color: var(--color-text);
font-family: "Roboto Condensed", sans-serif; font-family: "Roboto Condensed", sans-serif;
font-weight: 400; font-weight: 400;
font-size: 2em; line-height: 1.5;
line-height: 1.5em;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }
@ -48,27 +49,27 @@ body {
} }
.xsmall { .xsmall {
font-size: 15px; font-size: 0.667rem;
line-height: 1.4; line-height: 1.4;
} }
.small { .small {
font-size: 20px; font-size: 1rem;
line-height: 1.4; line-height: 1.4;
} }
.medium { .medium {
font-size: 30px; font-size: 1.5rem;
line-height: 1.4; line-height: 1.4;
} }
.large { .large {
font-size: 65px; font-size: 2.25rem;
line-height: 1; line-height: 1;
} }
.xlarge { .xlarge {
font-size: 75px; font-size: 3.375rem;
line-height: 1; line-height: 1;
letter-spacing: -3px; letter-spacing: -3px;
} }