diff --git a/CHANGELOG.md b/CHANGELOG.md
index c66cf85680..6d5dfba8dc 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -22,6 +22,7 @@
- [#2012](https://github.com/poanetwork/blockscout/pull/2012) - make all pages pagination async
### Fixes
+- [#2072](https://github.com/poanetwork/blockscout/pull/2072) - Fixed checkmarks not showing correctly in tabs.
- [#2066](https://github.com/poanetwork/blockscout/pull/2066) - fixed length of logs search input
- [#2056](https://github.com/poanetwork/blockscout/pull/2056) - log search form styles added
- [#2043](https://github.com/poanetwork/blockscout/pull/2043) - Fixed modal dialog width for 'verify other explorers'
diff --git a/apps/block_scout_web/assets/css/components/_card.scss b/apps/block_scout_web/assets/css/components/_card.scss
index 6e1b6a9725..d3f660db16 100644
--- a/apps/block_scout_web/assets/css/components/_card.scss
+++ b/apps/block_scout_web/assets/css/components/_card.scss
@@ -5,6 +5,8 @@ $card-horizontal-padding: 30px;
$card-vertical-padding: 30px;
$card-background-1: $primary !default;
$card-background-1-text-color: #fff !default;
+$card-tab-icon-color: #20b760 !default;
+$card-tab-icon-color-active: #20b760 !default;
.card {
background-color: $card-background-color;
@@ -158,40 +160,50 @@ $card-background-1-text-color: #fff !default;
justify-content: flex-start;
overflow: hidden;
- @include media-breakpoint-down(sm) {
+ @include media-breakpoint-down(md) {
flex-direction: column;
}
}
.card-tab {
+ align-items: center;
background-color: $card-background-color;
color: #333;
cursor: pointer;
+ display: flex;
font-size: 14px;
font-weight: normal;
height: 70px;
- line-height: 70px;
- padding: 0 30px;
+ padding: 0 25px;
text-align: center;
&:hover {
text-decoration: underline;
}
- @include media-breakpoint-down(sm) {
+ @include media-breakpoint-down(md) {
display: none;
width: 100%;
}
+ .fa-check-circle {
+ color: $card-tab-icon-color;
+ margin-left: 6px;
+ }
+
&.active {
background-color: $card-tab-active;
color: #fff;
cursor: default;
text-decoration: none;
- @include media-breakpoint-down(sm) {
+ .fa-check-circle {
+ color: $card-tab-icon-color-active;
+ }
+
+ @include media-breakpoint-down(md) {
cursor: pointer;
- display: block;
+ display: flex;
order: -1;
&::after {
diff --git a/apps/block_scout_web/assets/js/lib/card_tabs.js b/apps/block_scout_web/assets/js/lib/card_tabs.js
index 49b82ad04f..24b08e641e 100644
--- a/apps/block_scout_web/assets/js/lib/card_tabs.js
+++ b/apps/block_scout_web/assets/js/lib/card_tabs.js
@@ -17,7 +17,7 @@ $(function () {
const siblings = $(this).siblings()
if (siblings.is(':hidden')) {
- siblings.show()
+ siblings.css({ 'display': 'flex' })
} else {
siblings.hide()
}
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/address/_tabs.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/address/_tabs.html.eex
index 0c2d339c38..339b2d67e7 100644
--- a/apps/block_scout_web/lib/block_scout_web/templates/address/_tabs.html.eex
+++ b/apps/block_scout_web/lib/block_scout_web/templates/address/_tabs.html.eex
@@ -41,7 +41,7 @@
class: "card-tab #{tab_status("contracts", @conn.request_path)}") do %>
<%= gettext("Code") %>
<%= if smart_contract_verified?(@address) do %>
-
+
<% end %>
<% end %>
<% end %>
@@ -50,7 +50,7 @@
to: address_decompiled_contract_path(@conn, :index, @address.hash),
class: "card-tab #{tab_status("decompiled_contracts", @conn.request_path)}") do %>
<%= gettext("Decompiled code") %>
-
+
<% end %>
<% end %>
<%= if smart_contract_with_read_only_functions?(@address) do %>
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/address/overview.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/address/overview.html.eex
index e75634ee83..76387a9662 100644
--- a/apps/block_scout_web/lib/block_scout_web/templates/address/overview.html.eex
+++ b/apps/block_scout_web/lib/block_scout_web/templates/address/overview.html.eex
@@ -121,7 +121,9 @@
<% end %>
+
diff --git a/apps/block_scout_web/priv/gettext/default.pot b/apps/block_scout_web/priv/gettext/default.pot
index ff1da15027..2caf439866 100644
--- a/apps/block_scout_web/priv/gettext/default.pot
+++ b/apps/block_scout_web/priv/gettext/default.pot
@@ -207,8 +207,8 @@ msgstr ""
#, elixir-format
#: lib/block_scout_web/templates/address/_validator_metadata_modal.html.eex:37
-#: lib/block_scout_web/templates/address/overview.html.eex:142
-#: lib/block_scout_web/templates/address/overview.html.eex:150
+#: lib/block_scout_web/templates/address/overview.html.eex:144
+#: lib/block_scout_web/templates/address/overview.html.eex:152
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:106
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:114
msgid "Close"
@@ -634,7 +634,7 @@ msgstr ""
#, elixir-format
#: lib/block_scout_web/templates/address/overview.html.eex:33
-#: lib/block_scout_web/templates/address/overview.html.eex:141
+#: lib/block_scout_web/templates/address/overview.html.eex:143
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:35
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:105
msgid "QR Code"
diff --git a/apps/block_scout_web/priv/gettext/en/LC_MESSAGES/default.po b/apps/block_scout_web/priv/gettext/en/LC_MESSAGES/default.po
index 00e030a367..6bbaa0f4b7 100644
--- a/apps/block_scout_web/priv/gettext/en/LC_MESSAGES/default.po
+++ b/apps/block_scout_web/priv/gettext/en/LC_MESSAGES/default.po
@@ -207,8 +207,8 @@ msgstr ""
#, elixir-format
#: lib/block_scout_web/templates/address/_validator_metadata_modal.html.eex:37
-#: lib/block_scout_web/templates/address/overview.html.eex:142
-#: lib/block_scout_web/templates/address/overview.html.eex:150
+#: lib/block_scout_web/templates/address/overview.html.eex:144
+#: lib/block_scout_web/templates/address/overview.html.eex:152
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:106
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:114
msgid "Close"
@@ -634,7 +634,7 @@ msgstr ""
#, elixir-format
#: lib/block_scout_web/templates/address/overview.html.eex:33
-#: lib/block_scout_web/templates/address/overview.html.eex:141
+#: lib/block_scout_web/templates/address/overview.html.eex:143
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:35
#: lib/block_scout_web/templates/tokens/overview/_details.html.eex:105
msgid "QR Code"