hugo-theme-hello-friend/assets/css/variables.css
panr 0be313316f Init version 2
- Switch to the Hugo Pipes (bye bye Webpack)
- Use Inter from Google Fonts
- Update README
2020-08-09 00:43:49 +02:00

44 lines
915 B
CSS

:root {
/* light theme color */
--background: #fff;
--background-secondary: #eaeaea;
--header: #fafafa;
--color: #222;
--color-secondary: #999;
--border-color: #dcdcdc;
/* variables for js, must be the same as these in @custom-media queries */
--phoneWidth: (max-width: 684px);
--tabletWidth: (max-width: 900px);
}
body.dark-theme {
/* dark theme colors */
--background: #292a2d;
--background-secondary: #3b3d42;
--header: #252627;
--color: #a9a9b3;
--color-secondary: #73747b;
--border-color: #4a4b50;
}
@custom-media --phone (width < 684px);
@custom-media --tablet (width < 900px);
@define-mixin greater-icon $stroke-width: 3px, $width: .95rem, $height: 100% {
.greater-icon {
width: $width;
height: $height;
path {
stroke: currentColor;
stroke-width: $stroke-width;
}
}
}
/* HOW TO USE */
/*@media (--phone) {*/
/*margin-top: 0;*/
/*}*/