Various dark theme fixes

pull/3325/head
Victor Baranov 4 years ago
parent 5821f3af37
commit 347e68f120
  1. 1
      CHANGELOG.md
  2. 2
      apps/block_scout_web/assets/css/components/_custom_tooltips.scss
  3. 4
      apps/block_scout_web/assets/css/components/_label.scss
  4. 2
      apps/block_scout_web/assets/css/components/_navbar.scss
  5. 54
      apps/block_scout_web/assets/css/theme/_dark-theme.scss

@ -30,6 +30,7 @@
- [#3256](https://github.com/poanetwork/blockscout/pull/3256) - Fix for invisible validator address at block page and wrong alert text color at xDai
### Chore
- [#3325](https://github.com/poanetwork/blockscout/pull/3325) - Dark theme improvements
- [#3316](https://github.com/poanetwork/blockscout/pull/3316), [#3317](https://github.com/poanetwork/blockscout/pull/3317) - xDai smile logo
- [#3315](https://github.com/poanetwork/blockscout/pull/3315) - Environment variable to disable Bridge market cap updater
- [#3308](https://github.com/poanetwork/blockscout/pull/3308) - Fixate latest stable release of Elixir, Node, Postgres

@ -13,7 +13,7 @@ $tooltip-background-color: $btn-line-color !default;
.tooltip-inversed-color {
.tooltip-inner {
background-color: #fff !important;
color: $btn-line-color !important;
color: #333 !important;
}
}

@ -10,10 +10,10 @@
}
&.omni {
background: $primary;
color: white;
color: #fff;
}
&.amb {
background: $secondary;
color: white;
color: #fff;
}
}

@ -152,7 +152,7 @@ $navbar-logo-width: auto !default;
}
@include media-breakpoint-up(xl) {
width: 310px;
width: 290px;
}
@media (min-width: 1366px) {
width: 380px;

@ -780,7 +780,59 @@ $labels-dark: #8a8dba; // header nav, labels
}
.logo-text {
color: white;
color: #fff;
}
.bridged-token-label.omni {
background-color: $labels-dark;
}
.dropdown-item {
.external-link-icon {
path {
fill: #fff;
}
}
& {
&.active,
&:hover,
&:focus {
.external-link-icon {
path {
fill: #fff;
}
}
}
}
}
.tooltip-inversed-color {
.tooltip-inner {
background-color: $btn-line-color !important;
color: #fff !important;
}
}
.tooltip-inversed-color.bs-tooltip-top .arrow::before,
.tooltip-inversed-color.bs-tooltip-auto[x-placement^="top"] .arrow::before {
border-top-color: $btn-line-color !important;
}
.tooltip-inversed-color.bs-tooltip-right .arrow::before,
.tooltip-inversed-color.bs-tooltip-auto[x-placement^="right"] .arrow::before {
border-right-color: $btn-line-color !important;
}
.tooltip-inversed-color.bs-tooltip-bottom .arrow::before,
.tooltip-inversed-color.bs-tooltip-auto[x-placement^="bottom"] .arrow::before {
border-bottom-color: $btn-line-color !important;
}
.tooltip-inversed-color.bs-tooltip-left .arrow::before,
.tooltip-inversed-color.bs-tooltip-auto[x-placement^="left"] .arrow::before {
border-left-color: $btn-line-color !important;
}
}

Loading…
Cancel
Save