158 lines
2.9 KiB
SCSS
158 lines
2.9 KiB
SCSS
@use "@angular/material" as mat;
|
|
@include mat.core();
|
|
|
|
html {
|
|
@include mat.theme((theme-type: light dark,
|
|
color: (primary: mat.$violet-palette,
|
|
tertiary: mat.$orange-palette,
|
|
use-system-variables: true,
|
|
),
|
|
typography: Roboto,
|
|
density: 0,
|
|
));
|
|
}
|
|
|
|
html,
|
|
body,
|
|
main {
|
|
height: 100%;
|
|
}
|
|
|
|
html,
|
|
body,
|
|
main,
|
|
content,
|
|
nav {
|
|
background-color: var(--mat-sys-background);
|
|
color: var(--mat-sys-on-background);
|
|
}
|
|
|
|
.mat-mdc-card-header,
|
|
.mat-mdc-card-actions {
|
|
color: var(--mat-sys-on-background);
|
|
margin: 1em;
|
|
}
|
|
|
|
.mat-mdc-card-actions {
|
|
padding: 0;
|
|
margin: 0;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family: Roboto, "Helvetica Neue", sans-serif;
|
|
}
|
|
|
|
.light-theme {
|
|
color-scheme: light;
|
|
}
|
|
|
|
.dark-theme {
|
|
color-scheme: dark;
|
|
}
|
|
|
|
.mat-mdc-dialog-surface {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
.mat-mdc-card-actions {
|
|
display: flex;
|
|
align-items: center;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
}
|
|
|
|
.mat-mdc-button {
|
|
color: var(--mat-sys-on-background);
|
|
}
|
|
|
|
/* width */
|
|
::-webkit-scrollbar {
|
|
width: 5px;
|
|
}
|
|
|
|
/* Track */
|
|
::-webkit-scrollbar-track {
|
|
box-shadow: inset 0 0 5px grey;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
/* Handle */
|
|
::-webkit-scrollbar-thumb {
|
|
background: darkgrey;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
/* Handle on hover */
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: rgb(122, 122, 122);
|
|
}
|
|
|
|
.mat-small {
|
|
@include mat.all-component-densities(-5);
|
|
}
|
|
|
|
.mat-large {
|
|
@include mat.all-component-densities(5);
|
|
}
|
|
|
|
.confirm {
|
|
@include mat.button-overrides(( //text-state-layer-color: rgb(52, 255, 62),
|
|
text-label-text-color: rgb(71, 218, 78),
|
|
text-disabled-label-text-color: rgb(71, 218, 78),
|
|
));
|
|
}
|
|
|
|
.neutral {
|
|
@include mat.button-overrides(( //text-state-layer-color: rgb(64, 141, 255),
|
|
text-label-text-color: rgb(52, 106, 255),
|
|
text-disabled-label-text-color: rgb(52, 106, 255),
|
|
));
|
|
}
|
|
|
|
.warning {
|
|
@include mat.button-overrides(( //text-state-layer-color: rgb(255, 172, 63),
|
|
text-label-text-color: rgb(255, 145, 19),
|
|
text-disabled-label-text-color: rgb(255, 145, 19),
|
|
));
|
|
}
|
|
|
|
.danger {
|
|
@include mat.button-overrides(( //text-state-layer-color: rgb(255, 48, 48),
|
|
text-label-text-color: rgb(255, 52, 52),
|
|
text-disabled-label-text-color: rgb(255, 52, 52),
|
|
filled-label-text-color: rgb(255, 52, 52),
|
|
outlined-label-text-color: rgb(255, 52, 52),
|
|
protected-label-text-color: rgb(255, 52, 52),
|
|
protected-state-layer-color: rgb(255, 75, 75),
|
|
protected-ripple-color: rgb(255, 154, 154),
|
|
));
|
|
}
|
|
|
|
.error {
|
|
display: block;
|
|
color: #ba1a1a;
|
|
}
|
|
|
|
.below {
|
|
display: block;
|
|
justify-self: center;
|
|
align-items: center;
|
|
align-self: center;
|
|
text-align: center;
|
|
}
|
|
|
|
@include mat.button-overrides((text-label-text-color: --mat-sys-on-primary,
|
|
protected-label-text-color: --mat-sys-on-primary,
|
|
//state-layer-color: --mat-sys-on-primary,
|
|
));
|
|
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family: Roboto, "Helvetica Neue", sans-serif;
|
|
} |