+
+// /!\ Keep background colors sync with `theme-color` meta info
+$theme-light: (
+ background: #f5f5f5,
+ card-background: #ffffff,
+ text: #363636,
+ text-title: #303030,
+ text-subtitle: #424242,
+ card-shadow: rgba(0, 0, 0, 0.1),
+ a-hover: #363636
+);
+$theme-dark: (
+ background: #131313,
+ card-background: #2b2b2b,
+ text: #eaeaea,
+ text-title: #fafafa,
+ text-subtitle: #f5f5f5,
+ card-shadow: rgba(0, 0, 0, 0.4),
+ a-hover: #ffdd57
+);
+
+/* raleway-regular - latin */
+@font-face {
+ font-family: 'Raleway';
+ font-style: normal;
+ font-weight: 400;
+ font-display: swap;
+ src: local('Raleway'), local('Raleway-Regular'),
+ url('./webfonts/raleway/raleway-v14-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
+ url('./webfonts/raleway/raleway-v14-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+
+/* lato-regular - latin */
+@font-face {
+ font-family: 'Lato';
+ font-style: normal;
+ font-weight: 400;
+ font-display: swap;
+ src: local('Lato Regular'), local('Lato-Regular'),
+ url('./webfonts/lato/lato-v16-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
+ url('./webfonts/lato/lato-v16-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
+}
+
+@mixin theme($theme) {
+ background-color: map-get($theme, "background");
+ color: map-get($theme, "text");
+ a {
+ &:hover {
+ color: map-get($theme, "a-hover");
+ }
+ }
+
+ .title {
+ color: map-get($theme, "text-title");
+ }
+ .subtitle {
+ color: map-get($theme, "text-subtitle");
+ }
+
+ .card {
+ background-color: map-get($theme, "card-background");
+ box-shadow: 0 2px 15px 0 map-get($theme, "card-shadow");
+ &:hover {
+ background-color: map-get($theme, "card-background");
+ }
+ }
+
+ .footer {
+ background-color: map-get($theme, "card-background");
+ box-shadow: 0 2px 15px 0 map-get($theme, "card-shadow");
+ }
+}
+
+html {
+ height: 100%;
+}
+