fix: admin rendering UI + dark mode

This commit is contained in:
Nick
2019-08-04 23:53:21 -04:00
parent 0f9ddf1e5d
commit c4629419d3
35 changed files with 232 additions and 198 deletions

View File

@@ -19,59 +19,60 @@ html {
}
}
.application--wrap {
.v-application--wrap {
transition: all 1.2s ease;
transform-origin: 50% 50%;
background-color: #FFF;
// background-color: #FFF;
@at-root .theme--dark & {
background-color: mc('grey', '900');
}
}
.v-application {
@for $i from 0 through 25 {
.radius-#{$i} {
border-radius: #{$i}px;
}
}
@for $i from 0 through 25 {
.radius-#{$i} {
border-radius: #{$i}px;
@for $i from 1 through 5 {
.grey.darken-2-d#{$i} {
background-color: darken(mc('grey', '700'), percentage($i/100)) !important;
border-color: darken(mc('grey', '700'), percentage($i/100)) !important;
}
.grey.darken-2-l#{$i} {
background-color: lighten(mc('grey', '700'), percentage($i/100)) !important;
border-color: lighten(mc('grey', '700'), percentage($i/100)) !important;
}
.grey.darken-3-d#{$i} {
background-color: darken(mc('grey', '800'), percentage($i/100)) !important;
border-color: darken(mc('grey', '800'), percentage($i/100)) !important;
}
.grey.darken-3-l#{$i} {
background-color: lighten(mc('grey', '800'), percentage($i/100)) !important;
border-color: lighten(mc('grey', '800'), percentage($i/100)) !important;
}
.grey.darken-4-d#{$i} {
background-color: darken(mc('grey', '900'), percentage($i/100)) !important;
border-color: darken(mc('grey', '900'), percentage($i/100)) !important;
}
.grey.darken-4-l#{$i} {
background-color: lighten(mc('grey', '900'), percentage($i/100)) !important;
border-color: lighten(mc('grey', '900'), percentage($i/100)) !important;
}
}
.grey.darken-5 {
background-color: #0C0C0C !important;
border-color: #0C0C0C !important;
}
}
@for $i from 1 through 5 {
.grey.darken-2-d#{$i} {
background-color: darken(mc('grey', '700'), percentage($i/100)) !important;
border-color: darken(mc('grey', '700'), percentage($i/100)) !important;
.blue.darken-5 {
background-color: darken(mc('blue', '900'), 20%) !important;
border-color: darken(mc('blue', '900'), 20%) !important;
}
.grey.darken-2-l#{$i} {
background-color: lighten(mc('grey', '700'), percentage($i/100)) !important;
border-color: lighten(mc('grey', '700'), percentage($i/100)) !important;
}
.grey.darken-3-d#{$i} {
background-color: darken(mc('grey', '800'), percentage($i/100)) !important;
border-color: darken(mc('grey', '800'), percentage($i/100)) !important;
}
.grey.darken-3-l#{$i} {
background-color: lighten(mc('grey', '800'), percentage($i/100)) !important;
border-color: lighten(mc('grey', '800'), percentage($i/100)) !important;
}
.grey.darken-4-d#{$i} {
background-color: darken(mc('grey', '900'), percentage($i/100)) !important;
border-color: darken(mc('grey', '900'), percentage($i/100)) !important;
}
.grey.darken-4-l#{$i} {
background-color: lighten(mc('grey', '900'), percentage($i/100)) !important;
border-color: lighten(mc('grey', '900'), percentage($i/100)) !important;
.indigo.darken-5 {
background-color: darken(mc('indigo', '900'), 10%) !important;
border-color: darken(mc('indigo', '900'), 10%) !important;
}
}
.grey.darken-5 {
background-color: #0C0C0C !important;
border-color: #0C0C0C !important;
}
.blue.darken-5 {
background-color: darken(mc('blue', '900'), 20%) !important;
border-color: darken(mc('blue', '900'), 20%) !important;
}
.indigo.darken-5 {
background-color: darken(mc('indigo', '900'), 10%) !important;
border-color: darken(mc('indigo', '900'), 10%) !important;
}