You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
130 lines
3.3 KiB
130 lines
3.3 KiB
$theme-light-primary:mat-palette($mat-indigo);
|
|
$theme-light-accent:mat-palette($mat-pink, A200, A100, A400);
|
|
$theme-light-warn:mat-palette($mat-red);
|
|
|
|
$theme-light:mat-light-theme($theme-light-primary, $theme-light-accent, $theme-light-warn);
|
|
|
|
.theme-light {
|
|
@include angular-material-theme($theme-light);
|
|
|
|
::-webkit-scrollbar-track,
|
|
::-webkit-scrollbar-track-piece {
|
|
background-color: map-get($mat-grey, 200);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: map-get($mat-grey, 400);
|
|
|
|
&:hover {
|
|
background-color: map-get($mat-grey, 500);
|
|
}
|
|
}
|
|
|
|
.app-background {
|
|
background-color: mat-color(map-get($theme-light, background), background) !important;
|
|
}
|
|
|
|
.app-background-card {
|
|
background-color: mat-color(map-get($theme-light, background), card) !important;
|
|
}
|
|
|
|
.app-background-focus {
|
|
background-color: mat-color(map-get($theme-light, background), hover) !important;
|
|
}
|
|
|
|
.app-background-primary {
|
|
background-color: mat-color($theme-light-primary) !important;
|
|
}
|
|
|
|
.app-background-primary-lighter {
|
|
background-color: mix(mat-color($theme-light-primary), mat-color(map-get($theme-light, background), card), 12%);
|
|
}
|
|
|
|
.app-background-accent {
|
|
background-color: mat-color($theme-light-accent) !important;
|
|
}
|
|
|
|
.app-background-accent-lighter {
|
|
background-color: mix(mat-color($theme-light-accent), mat-color(map-get($theme-light, background), card), 12%);
|
|
}
|
|
|
|
.app-background-warn {
|
|
background-color: mat-color($theme-light-warn) !important;
|
|
}
|
|
|
|
.app-background-warn-lighter {
|
|
background-color: mix(mat-color($theme-light-warn), mat-color(map-get($theme-light, background), card), 12%);
|
|
}
|
|
|
|
.app-foreground {
|
|
color: mat-color(map-get($theme-light, foreground), text) !important;
|
|
}
|
|
|
|
.app-foreground-primary {
|
|
color: mat-color($theme-light-primary) !important;
|
|
}
|
|
|
|
.app-foreground-secondary {
|
|
color: mat-color(map-get($theme-light, foreground), secondary-text) !important;
|
|
}
|
|
|
|
.app-foreground-accent {
|
|
color: mat-color($theme-light-accent) !important;
|
|
}
|
|
|
|
.app-foreground-warn {
|
|
color: mat-color($theme-light-warn) !important;
|
|
}
|
|
|
|
.app-foreground-disabled {
|
|
color: mat-color(map-get($theme-light, foreground), disabled-text) !important;
|
|
}
|
|
|
|
.app-layout {
|
|
@extend .mat-app-background;
|
|
|
|
.app-sidenav-container {
|
|
.app-sidenav:not(.mat-drawer-end) {
|
|
.app-header {
|
|
background-color: mat-color($mat-gray, A100);
|
|
border-bottom-color: mat-color($mat-gray, 300);
|
|
}
|
|
|
|
.app-body {
|
|
background-color: mat-color($mat-gray, A100);
|
|
|
|
.app-menu {
|
|
.app-menu-item {
|
|
|
|
&:hover,
|
|
&.focus {
|
|
background-color: mat-color($mat-gray, 100);
|
|
}
|
|
|
|
&>a {
|
|
color: mat-color($mat-gray, 900);
|
|
}
|
|
|
|
&.active>a {
|
|
color: mat-color($mat-indigo, 500);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.app-sidenav-content {
|
|
.app-header {
|
|
background-color: mat-color($mat-gray, A100);
|
|
border-bottom-color: mat-color($mat-gray, 300);
|
|
}
|
|
|
|
.app-body {
|
|
.ng-bar {
|
|
background-color: mat-color($theme-light-primary);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|