diff --git a/apps/explorer_web/assets/css/components/_card.scss b/apps/explorer_web/assets/css/components/_card.scss index 2af1fd538b..dbd92866a1 100644 --- a/apps/explorer_web/assets/css/components/_card.scss +++ b/apps/explorer_web/assets/css/components/_card.scss @@ -1,14 +1,56 @@ +$card-link-size: 2rem; + .card { border-color: transparent; box-shadow: 0 5px 40px -5px rgba($black, 0.25); border-radius: 0; margin-bottom: 3rem; + + &-balance { + background-color: $primary; + color: $white; + } + + &-muted { + color: $text-muted; + } + } .card-header { background-color: $white; + border-bottom: none; + + &-tabs { + margin: (-$card-spacer-y) (-$card-spacer-x); + } } -.card-header-tabs { - margin: (-$card-spacer-y) (-$card-spacer-x); + +.card-links { + position: absolute; + right: 0; + display: flex; + flex-direction: row; + align-items: center; + margin-right: 1rem; + + & > a { + display: flex; + align-items: center; + justify-content: center; + width: $card-link-size; + height: $card-link-size; + margin: 0 .25rem; + color: $text-muted; + background-color: $gray-200; + border-radius: 50%; + transition: all 0.1s ease; + + &:hover { + background-color: $gray-600; + color: $primary; + text-decoration: none; + } + } } diff --git a/apps/explorer_web/lib/explorer_web/templates/address/overview.html.eex b/apps/explorer_web/lib/explorer_web/templates/address/overview.html.eex index 7d608b0791..4363924909 100644 --- a/apps/explorer_web/lib/explorer_web/templates/address/overview.html.eex +++ b/apps/explorer_web/lib/explorer_web/templates/address/overview.html.eex @@ -1,5 +1,5 @@
-
+ -
-
-
-
- - <%= render "_values.html", address: @address, exchange_rate: @exchange_rate, transaction_count: @transaction_count %> -
+
+
+
+
+ +

<%= address_title(@address) %>

+

<%= @address %>

+
+ <%= Cldr.Number.to_string!(@transaction_count) %> <%= gettext "Transactions" %> + 0 Mined + 0 Uncles +
+
+
+
+
+
+
+

Balance

+ +
+
<%= balance(@address) %>
+ <%= formatted_usd(@address, @exchange_rate) %> +
+
+
+
+
+
+
+ +

Token Holdings

+
+ <%= formatted_usd(@address, @exchange_rate) %> +