Update material styles

This commit is contained in:
eugene-sinitsyn 2020-03-09 15:38:42 +03:00 committed by Sergey Andrievskiy
parent fea2da6df7
commit ec2e808cb5
4 changed files with 44 additions and 20 deletions

View file

@ -99,9 +99,9 @@ $theme: (
color-basic-400: #d4d4d4,
color-basic-500: #b3b3b3,
color-basic-600: #808080,
color-basic-700: #4a4a4a,
color-basic-800: #383838,
color-basic-900: #292929,
color-basic-700: #404040,
color-basic-800: #353535,
color-basic-900: #303030,
color-basic-1000: #1f1f1f,
color-basic-1100: #141414,
@ -273,9 +273,9 @@ $theme: (
color-control-transparent-active-border: color-basic-100,
color-control-transparent-disabled-border: color-basic-transparent-300,
background-basic-color-1: color-basic-800,
background-basic-color-2: color-basic-900,
background-basic-color-3: color-basic-800,
background-basic-color-1: color-basic-1000,
background-basic-color-2: color-basic-1000,
background-basic-color-3: color-basic-900,
background-basic-color-4: color-basic-1100,
background-alternative-color-1: color-basic-100,
@ -361,12 +361,19 @@ $theme: (
text-danger-active-color: color-danger-active,
text-danger-disabled-color: color-danger-400,
shadow: unquote('0 2px 10px rgba(0, 0, 0, 0.24), 0 0 20px rgba(0, 0, 0, 0.12)'),
font-family-primary: unquote('Roboto, sans-serif'),
shadow: unquote('0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12)'),
card-shadow: shadow,
header-shadow: unquote(
'0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12)'
),
font-family-primary: unquote('Roboto, sans-serif'),
header-background-color: color-primary-default,
footer-background-color: color-primary-default,
footer-text-color: text-basic-color,
footer-text-highlight-color: footer-text-color,
sidebar-background-color: background-basic-color-2,
menu-text-font-weight: 400,
menu-text-color: rgba(255, 255, 255, 0.7),
@ -379,7 +386,12 @@ $theme: (
menu-submenu-item-hover-background-color: rgba(255, 255, 255, 0.04),
menu-submenu-item-active-hover-background-color: rgba(255, 255, 255, 0.1),
menu-submenu-item-active-background-color: rgba(0, 0, 0, 0.25)
menu-submenu-item-active-background-color: rgba(0, 0, 0, 0.25),
card-border-style: none,
card-background-color: color-basic-800,
card-divider-color: color-basic-700,
card-border-radius: .25rem .25rem .125rem .125rem
);
$nb-themes: nb-register-theme($theme, material-dark, dark);

View file

@ -361,12 +361,19 @@ $theme: (
text-danger-active-color: color-danger-active,
text-danger-disabled-color: color-danger-400,
shadow: unquote('0 2px 10px rgba(0, 0, 0, 0.12), 0 0 20px rgba(0, 0, 0, 0.06)'),
font-family-primary: unquote('Roboto, sans-serif'),
shadow: unquote('0 2px 1px -1px rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 1px 3px 0 rgba(0,0,0,.12)'),
card-shadow: shadow,
header-shadow: unquote(
'0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12)'
'0 3px 5px -1px rgba(0,0,0,.2), 0 6px 10px 0 rgba(0,0,0,.14), 0 1px 18px 0 rgba(0,0,0,.12)'
),
font-family-primary: unquote('Roboto, sans-serif'),
header-background-color: color-primary-default,
footer-background-color: color-primary-default,
footer-text-color: text-alternate-color,
footer-text-highlight-color: footer-text-color,
sidebar-background-color: background-basic-color-2,
menu-text-font-weight: 400,
menu-text-color: rgba(0, 0, 0, 0.87),
@ -379,7 +386,11 @@ $theme: (
menu-submenu-item-hover-background-color: rgba(0, 0, 0, 0.04),
menu-submenu-item-active-hover-background-color: rgba(0, 0, 0, 0.1),
menu-submenu-item-active-background-color: rgba(0, 0, 0, 0.08)
menu-submenu-item-active-background-color: rgba(0, 0, 0, 0.08),
card-border-style: none,
card-divider-color: color-basic-200,
card-border-radius: .25rem .25rem .125rem .125rem
);
$nb-themes: nb-register-theme($theme, material-light, default);

View file

@ -15,9 +15,6 @@
@include mat-core();
nb-layout-header {
box-shadow: nb-theme(header-shadow) !important;
background-color: nb-theme(color-primary-default) !important;
.logo-container, nb-action {
a, nb-icon, .user-name {
color: nb-theme(text-control-color) !important;
@ -26,7 +23,6 @@
}
nb-sidebar {
background-color: nb-theme(background-basic-color-2) !important;
transition: width 0.3s;
.main-container {
@ -34,9 +30,10 @@
}
}
nb-card, nb-reveal-card {
border: none !important;
box-shadow: nb-theme(shadow) !important;
nb-card {
nb-card-header, .tabset {
background-color: nb-theme(card-divider-color);
}
}
}
}

View file

@ -6,6 +6,10 @@ $legend-canceled-color: #3f4fda;
@include nb-install-component() {
nb-card {
overflow: hidden;
}
nb-tabset {
display: flex;
flex-direction: column;