diff --git a/CHANGELOG.md b/CHANGELOG.md
index f76f2ba33f..74347d4e75 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -6,6 +6,7 @@
- [#2456](https://github.com/poanetwork/blockscout/pull/2456) - fetch pending transactions for geth
### Fixes
+- [#2463](https://github.com/poanetwork/blockscout/pull/2463) - dark theme fixes
- [#2496](https://github.com/poanetwork/blockscout/pull/2496) - fix docker build
- [#2495](https://github.com/poanetwork/blockscout/pull/2495) - fix logs for indexed chain
- [#2459](https://github.com/poanetwork/blockscout/pull/2459) - fix top addresses query
diff --git a/apps/block_scout_web/assets/css/theme/_dark-theme.scss b/apps/block_scout_web/assets/css/theme/_dark-theme.scss
index e648e01982..c0adb0a84b 100644
--- a/apps/block_scout_web/assets/css/theme/_dark-theme.scss
+++ b/apps/block_scout_web/assets/css/theme/_dark-theme.scss
@@ -464,7 +464,220 @@ $labels-dark: #8a8dba; // header nav, labels
// dark text
.text-dark {
+ color: #fff !important;
+ }
+
+ // Contract Verification
+ .new-smart-contract-container {
+ background-color: $dark-light-bg;
+ background-image: linear-gradient(to bottom right, $dark-light 100%, $dark-light 100%);
+ @media (max-width: 991.98px) {
+ background-image: none;
+ }
+ }
+ .smart-contract-form-group-inner-wrapper .smart-contract-form-group-tooltip {
+ color: $labels-dark;
+ }
+ .smart-contract-title {
+ color: #fff;
+ }
+ .smart-contract-form-group-inner-wrapper > label {
+ color: $labels-dark;
+ }
+ .smart-contract-form-buttons {
+ border-top-color: darken($labels-dark, 30);
+ .btn-no-border {
+ background-color: $dark-light;
+ border-color: $dark-light;
+ color: #fff;
+ &:hover {
+ background-color: $dark-primary;
+ color: #fff;
+ }
+ }
+ }
+ .add-contract-libraries-wrapper {
+ border-top-color: darken($labels-dark, 30);
+ }
+
+ .token-tile-view-more:before, .token-tile-view-more:after {
+ border-top-color: darken($labels-dark, 30);
+ border-bottom-color: darken($labels-dark, 30);
+ }
+
+ // Form Controlls
+ .form-control {
+ background-color: $dark-light;
+ border-color: $dark-light;
+ color: #fff;
+ &::placeholder {
+ color: $labels-dark;
+ }
+ &:focus {
+ background-color: $dark-light;
+ border-color: $dark-primary;
+ color: #fff;
+ }
+ }
+ .radio-big .radio-icon {
+ border-color: $labels-dark;
+ }
+ .radio-big input[type="radio"]:checked + .radio-icon {
+ border-color: $dark-primary;
+ }
+ .radio-big input[type="radio"]:checked + .radio-icon::before {
+ background: $dark-primary;
+ }
+ .radio-big .radio-text {
+ color: #fff;
+ }
+
+ // Content loading placeholders
+ .tile-loader, .table-content-loader {
+ background-color: $dark-bg !important;
+ &:before {
+ background: linear-gradient(to right, $dark-bg 2%, lighten($dark-bg, 3) 18%, $dark-bg 33%);
+ }
+ }
+
+ // Verify other explorers
+ .verify-other-explorers-elem {
+ border-color: darken($labels-dark, 30);
+ .exp-logo {
+ border-right-color: darken($labels-dark, 30);
+ }
+ .exp-content {
+ h3 {
+ color: #fff;
+ }
+ div {
+ color: $labels-dark;
+ }
+ }
+ }
+ .verify-other-explorers-more {
+ border-color: $dark-primary;
+ svg path {
+ fill: $dark-primary;
+ }
+ &:hover {
+ background-color: $dark-primary;
+ svg path {
+ fill: #fff;
+ }
+ }
+ }
+ .verify-other-explorers-elem {
+ &:hover {
+ text-decoration: none;
+ color: #fff;
+ .exp-content {
+ h3, div {
+ color: #fff;
+ }
+ }
+ }
+ }
+ .verify-other-explorers-cell {
+ .exp-logo {
+ color: #333 !important;
+ }
+ }
+
+ // API docs dropdown content
+ .api-doc-parameters-list-item-description,
+ .api-doc-parameters-list-item-title,
+ .api-doc-parameters-list-title,
+ .api-doc-list-item-controls-view-more {
+ color: #fff;
+ }
+
+ .api-doc-parameters-list {
+ border-bottom-color: darken($labels-dark, 30);
+ }
+ .api-doc-parameters-container {
+ border-top-color: darken($labels-dark, 30);
+ }
+ .api-doc-tab {
+ color: $dark-primary !important;
+ &.active {
+ border-bottom-color: $dark-primary;
+ }
+ }
+
+ // Common Buttons
+ .btn-secondary, .button-secondary {
+ background-color: transparent;
+ border-color: $dark-primary;
+ color: $dark-primary;
+ &:hover {
+ background-color: $dark-primary;
+ border-color: $dark-primary;
+ color: #fff;
+ }
+ }
+
+ .awesomplete {
+ & > ul {
+ background: $dark-light-bg;
+ &:before {
+ background: $dark-light-bg;
+ }
+ li {
+ &:hover {
+ background-color: $dark-primary;
+ color: #fff;
+ mark {
+ background: darken($dark-primary, 10);
+ color: #fff;
+ }
+ }
+ }
+ }
+ mark {
+ background: $dark-primary;
+ color: #fff;
+ }
+ }
+
+ // Decoded data
+ .table.thead-light.table-bordered {
+ color: #fff !important;
+ }
+ .table-bordered, .table-bordered td, .table-bordered th {
+ border-color: darken($labels-dark, 30);
+ }
+ .dark-theme-applied .table td, .dark-theme-applied .table th, .dark-theme-applied hr {
+ border-top-color: darken($labels-dark, 30);
+ }
+ .btn-copy-ico svg path {
+ fill: #fff;
+ }
+
+ // pre
+ .pre-scrollable.line-numbers, .hljs {
+ background: $dark-light;
color: #fff;
}
+ .hljs-comment {
+ color: $labels-dark;
+ }
+
+ .hljs-title, .hljs-section {
+ color: #ff2294;
+ }
+
+ .hljs-type, .hljs-string, .hljs-number, .hljs-selector-id, .hljs-selector-class, .hljs-quote, .hljs-template-tag, .hljs-deletion {
+ color: #ff2294;
+ }
+
+ .hljs-literal, .hljs-built_in, .hljs-bullet, .hljs-code, .hljs-addition {
+ color: #20dd94;
+ }
+
+ .line-numbers [data-line-number]:before {
+ color: #3f436b !important;
+ border-right-color: #3f436b !important;
+ }
}
\ No newline at end of file
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/transaction/_tile.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/transaction/_tile.html.eex
index d6882801ad..b70cbbb1fb 100644
--- a/apps/block_scout_web/lib/block_scout_web/templates/transaction/_tile.html.eex
+++ b/apps/block_scout_web/lib/block_scout_web/templates/transaction/_tile.html.eex
@@ -26,11 +26,11 @@
- <%= value(@transaction, include_label: false) %>
+ <%= value(@transaction, include_label: false) %>
<%= gettext "Ether" %>
- <%= formatted_fee(@transaction, denomination: :ether, include_label: false) %>
+ <%= formatted_fee(@transaction, denomination: :ether, include_label: false) %>
<%= gettext "TX Fee" %>
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/transaction/_token_transfer.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/transaction/_token_transfer.html.eex
index 73038c15db..3afa468b54 100644
--- a/apps/block_scout_web/lib/block_scout_web/templates/transaction/_token_transfer.html.eex
+++ b/apps/block_scout_web/lib/block_scout_web/templates/transaction/_token_transfer.html.eex
@@ -19,7 +19,7 @@
<%= @token_transfer |> BlockScoutWeb.AddressView.address_partial_selector(:to, @address, true) |> BlockScoutWeb.RenderHelpers.render_partial() %>
-
+
<%= token_transfer_amount(@token_transfer) %>
<%= link(token_symbol(@token_transfer.token), to: token_path(BlockScoutWeb.Endpoint, :show, @token_transfer.token.contract_address_hash)) %>