victorwesterlund.com/public/assets/css/style.css
2021-11-04 12:54:26 +01:00

74 lines
1.7 KiB
CSS

/* Victor Westerlund - www.victorwesterlund.com */
:root {
--palette-background: 255,255,255;
--palette-contrast: 33,33,33;
--swatch-background: rgb(var(--palette-background));
--swatch-contrast: rgb(var(--palette-contrast));
}
@font-face {
font-family: "Roboto Mono";
font-weight: normal;
font-style: normal;
src: local("Roboto Mono Regular"), local("RobotoMono-Regular"),
url("../fonts/RobotoMono-Regular.woff2") format("woff2"),
url("../fonts/RobotoMono-Regular.woff") format("woff");
}
@font-face {
font-family: "Roboto Mono";
font-weight: bold;
font-style: normal;
src: local("Roboto Mono Bold"), local("RobotoMono-Bold"),
url("../fonts/RobotoMono-Bold.woff2") format("woff2"),
url("../fonts/RobotoMono-Bold.woff") format("woff");
}
/* -- Cornerstones -- */
* {
margin: 0;
font-family: "Roboto Mono","Arial",sans-serif;
color: var(--swatch-contrast);
}
*::selection {
background-color: var(--swatch-contrast);
color: var(--swatch-background);
}
html,
body {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
width: 100%;
height: 100%;
overflow: hidden;
background-color: var(--swatch-background);
}
a {
display: contents;
text-decoration: none;
}
/* -- Media Queries -- */
@media (pointer: fine) {
a:hover {
background: rgba(var(--palette-contrast),.1);
}
}
@media (prefers-color-scheme: dark) {
:root {
--palette-background: 0,0,0;
--palette-contrast: 255,255,255;
--swatch-background: rgb(var(--palette-background));
--swatch-contrast: rgb(var(--palette-contrast));
}
}