fix(theme): More CSS variables for themes

Add CSS variables for header cell background and toast message border for more flexible themeing
This commit is contained in:
Faris Ansari 2018-07-08 23:17:11 +05:30
parent 1b5292a7f0
commit 78666f8ab2
2 changed files with 13 additions and 12 deletions

View File

@ -1,17 +1,11 @@
.datatable {
--border-color: #424242;
--light-bg: #2e3538;
--text-color: #dfe2e5;
--text-light: #dfe2e5;
--border-color: #424242;
--light-bg: #2e3538;
--text-color: #dfe2e5;
--text-light: #dfe2e5;
--cell-bg: #1c1f20;
--focus-border-width: 1px;
--selection-highlight-color: var(--light-bg);
--toast-message-border: 1px solid var(--border-color);
--header-cell-bg: #262c2e;
}
.dt-header .dt-cell:not(.dt-cell--highlight) {
background-color: #262c2e;
}
.dt-toast__message {
border: 1px solid var(--border-color);
}

View File

@ -17,6 +17,8 @@
--cell-bg: #fff;
--focus-border-width: 2px;
--selection-highlight-color: var(--light-yellow);
--toast-message-border: none;
--header-cell-bg: var(--cell-bg);
}
.datatable {
@ -132,6 +134,10 @@
background-color: var(--light-bg);
}
&--header {
background-color: var(--header-cell-bg);
}
&--header &__content {
padding-right: var(--spacer-3);
font-weight: bold;
@ -217,6 +223,7 @@
color: var(--text-light);
border-radius: var(--border-radius);
padding: var(--spacer-2) var(--spacer-3);
border: var(--toast-message-border);
}
}