SiteWebAstrolabe/src/scss/_theme.scss

88 lines
1.7 KiB
SCSS
Raw Normal View History

2020-06-19 23:47:44 +02:00
:root {
// Pull the tokens and generate custom props
@each $color in $stalfos-colors {
#{'--color-' + nth($color, 1)}: #{nth($color, 2)};
}
// Set theme aliases
--color-mode: 'light';
--color-bg: #{get-color('light')};
--color-bg-glare: #{get-color('light')};
--color-text: #{get-color('dark')};
--color-text-glare: #{get-color('dark')};
--color-selection-text: #{get-color('light')};
--color-selection-bg: #{get-color('dark')};
--color-stroke: #{get-color('mid')};
--color-action-bg: #{get-color('primary')};
--color-action-text: #{get-color('dark')};
2020-06-19 23:47:44 +02:00
--color-theme-primary: #{get-color('primary')};
--color-theme-primary-glare: #{get-color('primary-glare')};
--color-theme-highlight: #{get-color('highlight')};
--color-theme-highlight-block: #{get-color('highlight')};
--color-theme-secondary: #{get-color('secondary')};
--color-light-gray: #{get-color('light-gray')};
2020-07-15 23:29:09 +02:00
--color-light-blue: #{get-color('light-blue')};
2020-06-19 23:47:44 +02:00
--color-white: #{get-color('light')};
}
body {
color: var(--color-text);
background-color: var(--color-bg);
}
main {
overflow: hidden;
}
::selection {
2020-07-18 02:23:16 +02:00
color: var(--color-white);
background-color: var(--color-secondary);
2020-06-19 23:47:44 +02:00
}
2020-07-15 16:35:24 +02:00
2020-07-16 17:16:54 +02:00
a:not([class]),
a:not([class]):visited {
2020-07-15 16:35:24 +02:00
color: var(--color-dark);
2020-07-16 17:16:54 +02:00
font-weight: 600;
2020-07-15 16:35:24 +02:00
2020-07-16 17:16:54 +02:00
&:hover {
2020-07-15 23:05:36 +02:00
text-decoration: none;
}
}
.link {
font-weight: 400;
color: var(--color-dark);
&:visited {
color: inherit;
}
}
2020-07-15 23:05:36 +02:00
.return-link {
align-self: flex-end;
font-size: 1.125rem;
font-weight: 700;
margin-top: 2rem;
2020-07-16 18:07:36 +02:00
color: var(--color-dark);
2020-07-15 23:05:36 +02:00
&:visited {
color: inherit;
2020-07-15 16:35:24 +02:00
}
}
2021-11-09 19:24:23 +01:00
.justify-end {
justify-content: flex-end;
}
.ml-1 {
margin-left: 1rem;
}
.align-center {
align-items: center;
}
.fw-600 {
font-weight: 600;
}