From d0b064ba8577eda644c3e84bf3c31ccd59477250 Mon Sep 17 00:00:00 2001 From: Ryan Arthur Date: Tue, 4 Sep 2018 13:10:46 -0400 Subject: [PATCH] Refactor button class names --- .../assets/css/components/_button.scss | 29 +++-- .../assets/css/theme/_base_variables.scss | 3 +- .../templates/address_contract/index.html.eex | 8 +- .../new.html.eex | 8 +- .../index.html.eex | 4 +- .../templates/address_token/index.html.eex | 122 ++++++++++++++++++ .../address_transaction/index.html.eex | 4 +- .../templates/api_docs/_action_tile.html.eex | 8 +- .../templates/block/index.html.eex | 2 +- .../block_transaction/index.html.eex | 2 +- .../templates/chain/show.html.eex | 4 +- .../pending_transaction/index.html.eex | 2 +- .../smart_contract/_functions.html.eex | 2 +- .../templates/tokens/token/show.html.eex | 2 +- .../templates/transaction/index.html.eex | 2 +- .../index.html.eex | 2 +- .../templates/transaction_log/index.html.eex | 2 +- .../transaction_token_transfer/index.html.eex | 2 +- 18 files changed, 166 insertions(+), 42 deletions(-) create mode 100644 apps/block_scout_web/lib/block_scout_web/templates/address_token/index.html.eex diff --git a/apps/block_scout_web/assets/css/components/_button.scss b/apps/block_scout_web/assets/css/components/_button.scss index 3143caf4c8..63855d5fe9 100644 --- a/apps/block_scout_web/assets/css/components/_button.scss +++ b/apps/block_scout_web/assets/css/components/_button.scss @@ -10,15 +10,15 @@ -webkit-transition: all 0.25s; transition: all 0.25s; - &--primary { + &-primary { background-color: $primary; color: $white; border: 1px solid $primary; &:hover, &:focus { - background-color: $primary; - border-color: $primary; + background-color: darken($primary, 10%); + border-color: darken($primary, 10%); text-decoration: none; } @@ -29,50 +29,51 @@ } } - &--secondary { + &-secondary { border: 1px solid $tertiary; color: $tertiary; font-weight: 400; &:hover, &:focus { - background-color: darken($tertiary, 20%); - border-color: darken($tertiary, 20%); + background-color: darken($tertiary, 10%); + border-color: darken($tertiary, 10%); color: $white; text-decoration: none; outline: none !important; } } - &--xsmall { + &-xs { font-size: 11px; padding: 6px 9px 6px !important; } - &--small { + &-sm { font-size: 12px; padding: 10px 20px 10px; } - &--medium { + &-md { font-size: 1.5rem; padding: 15px 30px 15px; } - &--large { + &-lg { font-size: 1.5rem; padding: 20px 60px 20px; } // Block button -// -------------------------------------------------- +// ------------------------- - &--block { + &-block { display: block; width: 100%; } - &--disabled { + &-disabled, + &:disabled, { background-color: $gray-300; color: $gray-500; text-decoration: none; @@ -81,6 +82,6 @@ } // Vertically space out multiple block buttons -.button--block + .button--block { +.button-block + .button-block { margin-top: 5px; } diff --git a/apps/block_scout_web/assets/css/theme/_base_variables.scss b/apps/block_scout_web/assets/css/theme/_base_variables.scss index d580533a77..d92427e068 100644 --- a/apps/block_scout_web/assets/css/theme/_base_variables.scss +++ b/apps/block_scout_web/assets/css/theme/_base_variables.scss @@ -31,7 +31,8 @@ $grays: map-merge(( $blue: #4786ff !default; $indigo: #5b33a1 !default; -$purple: #9987fc !default; +// $purple: #9987fc !default; +$purple: #997fdc !default; $pink: #e83e8c !default; $red: #c74d39 !default; $orange: #ef9a60 !default; diff --git a/apps/block_scout_web/lib/block_scout_web/templates/address_contract/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/address_contract/index.html.eex index ce78dd567d..713d74a0f3 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/address_contract/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/address_contract/index.html.eex @@ -47,7 +47,7 @@ <%= link( gettext("Verify and Publish"), to: address_verify_contract_path(@conn, :new, @conn.params["address_id"]), - class: "button button--primary button--sm float-right ml-3", + class: "button button-primary button-sm float-right ml-3", "data-test": "verify_and_publish" ) %> <% end %> @@ -72,7 +72,7 @@

Contract source code

- @@ -90,7 +90,7 @@

Contract ABI

- @@ -110,7 +110,7 @@

Contract creation code

- diff --git a/apps/block_scout_web/lib/block_scout_web/templates/address_contract_verification/new.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/address_contract_verification/new.html.eex index c92532b98a..30f484a6cd 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/address_contract_verification/new.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/address_contract_verification/new.html.eex @@ -53,15 +53,15 @@ name="button" id="loading" disabled="true" - class="d-none px-4 position-absolute button button--primary button--sm mr-2"> + class="d-none px-4 position-absolute button button-primary button-sm mr-2"> <%= gettext("loading.....") %> - <%= submit "Verify and publish", class: "button button--primary button--sm mr-2", "data-loading": "animation" %> - <%= reset "Reset", class: "button button--secondary button--sm mr-2" %> + <%= submit "Verify and publish", class: "button button-primary button-sm mr-2", "data-loading": "animation" %> + <%= reset "Reset", class: "button button-secondary button-sm mr-2" %> <%= link( "Cancel", to: address_contract_path(@conn, :index, @conn.params["address_id"]), - class: "button button--sm") %> + class: "button button-sm") %> <% end %>
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/address_internal_transaction/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/address_internal_transaction/index.html.eex index 35d0c4af3c..3472571c01 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/address_internal_transaction/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/address_internal_transaction/index.html.eex @@ -89,7 +89,7 @@
- @@ -140,7 +140,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--sm float-right mt-3", + class: "button button-secondary button-sm float-right mt-3", to: address_internal_transaction_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/address_token/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/address_token/index.html.eex new file mode 100644 index 0000000000..4efafd18ef --- /dev/null +++ b/apps/block_scout_web/lib/block_scout_web/templates/address_token/index.html.eex @@ -0,0 +1,122 @@ +
+ + <%= render BlockScoutWeb.AddressView, "overview.html", assigns %> + +
+
+
+ + +
    +
  • + <%= link( + gettext("Tokens"), + class: "nav-link active", + to: address_token_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]) + ) %> +
    • +
  • + <%= link( + gettext("Transactions"), + class: "nav-link", + to: address_transaction_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]) + ) %> +
    • +
  • <%= link( + gettext("Internal Transactions"), + class: "nav-link", + "data-test": "internal_transactions_tab_link", + to: address_internal_transaction_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]) + ) %> +
    • + <%= if contract?(@address) do %> +
  • + <%= link( + to: address_contract_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]), + class: "nav-link") do %> + <%= gettext("Code") %> + + <%= if smart_contract_verified?(@address) do %> + + <% end %> + <% end %> +
    • + <% end %> + <%= if smart_contract_with_read_only_functions?(@address) do %> +
  • + <%= link( + gettext("Read Contract"), + to: address_read_contract_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]), + class: "nav-link")%> +
    • + <% end %> +
+ + +
    +
  • + +
    + <%= link( + gettext("Token"), + class: "dropdown-item", + to: address_token_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]) + ) %> + <%= link( + gettext("Transactions"), + class: "dropdown-item", + to: address_transaction_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]) + ) %> + <%= link( + gettext("Internal Transactions"), + class: "dropdown-item", + "data-test": "internal_transactions_tab_link", + to: address_internal_transaction_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]) + ) %> + <%= if contract?(@address) do %> + <%= link( + to: address_contract_path(@conn, :index, @conn.assigns.locale, @conn.params["address_id"]), + class: "dropdown-item") do %> + <%= gettext("Code") %> + + <%= if smart_contract_verified?(@address) do %> + + <% end %> + <% end %> + <% end %> +
    +
    • +
+
+ +
+

<%= gettext "Tokens" %>

+ <%= if Enum.any?(@tokens) do %> + <%= for token <- @tokens do %> + <%= render "_tokens.html", conn: @conn, locale: @locale, token: token %> + <% end %> + <% else %> +
+ <%= gettext "There are no tokens for this address." %> +
+ <% end %> + +
+ <%= if @next_page_params do %> + <%= link( + gettext("Next"), + class: "button button-secondary button-sm float-right", + to: address_token_path( + @conn, + :index, + @conn.assigns.locale, + @address, + @next_page_params + ) + ) %> + <% end %> +
+
+
+
+
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/address_transaction/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/address_transaction/index.html.eex index 39c8a6d1a1..0846f3bda1 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/address_transaction/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/address_transaction/index.html.eex @@ -90,7 +90,7 @@
- @@ -141,7 +141,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--sm float-right mt-3", + class: "button button-secondary button-sm float-right mt-3", to: address_transaction_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/api_docs/_action_tile.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/api_docs/_action_tile.html.eex index 7c2eab9fe9..33844ae5b0 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/api_docs/_action_tile.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/api_docs/_action_tile.html.eex @@ -18,8 +18,8 @@

<%= gettext "Parameters" %> - - + +

@@ -89,10 +89,10 @@ <% end %>
- +
- +
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/block/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/block/index.html.eex index 84d6a73ee4..409be76af5 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/block/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/block/index.html.eex @@ -13,7 +13,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--sm float-right mt-3", + class: "button button-secondary button-sm float-right mt-3", to: block_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/block_transaction/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/block_transaction/index.html.eex index 0ed13933c7..aecf3db532 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/block_transaction/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/block_transaction/index.html.eex @@ -48,7 +48,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--sm float-right mt-3", + class: "button button-secondary button-sm float-right mt-3", to: transaction_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex index 20e9840c99..1c171bd7f1 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/chain/show.html.eex @@ -52,7 +52,7 @@
- <%= link(gettext("View All Blocks →"), to: block_path(BlockScoutWeb.Endpoint, :index), class: "button button--secondary button--xsmall float-right") %> + <%= link(gettext("View All Blocks →"), to: block_path(BlockScoutWeb.Endpoint, :index), class: "button button-secondary button-xsmall float-right") %>

<%= gettext "Blocks" %>

<%= for block <- @blocks do %> @@ -69,7 +69,7 @@ <%= gettext "More transactions have come in" %>
- <%= link(gettext("View All Transactions →"), to: transaction_path(BlockScoutWeb.Endpoint, :index), class: "button button--secondary button--xsmall float-right") %> + <%= link(gettext("View All Transactions →"), to: transaction_path(BlockScoutWeb.Endpoint, :index), class: "button button-secondary button-xsmall float-right") %>

<%= gettext "Transactions" %>

<%= for transaction <- @transactions do %> diff --git a/apps/block_scout_web/lib/block_scout_web/templates/pending_transaction/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/pending_transaction/index.html.eex index b0083781da..9e3991a058 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/pending_transaction/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/pending_transaction/index.html.eex @@ -76,7 +76,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--sm float-right mt-3", + class: "button button-secondary button-sm float-right mt-3", to: pending_transaction_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/smart_contract/_functions.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/smart_contract/_functions.html.eex index 5fd9908710..7c94f0bd25 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/smart_contract/_functions.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/smart_contract/_functions.html.eex @@ -19,7 +19,7 @@
<% end %> - +
diff --git a/apps/block_scout_web/lib/block_scout_web/templates/tokens/token/show.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/tokens/token/show.html.eex index 6c5c471ce3..59b1a762ab 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/tokens/token/show.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/tokens/token/show.html.eex @@ -69,7 +69,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--small float-right mt-4", + class: "button button-secondary button-small float-right mt-4", to: token_path(@conn, :show, @token.contract_address_hash, @next_page_params) ) %> <% end %> diff --git a/apps/block_scout_web/lib/block_scout_web/templates/transaction/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/transaction/index.html.eex index 6990eeaa63..408418e821 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/transaction/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/transaction/index.html.eex @@ -64,7 +64,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--sm float-right mt-3", + class: "button button-secondary button-sm float-right mt-3", to: transaction_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/transaction_internal_transaction/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/transaction_internal_transaction/index.html.eex index e11701176c..6ad8b0e0f8 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/transaction_internal_transaction/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/transaction_internal_transaction/index.html.eex @@ -75,7 +75,7 @@ <%= if @next_page_params do %> <%= link( gettext("Newer"), - class: "button button--secondary button--sm float-right mt-3", + class: "button button-secondary button-sm float-right mt-3", to: transaction_internal_transaction_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/transaction_log/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/transaction_log/index.html.eex index 4de4100181..6745482f5c 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/transaction_log/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/transaction_log/index.html.eex @@ -120,7 +120,7 @@ <%= if @next_page_params do %> <%= link( gettext("Newer"), - class: "button button--secondary button--sm u-float-right mt-3", + class: "button button-secondary button-sm u-float-right mt-3", to: transaction_log_path( @conn, :index, diff --git a/apps/block_scout_web/lib/block_scout_web/templates/transaction_token_transfer/index.html.eex b/apps/block_scout_web/lib/block_scout_web/templates/transaction_token_transfer/index.html.eex index 145a7ca439..4c4ab372c9 100644 --- a/apps/block_scout_web/lib/block_scout_web/templates/transaction_token_transfer/index.html.eex +++ b/apps/block_scout_web/lib/block_scout_web/templates/transaction_token_transfer/index.html.eex @@ -70,7 +70,7 @@ <%= if @next_page_params do %> <%= link( gettext("Older"), - class: "button button--secondary button--sm u-float-left mt-3", + class: "button button-secondary button-sm u-float-left mt-3", to: transaction_token_transfer_path( @conn, :index,