61 lines
1.2 KiB
SCSS
61 lines
1.2 KiB
SCSS
@import "tokens";
|
|
@import "colors";
|
|
@import "typography";
|
|
@import "theme.light";
|
|
@import "theme.dark";
|
|
|
|
body {
|
|
@extend .body-large;
|
|
|
|
color: var(--md-sys-color-on-background);
|
|
background-color: var(--md-sys-color-background, #fff);
|
|
}
|
|
|
|
small {
|
|
@extend .body-small;
|
|
}
|
|
|
|
$headings: (
|
|
h1: "display-medium",
|
|
h2: "display-small",
|
|
h3: "headline-large",
|
|
h4: "headline-medium",
|
|
h5: "headline-small",
|
|
h6: "title-medium"
|
|
);
|
|
|
|
@each $selector, $class in $headings {
|
|
#{$selector} {
|
|
@extend .#{$class};
|
|
|
|
color: var(--md-sys-color-on-surface);
|
|
}
|
|
}
|
|
|
|
a {
|
|
color: var(--md-sys-color-primary);
|
|
text-decoration: underline;
|
|
border-radius: 4px;
|
|
|
|
&:hover {
|
|
color: var(--md-sys-color-on-primary-container);
|
|
}
|
|
|
|
&:focus {
|
|
margin: -1px;
|
|
border: 1px solid var(--md-sys-color-primary);
|
|
outline: 0;
|
|
box-shadow: inset 0 0 0 1px var(--md-sys-color-surface);
|
|
}
|
|
|
|
&:hover:focus {
|
|
color: var(--md-sys-color-on-primary-container);
|
|
border: 1px solid var(--md-sys-color-on-primary-container);
|
|
outline: 0;
|
|
}
|
|
}
|
|
|
|
top-app-bar [slot="title"] {
|
|
@extend .title-large;
|
|
}
|