OpenServer/Theme
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Adding prefixed style output

Browse Source
This commit is contained in:
Fabian Stamm 2020-03-27 10:43:53 +01:00
parent 4864abab1c
commit 2835b1bac9
23 changed files with 155 additions and 156 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@hibas123/theme", "name": "@hibas123/theme",
"version": "1.2.19", "version": "2.0.0",
"description": "", "description": "",
"main": " ", "main": " ",
"files": [ "files": [
@ -11,8 +11,13 @@
"Roboto-Regular.woff2" "Roboto-Regular.woff2"
], ],
"scripts": { "scripts": {
"build": "sass src/base.scss:out/base.css src/dark.scss:out/dark.css src/light.scss:out/light.css", "build-grid": "sass src/grid.scss:out/grid.css",
"watch": "sass --watch src/base.scss:out/base.css src/dark.scss:out/dark.css src/light.scss:out/light.css", "watch-grid": "sass --watch src/grid.scss:out/grid.css",
"build-clean": "sass src/base.scss:out/base.css src/dark.scss:out/dark.css src/light.scss:out/light.css ",
"watch-clean": "sass --watch src/base.scss:out/base.css src/dark.scss:out/dark.css src/light.scss:out/light.css",
"build-prefix": "sass src/base-ht.scss:out/base-ht.css src/dark-ht.scss:out/dark-ht.css src/light-ht.scss:out/light-ht.css",
"watch-prefix": "sass --watch src/base-ht.scss:out/base-ht.css src/dark-ht.scss:out/dark-ht.css src/light-ht.scss:out/light-ht.css",
"build": "npm run build-clean && npm run build-prefix && npm run build-grid",
"prepublishOnly": "npm run build" "prepublishOnly": "npm run build"
}, },
"author": "Fabian Stamm <dev@fabianstamm.de>", "author": "Fabian Stamm <dev@fabianstamm.de>",

2
src/_maketheme.scss
View File

@ -1,5 +1,7 @@
@import "./_vals.scss"; @import "./_vals.scss";
$ns: "" !default;
$background: false !default; $background: false !default;
$on-background: false !default; $on-background: false !default;
$button-color: #cccccc !default; $button-color: #cccccc !default;

11
src/_vals.scss
View File

@ -1,10 +1 @@
$elevations: 1, $elevations: 1, 2, 3, 4, 6, 8, 9, 12, 16, 24;
2,
3,
4,
6,
8,
9,
12,
16,
24;

3
src/base-ht.scss Normal file
View File

@ -0,0 +1,3 @@
$ns: "ht-";
@import "./base.scss";

3
src/base.scss
View File

@ -1,3 +1,5 @@
$ns: "" !default;
/* latin */ /* latin */
@font-face { @font-face {
font-family: "Roboto"; font-family: "Roboto";
@ -45,6 +47,5 @@ $on-success: var(--on-success) !default;
@import "./base/_list.scss"; @import "./base/_list.scss";
@import "./base/_header.scss"; @import "./base/_header.scss";
@import "./base/_card.scss"; @import "./base/_card.scss";
@import "./base/_grid.scss";
@import "./base/_table.scss"; @import "./base/_table.scss";
@import "./base/_scroll"; @import "./base/_scroll";

18
src/base/_btn.scss
View File

@ -13,11 +13,11 @@
outline: none; outline: none;
} }
.btn-flat { .#{$ns}btn-flat {
@include btn-flat(); @include btn-flat();
} }
.btn { .#{$ns}btn {
@include btn-flat(); @include btn-flat();
} }
@ -34,23 +34,23 @@
} }
} }
.btn-primary { .#{$ns}btn-primary {
@include btn-color($primary, $on-primary); @include btn-color($primary, $on-primary);
} }
.btn-secondary { .#{$ns}btn-secondary {
@include btn-color($secondary, $on-secondary); @include btn-color($secondary, $on-secondary);
} }
.btn-success { .#{$ns}btn-success {
@include btn-color($success, $on-success); @include btn-color($success, $on-success);
} }
.btn-error { .#{$ns}btn-error {
@include btn-color($error, $on-error); @include btn-color($error, $on-error);
} }
.btn-icon { .#{$ns}btn-icon {
background-color: unset !important; background-color: unset !important;
border: 0 !important; border: 0 !important;
box-shadow: unset !important; box-shadow: unset !important;
@ -61,7 +61,7 @@
} }
} }
.fab { .#{$ns}fab {
border-radius: 50%; border-radius: 50%;
width: 3.5rem; width: 3.5rem;
height: 3.5rem; height: 3.5rem;
@ -81,7 +81,7 @@
border: none; border: none;
} }
.fab-left { .#{$ns}fab-left {
right: unset; right: unset;
left: 1.5rem; left: 1.5rem;
} }

4
src/base/_card.scss
View File

@ -1,3 +1,3 @@
.card { .#{$ns}card {
padding: 1rem; padding: 1rem;
} }

12
src/base/_global.scss
View File

@ -8,14 +8,14 @@ body {
min-height: 100vh; min-height: 100vh;
min-width: 100%; min-width: 100%;
font-size: 1rem; font-size: 1rem;
font-family: 'Roboto', sans-serif; font-family: "Roboto", sans-serif;
} }
.margin { .#{$ns}margin {
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
} }
.container { .#{$ns}container {
box-sizing: content-box; box-sizing: content-box;
padding-left: 1rem; padding-left: 1rem;
padding-right: 1rem; padding-right: 1rem;
@ -36,13 +36,13 @@ h3 {
} }
h5 { h5 {
font-size: .83rem; font-size: 0.83rem;
} }
h6 { h6 {
font-size: .67rem; font-size: 0.67rem;
} }
hr { hr {
border-top: 1px solid rgb(128, 128, 128); border-top: 1px solid rgb(128, 128, 128);
} }

16
src/base/_header.scss
View File

@ -2,7 +2,7 @@
--header-height: 4rem; --header-height: 4rem;
} }
.header { .#{$ns}header {
background: $primary !important; background: $primary !important;
color: $on-primary !important; color: $on-primary !important;
@ -10,21 +10,21 @@
// justify-content: space-between; // justify-content: space-between;
padding: 1rem; padding: 1rem;
>* { > * {
max-height: 2rem; max-height: 2rem;
margin: 0; margin: 0;
background: $primary; background: $primary;
color: $on-primary; color: $on-primary;
} }
>*:not(:last-child) { > *:not(:last-child) {
margin-right: 1rem; margin-right: 1rem;
} }
span { span {
line-height: 1.5rem; line-height: 1.5rem;
font-size: 1.5rem; font-size: 1.5rem;
padding: .25rem; padding: 0.25rem;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
@ -34,19 +34,19 @@
width: auto; width: auto;
} }
>a { > a {
font-size: 1rem; font-size: 1rem;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
padding: .5rem; padding: 0.5rem;
text-decoration: none; text-decoration: none;
&:hover { &:hover {
filter: brightness(.95); filter: brightness(0.95);
} }
&:active { &:active {
filter: brightness(1.05); filter: brightness(1.05);
} }
} }
} }

14
src/base/_input.scss
View File

@ -1,4 +1,4 @@
.inp { .#{$ns}inp {
background: unset; background: unset;
border: 1px grey solid; border: 1px grey solid;
padding: 0 0.5rem; padding: 0 0.5rem;
@ -13,19 +13,19 @@
} }
} }
textarea.inp { textarea.#{$ns}inp {
height: unset; height: unset;
min-height: 6rem !important; min-height: 6rem !important;
font-size: 1.1rem; font-size: 1.1rem;
} }
.input-group { .#{$ns}input-group {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@extend .margin; @extend .#{$ns}margin;
input { input {
@extend .inp; @extend .#{$ns}inp;
} }
label { label {
@ -35,8 +35,8 @@ textarea.inp {
} }
} }
.input-checkbox { .#{$ns}input-checkbox {
@extend .margin; @extend .#{$ns}margin;
display: block; display: block;
position: relative; position: relative;

10
src/base/_list.scss
View File

@ -1,14 +1,14 @@
.list { .#{$ns}list {
padding: 0; padding: 0;
list-style: none; list-style: none;
li { li {
padding: .5rem; padding: 0.5rem;
} }
} }
.list-divider { .#{$ns}list-divider {
li:nth-child(n+2) { li:nth-child(n + 2) {
border-top: 1px solid rgb(128, 128, 128); border-top: 1px solid rgb(128, 128, 128);
} }
} }

20
src/base/_modal.scss
View File

@ -1,4 +1,4 @@
.modal { .#{$ns}modal {
padding: 1rem; padding: 1rem;
margin: auto; margin: auto;
@ -14,20 +14,20 @@
top: 50%; top: 50%;
left: 50%; left: 50%;
.modal-title { .#{$ns}modal-title {
font-weight: 600; font-weight: 600;
font-size: 1.2rem; font-size: 1.2rem;
margin-bottom: .5rem; margin-bottom: 0.5rem;
} }
.modal-content { .#{$ns}modal-content {
overflow-y: auto; overflow-y: auto;
max-height: calc(100vh - 10rem); max-height: calc(100vh - 10rem);
// margin: auto; // margin: auto;
} }
.modal-action { .#{$ns}modal-action {
margin-top: .5rem; margin-top: 0.5rem;
display: flex; display: flex;
:first-child { :first-child {
@ -35,12 +35,12 @@
} }
button { button {
@extend .btn; @extend .#{$ns}btn;
} }
} }
transform-origin: center; transform-origin: center;
animation: growModalBox .2s linear; animation: growModalBox 0.2s linear;
} }
@keyframes growModalBox { @keyframes growModalBox {
@ -53,6 +53,6 @@
} }
} }
.modal-hidden { .#{$ns}modal-hidden {
display: none; display: none;
} }

27
src/base/_table.scss
View File

@ -1,16 +1,15 @@
.table { .#{$ns}table {
border-collapse: collapse;
width: 100%;
border-collapse: collapse; th,
width: 100%; td {
text-align: left;
padding: 8px;
}
th, tr:first-child {
td { background-color: $primary;
text-align: left; color: var(--on-primary);
padding: 8px; }
} }
tr:first-child {
background-color: $primary;
color: var(--on-primary);
}
}

3
src/dark-ht.scss Normal file
View File

@ -0,0 +1,3 @@
$ns: "ht-";
@import "./dark.scss";

106
src/base/_grid.scss → src/grid.scss
View File

@ -1,9 +1,3 @@
// .container {
// margin: 0 auto;
// padding: 0 calc(1.5 * 1rem);
// }
.row { .row {
box-sizing: border-box; box-sizing: border-box;
display: flex; display: flex;
@ -12,23 +6,23 @@
} }
.col-sm, .col-sm,
[class^='col-sm-'], [class^="col-sm-"],
[class^='col-sm-offset-'], [class^="col-sm-offset-"],
.row[class*='cols-sm-']>* { .row[class*="cols-sm-"] > * {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto; flex: 0 0 auto;
padding: 0 calc(var(--universal-padding) / 2); padding: 0 calc(var(--universal-padding) / 2);
} }
.col-sm, .col-sm,
.row.cols-sm>* { .row.cols-sm > * {
max-width: 100%; max-width: 100%;
flex-grow: 1; flex-grow: 1;
flex-basis: 0; flex-basis: 0;
} }
.col-sm-1, .col-sm-1,
.row.cols-sm-1>* { .row.cols-sm-1 > * {
max-width: 8.33333%; max-width: 8.33333%;
flex-basis: 8.33333%; flex-basis: 8.33333%;
} }
@ -38,7 +32,7 @@
} }
.col-sm-2, .col-sm-2,
.row.cols-sm-2>* { .row.cols-sm-2 > * {
max-width: 16.66667%; max-width: 16.66667%;
flex-basis: 16.66667%; flex-basis: 16.66667%;
} }
@ -48,7 +42,7 @@
} }
.col-sm-3, .col-sm-3,
.row.cols-sm-3>* { .row.cols-sm-3 > * {
max-width: 25%; max-width: 25%;
flex-basis: 25%; flex-basis: 25%;
} }
@ -58,7 +52,7 @@
} }
.col-sm-4, .col-sm-4,
.row.cols-sm-4>* { .row.cols-sm-4 > * {
max-width: 33.33333%; max-width: 33.33333%;
flex-basis: 33.33333%; flex-basis: 33.33333%;
} }
@ -68,7 +62,7 @@
} }
.col-sm-5, .col-sm-5,
.row.cols-sm-5>* { .row.cols-sm-5 > * {
max-width: 41.66667%; max-width: 41.66667%;
flex-basis: 41.66667%; flex-basis: 41.66667%;
} }
@ -78,7 +72,7 @@
} }
.col-sm-6, .col-sm-6,
.row.cols-sm-6>* { .row.cols-sm-6 > * {
max-width: 50%; max-width: 50%;
flex-basis: 50%; flex-basis: 50%;
} }
@ -88,7 +82,7 @@
} }
.col-sm-7, .col-sm-7,
.row.cols-sm-7>* { .row.cols-sm-7 > * {
max-width: 58.33333%; max-width: 58.33333%;
flex-basis: 58.33333%; flex-basis: 58.33333%;
} }
@ -98,7 +92,7 @@
} }
.col-sm-8, .col-sm-8,
.row.cols-sm-8>* { .row.cols-sm-8 > * {
max-width: 66.66667%; max-width: 66.66667%;
flex-basis: 66.66667%; flex-basis: 66.66667%;
} }
@ -108,7 +102,7 @@
} }
.col-sm-9, .col-sm-9,
.row.cols-sm-9>* { .row.cols-sm-9 > * {
max-width: 75%; max-width: 75%;
flex-basis: 75%; flex-basis: 75%;
} }
@ -118,7 +112,7 @@
} }
.col-sm-10, .col-sm-10,
.row.cols-sm-10>* { .row.cols-sm-10 > * {
max-width: 83.33333%; max-width: 83.33333%;
flex-basis: 83.33333%; flex-basis: 83.33333%;
} }
@ -128,7 +122,7 @@
} }
.col-sm-11, .col-sm-11,
.row.cols-sm-11>* { .row.cols-sm-11 > * {
max-width: 91.66667%; max-width: 91.66667%;
flex-basis: 91.66667%; flex-basis: 91.66667%;
} }
@ -138,7 +132,7 @@
} }
.col-sm-12, .col-sm-12,
.row.cols-sm-12>* { .row.cols-sm-12 > * {
max-width: 100%; max-width: 100%;
flex-basis: 100%; flex-basis: 100%;
} }
@ -160,25 +154,24 @@
} }
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.col-md, .col-md,
[class^='col-md-'], [class^="col-md-"],
[class^='col-md-offset-'], [class^="col-md-offset-"],
.row[class*='cols-md-']>* { .row[class*="cols-md-"] > * {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto; flex: 0 0 auto;
padding: 0 calc(var(--universal-padding) / 2); padding: 0 calc(var(--universal-padding) / 2);
} }
.col-md, .col-md,
.row.cols-md>* { .row.cols-md > * {
max-width: 100%; max-width: 100%;
flex-grow: 1; flex-grow: 1;
flex-basis: 0; flex-basis: 0;
} }
.col-md-1, .col-md-1,
.row.cols-md-1>* { .row.cols-md-1 > * {
max-width: 8.33333%; max-width: 8.33333%;
flex-basis: 8.33333%; flex-basis: 8.33333%;
} }
@ -188,7 +181,7 @@
} }
.col-md-2, .col-md-2,
.row.cols-md-2>* { .row.cols-md-2 > * {
max-width: 16.66667%; max-width: 16.66667%;
flex-basis: 16.66667%; flex-basis: 16.66667%;
} }
@ -198,7 +191,7 @@
} }
.col-md-3, .col-md-3,
.row.cols-md-3>* { .row.cols-md-3 > * {
max-width: 25%; max-width: 25%;
flex-basis: 25%; flex-basis: 25%;
} }
@ -208,7 +201,7 @@
} }
.col-md-4, .col-md-4,
.row.cols-md-4>* { .row.cols-md-4 > * {
max-width: 33.33333%; max-width: 33.33333%;
flex-basis: 33.33333%; flex-basis: 33.33333%;
} }
@ -218,7 +211,7 @@
} }
.col-md-5, .col-md-5,
.row.cols-md-5>* { .row.cols-md-5 > * {
max-width: 41.66667%; max-width: 41.66667%;
flex-basis: 41.66667%; flex-basis: 41.66667%;
} }
@ -228,7 +221,7 @@
} }
.col-md-6, .col-md-6,
.row.cols-md-6>* { .row.cols-md-6 > * {
max-width: 50%; max-width: 50%;
flex-basis: 50%; flex-basis: 50%;
} }
@ -238,7 +231,7 @@
} }
.col-md-7, .col-md-7,
.row.cols-md-7>* { .row.cols-md-7 > * {
max-width: 58.33333%; max-width: 58.33333%;
flex-basis: 58.33333%; flex-basis: 58.33333%;
} }
@ -248,7 +241,7 @@
} }
.col-md-8, .col-md-8,
.row.cols-md-8>* { .row.cols-md-8 > * {
max-width: 66.66667%; max-width: 66.66667%;
flex-basis: 66.66667%; flex-basis: 66.66667%;
} }
@ -258,7 +251,7 @@
} }
.col-md-9, .col-md-9,
.row.cols-md-9>* { .row.cols-md-9 > * {
max-width: 75%; max-width: 75%;
flex-basis: 75%; flex-basis: 75%;
} }
@ -268,7 +261,7 @@
} }
.col-md-10, .col-md-10,
.row.cols-md-10>* { .row.cols-md-10 > * {
max-width: 83.33333%; max-width: 83.33333%;
flex-basis: 83.33333%; flex-basis: 83.33333%;
} }
@ -278,7 +271,7 @@
} }
.col-md-11, .col-md-11,
.row.cols-md-11>* { .row.cols-md-11 > * {
max-width: 91.66667%; max-width: 91.66667%;
flex-basis: 91.66667%; flex-basis: 91.66667%;
} }
@ -288,7 +281,7 @@
} }
.col-md-12, .col-md-12,
.row.cols-md-12>* { .row.cols-md-12 > * {
max-width: 100%; max-width: 100%;
flex-basis: 100%; flex-basis: 100%;
} }
@ -311,25 +304,24 @@
} }
@media screen and (min-width: 1280px) { @media screen and (min-width: 1280px) {
.col-lg, .col-lg,
[class^='col-lg-'], [class^="col-lg-"],
[class^='col-lg-offset-'], [class^="col-lg-offset-"],
.row[class*='cols-lg-']>* { .row[class*="cols-lg-"] > * {
box-sizing: border-box; box-sizing: border-box;
flex: 0 0 auto; flex: 0 0 auto;
padding: 0 calc(var(1rem) / 2); padding: 0 calc(var(1rem) / 2);
} }
.col-lg, .col-lg,
.row.cols-lg>* { .row.cols-lg > * {
max-width: 100%; max-width: 100%;
flex-grow: 1; flex-grow: 1;
flex-basis: 0; flex-basis: 0;
} }
.col-lg-1, .col-lg-1,
.row.cols-lg-1>* { .row.cols-lg-1 > * {
max-width: 8.33333%; max-width: 8.33333%;
flex-basis: 8.33333%; flex-basis: 8.33333%;
} }
@ -339,7 +331,7 @@
} }
.col-lg-2, .col-lg-2,
.row.cols-lg-2>* { .row.cols-lg-2 > * {
max-width: 16.66667%; max-width: 16.66667%;
flex-basis: 16.66667%; flex-basis: 16.66667%;
} }
@ -349,7 +341,7 @@
} }
.col-lg-3, .col-lg-3,
.row.cols-lg-3>* { .row.cols-lg-3 > * {
max-width: 25%; max-width: 25%;
flex-basis: 25%; flex-basis: 25%;
} }
@ -359,7 +351,7 @@
} }
.col-lg-4, .col-lg-4,
.row.cols-lg-4>* { .row.cols-lg-4 > * {
max-width: 33.33333%; max-width: 33.33333%;
flex-basis: 33.33333%; flex-basis: 33.33333%;
} }
@ -369,7 +361,7 @@
} }
.col-lg-5, .col-lg-5,
.row.cols-lg-5>* { .row.cols-lg-5 > * {
max-width: 41.66667%; max-width: 41.66667%;
flex-basis: 41.66667%; flex-basis: 41.66667%;
} }
@ -379,7 +371,7 @@
} }
.col-lg-6, .col-lg-6,
.row.cols-lg-6>* { .row.cols-lg-6 > * {
max-width: 50%; max-width: 50%;
flex-basis: 50%; flex-basis: 50%;
} }
@ -389,7 +381,7 @@
} }
.col-lg-7, .col-lg-7,
.row.cols-lg-7>* { .row.cols-lg-7 > * {
max-width: 58.33333%; max-width: 58.33333%;
flex-basis: 58.33333%; flex-basis: 58.33333%;
} }
@ -399,7 +391,7 @@
} }
.col-lg-8, .col-lg-8,
.row.cols-lg-8>* { .row.cols-lg-8 > * {
max-width: 66.66667%; max-width: 66.66667%;
flex-basis: 66.66667%; flex-basis: 66.66667%;
} }
@ -409,7 +401,7 @@
} }
.col-lg-9, .col-lg-9,
.row.cols-lg-9>* { .row.cols-lg-9 > * {
max-width: 75%; max-width: 75%;
flex-basis: 75%; flex-basis: 75%;
} }
@ -419,7 +411,7 @@
} }
.col-lg-10, .col-lg-10,
.row.cols-lg-10>* { .row.cols-lg-10 > * {
max-width: 83.33333%; max-width: 83.33333%;
flex-basis: 83.33333%; flex-basis: 83.33333%;
} }
@ -429,7 +421,7 @@
} }
.col-lg-11, .col-lg-11,
.row.cols-lg-11>* { .row.cols-lg-11 > * {
max-width: 91.66667%; max-width: 91.66667%;
flex-basis: 91.66667%; flex-basis: 91.66667%;
} }
@ -439,7 +431,7 @@
} }
.col-lg-12, .col-lg-12,
.row.cols-lg-12>* { .row.cols-lg-12 > * {
max-width: 100%; max-width: 100%;
flex-basis: 100%; flex-basis: 100%;
} }
@ -459,4 +451,4 @@
.col-lg-last { .col-lg-last {
order: 999; order: 999;
} }
} }

3
src/light-ht.scss Normal file
View File

@ -0,0 +1,3 @@
$ns: "ht-";
@import "./light.scss";

4
src/theme/_btn.scss
View File

@ -17,7 +17,7 @@
@include btn-flat(); @include btn-flat();
} }
.btn { .#{$ns}btn {
@include Elevation(1); @include Elevation(1);
@include ElevationTransition(0.2s); @include ElevationTransition(0.2s);
&:focus { &:focus {
@ -26,7 +26,7 @@
@include btn-flat(); @include btn-flat();
} }
.fab { .#{$ns}fab {
@include Elevation(8); @include Elevation(8);
@include ElevationTransition(0.2s); @include ElevationTransition(0.2s);
&:focus { &:focus {

6
src/theme/_card.scss
View File

@ -1,7 +1,7 @@
.card { .#{$ns}card {
@include Elevation(3); @include Elevation(3);
} }
.card-elevated { .#{$ns}card-elevated {
@include Elevation(8); @include Elevation(8);
} }

4
src/theme/_header.scss
View File

@ -1,3 +1,3 @@
.header { .#{$ns}header {
@include Elevation(3); @include Elevation(3);
} }

10
src/theme/_input.scss
View File

@ -1,4 +1,4 @@
.inp { .#{$ns}inp {
color: $on-background; color: $on-background;
option { option {
@ -7,14 +7,14 @@
} }
} }
.input-group { .#{$ns}input-group {
input { input {
@extend .inp; @extend .#{$ns}inp;
} }
} }
.input-checkbox { .#{$ns}input-checkbox {
span { span {
background-color: $button-color; background-color: $button-color;
} }
} }

6
src/theme/_list.scss
View File

@ -1,9 +1,9 @@
.list-clickable { .#{$ns}list-clickable {
li:hover { li:hover {
background: darken-brighten-color($background, 5%); background: darken-brighten-color($background, 5%);
} }
} }
.list-selected { .#{$ns}list-selected {
background: darken-brighten-color($background, 10%); background: darken-brighten-color($background, 10%);
} }

8
src/theme/_modal.scss
View File

@ -1,10 +1,10 @@
.modal { .#{$ns}modal {
background: $background; background: $background;
@include Elevation(24); @include Elevation(24);
.modal-action { .#{$ns}modal-action {
button { button {
@extend .btn; @extend .#{$ns}btn;
} }
} }
} }

10
src/theme/_table.scss
View File

@ -1,5 +1,5 @@
.table { .#{$ns}table {
tr:nth-child(odd):not(:first-child) { tr:nth-child(odd):not(:first-child) {
background: darken-brighten-color($background, 10%) background: darken-brighten-color($background, 10%);
} }
} }