diff --git a/src/index.scss b/src/index.scss index f4be25a1..9bb67870 100644 --- a/src/index.scss +++ b/src/index.scss @@ -65,10 +65,16 @@ body, .page-link, .page-link:hover, .page-item.disabled .page-link, -.dropdown-divider { +.dropdown-divider{ border-color: var(--border-color); } +.table-bordered, +.table-bordered thead th, +.table-bordered thead td { + border-color: var(--table-border-color); +} + .page-link:hover { background-color: var(--secondary-color); } diff --git a/src/theme/theme.scss b/src/theme/theme.scss index 042de9c3..ba9c1e3c 100644 --- a/src/theme/theme.scss +++ b/src/theme/theme.scss @@ -6,6 +6,7 @@ $lightPrimaryColorAlfa: rgba($lightPrimaryColor, .5); $lightSecondaryColor: $lightColor; $lightTextColor: #212529; $lightBorderColor: rgba(0, 0, 0, .125); +$lightTableBorderColor: $mediumGrey; $lightActiveColor: $lightGrey; $lightBrandColor: $mainColor; $lightInputColor: $lightPrimaryColor; @@ -18,6 +19,7 @@ $darkPrimaryColorAlfa: rgba($darkPrimaryColor, .7); $darkSecondaryColor: #0f131a; $darkTextColor: rgb(201, 209, 217); $darkBorderColor: rgba(0, 0, 0, .2); +$darkTableBorderColor: #12161b; $darkActiveColor: $darkSecondaryColor; $darkBrandColor: #0b2d4e; $darkInputColor: darken($darkPrimaryColor, 2%); @@ -35,6 +37,7 @@ html:not([data-theme='dark']) { --input-color: #{$lightInputColor}; --input-disabled-color: #{$lightDisabledInputColor}; --input-border-color: #{$lightBorderInputColor}; + --table-border-color: #{$lightTableBorderColor}; } html[data-theme='dark'] { @@ -48,4 +51,5 @@ html[data-theme='dark'] { --input-color: #{$darkInputColor}; --input-disabled-color: #{$darkDisabledInputColor}; --input-border-color: #{$darkBorderInputColor}; + --table-border-color: #{$darkTableBorderColor}; } diff --git a/src/utils/DateInput.scss b/src/utils/DateInput.scss index 6e3eb439..c33e71de 100644 --- a/src/utils/DateInput.scss +++ b/src/utils/DateInput.scss @@ -13,7 +13,8 @@ background-color: var(--primary-color) !important; } -.card .date-input-container__input:not(:disabled) { +.card .date-input-container__input:not(:disabled), +.dropdown .date-input-container__input:not(:disabled) { background-color: var(--input-color) !important; } diff --git a/src/utils/mixins/sticky-cell.scss b/src/utils/mixins/sticky-cell.scss index a20f341f..0e2d6125 100644 --- a/src/utils/mixins/sticky-cell.scss +++ b/src/utils/mixins/sticky-cell.scss @@ -12,7 +12,7 @@ left: 0; bottom: -1px; right: -1px; - background: $mediumGrey; + background: var(--table-border-color); z-index: -2; } @@ -27,7 +27,7 @@ left: 1px; bottom: 0; right: 0; - background: white; + background: var(--primary-color); z-index: -1; }