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.
128 lines
3.1 KiB
128 lines
3.1 KiB
$theme-dark-primary:mat-palette($mat-blue, 200);
|
|
$theme-dark-accent:mat-palette($mat-amber, A200, A100, A400);
|
|
$theme-dark-warn:mat-palette($mat-deep-orange);
|
|
|
|
$theme-dark:mat-dark-theme($theme-dark-primary, $theme-dark-accent, $theme-dark-warn);
|
|
|
|
.theme-dark {
|
|
@include angular-material-theme($theme-dark);
|
|
|
|
::-webkit-scrollbar-track,
|
|
::-webkit-scrollbar-track-piece {
|
|
background-color: map-get($mat-grey, 700);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: map-get($mat-grey, 500);
|
|
|
|
&:hover {
|
|
background-color: map-get($mat-grey, 400);
|
|
}
|
|
}
|
|
|
|
.app-background {
|
|
background-color: mat-color(map-get($theme-dark, background), background) !important;
|
|
}
|
|
|
|
.app-background-card {
|
|
background-color: mat-color(map-get($theme-dark, background), card) !important;
|
|
}
|
|
|
|
.app-background-focus {
|
|
background-color: mat-color(map-get($theme-dark, background), hover) !important;
|
|
}
|
|
|
|
.app-background-primary {
|
|
background-color: mat-color($theme-dark-primary) !important;
|
|
}
|
|
|
|
.app-background-primary-lighter {
|
|
background-color: mix(mat-color($theme-dark-primary), mat-color(map-get($theme-dark, background), card), 12%);
|
|
}
|
|
|
|
.app-background-accent {
|
|
background-color: mat-color($theme-dark-accent) !important;
|
|
}
|
|
|
|
.app-background-accent-lighter {
|
|
background-color: mix(mat-color($theme-dark-accent), mat-color(map-get($theme-dark, background), card), 12%);
|
|
}
|
|
|
|
.app-background-warn {
|
|
background-color: mat-color($theme-dark-warn) !important;
|
|
}
|
|
|
|
.app-background-warn-lighter {
|
|
background-color: mix(mat-color($theme-dark-warn), mat-color(map-get($theme-dark, background), card), 12%);
|
|
}
|
|
|
|
.app-foreground {
|
|
color: mat-color(map-get($theme-dark, foreground), text) !important;
|
|
}
|
|
|
|
.app-foreground-primary {
|
|
color: mat-color($theme-dark-primary) !important;
|
|
}
|
|
|
|
.app-foreground-secondary {
|
|
color: mat-color(map-get($theme-dark, foreground), secondary-text) !important;
|
|
}
|
|
|
|
.app-foreground-accent {
|
|
color: mat-color($theme-dark-accent) !important;
|
|
}
|
|
|
|
.app-foreground-warn {
|
|
color: mat-color($theme-dark-warn) !important;
|
|
}
|
|
|
|
.app-foreground-disabled {
|
|
color: mat-color(map-get($theme-dark, foreground), disabled-text) !important;
|
|
}
|
|
|
|
.app-layout {
|
|
@extend .mat-app-background;
|
|
|
|
.app-sidenav-container {
|
|
.app-sidenav:not(.mat-drawer-end) {
|
|
border-right-width: 0;
|
|
|
|
.app-header {
|
|
border-bottom-color: mat-color($mat-gray, 900);
|
|
}
|
|
|
|
.app-body {
|
|
.app-menu {
|
|
.app-menu-item {
|
|
|
|
&:hover,
|
|
&.focus {
|
|
background-color: rgba($color: mat-color($mat-gray, 700), $alpha: .3)
|
|
}
|
|
|
|
&>a {
|
|
color: mat-color($mat-gray, 400);
|
|
}
|
|
|
|
&.active>a {
|
|
color: mat-color($mat-blue, 200);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.app-sidenav-content {
|
|
.app-header {
|
|
border-bottom-color: mat-color($mat-gray, 900);
|
|
}
|
|
|
|
.app-body {
|
|
.ng-bar {
|
|
background-color: mat-color($theme-dark-primary);
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|