CipherLabs
/
blockscout
mirror of https://github.com/blockscout/blockscout
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #479 from poanetwork/371-update-block-list-page-design

Browse Source 
Update block list page design
pull/483/head
Jimmy Lauzau 6 years ago committed by GitHub
parent fdcd352846 572931aa5e
commit d3193d2773
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 108 additions and 82 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 1
      apps/explorer_web/assets/css/app.scss
  2. 89
      apps/explorer_web/lib/explorer_web/templates/block/index.html.eex
  3. 2
      apps/explorer_web/lib/explorer_web/templates/chain/_block.html.eex
  4. 4
      apps/explorer_web/lib/explorer_web/views/block_view.ex
  5. 22
      apps/explorer_web/priv/gettext/default.pot
  6. 22
      apps/explorer_web/priv/gettext/en/LC_MESSAGES/default.po

1
apps/explorer_web/assets/css/app.scss
Unescape View File

@ -33,6 +33,7 @@ $fa-font-path: "~@fortawesome/fontawesome-free/webfonts";
@import "node_modules/bootstrap/scss/utilities/background"; @import "node_modules/bootstrap/scss/utilities/background";
@import "node_modules/bootstrap/scss/utilities/position"; @import "node_modules/bootstrap/scss/utilities/position";
@import "node_modules/bootstrap/scss/utilities/borders"; @import "node_modules/bootstrap/scss/utilities/borders";
@import "node_modules/bootstrap/scss/progress";
// Bootstrap Components // Bootstrap Components
@import "node_modules/bootstrap/scss/dropdown"; @import "node_modules/bootstrap/scss/dropdown";

89
apps/explorer_web/lib/explorer_web/templates/block/index.html.eex
Unescape View File

@ -1,5 +1,7 @@
<section class="container-fluid"> <section class="container">
<div> <div class="card">
<div class="card-body">
<h1>Blocks</h1> <h1>Blocks</h1>
<p> <p>
<%= gettext( <%= gettext(
@ -8,57 +10,62 @@
end_block: List.last(@blocks).number end_block: List.last(@blocks).number
) %> ) %>
</p> </p>
</div>
<div class="card">
<div class="card-body">
<table class="table table-responsive-sm table-font">
<thead>
<tr>
<th><%= gettext "Height" %></th>
<th><%= gettext "Age" %></th>
<th><%= gettext "Transactions" %></th>
<th><%= gettext "Gas Used" %> (<%= gettext("Gas") %>)</th>
<th><%= gettext "Gas Limit" %> (<%= gettext("Gas") %>)</th>
<th><%= gettext "Gas Price" %></th>
</tr>
</thead>
<tbody>
<%= for block <- @blocks do %> <%= for block <- @blocks do %>
<tr> <div class="tile">
<td> <div class="row">
<div class="col-md-6">
<!-- block height -->
<%= link( <%= link(
block, block,
class: "blocks__link", class: "tile-title",
to: block_path(@conn, :show, @conn.assigns.locale, block), to: block_path(@conn, :show, @conn.assigns.locale, block),
"data-test": "block_number", "data-test": "block_number",
"data-block-number": to_string(block.number) "data-block-number": to_string(block.number)
) %> ) %>
</td> <div>
<td data-from-now="<%= block.timestamp %>"></td> <!-- transactions -->
<td> <span class="mr-2">
<%= gettext("%{count} transactions", count: block.transactions |> Enum.count) %> <%= ngettext("%{count} transaction", "%{count} transactions", Enum.count(block.transactions)) %>
</td> </span>
<td> <!-- size -->
<%= block.gas_used |> Cldr.Number.to_string! %> (<%= <span class="mr-2"> <%= Cldr.Unit.new(:byte, block.size) |> Cldr.Unit.to_string! %> </span>
block.gas_used / block.gas_limit |> Cldr.Number.to_string!(format: "#.#%") <!-- age -->
%>) <span data-from-now="<%= block.timestamp %>"></span>
</td> </div>
<td> <div class="">
<%= block.gas_limit |> Cldr.Number.to_string! %> <!-- validator -->
</td> <%= gettext "Miner" %>
<td> <span class="ml-2">
<%= average_gas_price(block) %> <%= link to: address_path(ExplorerWeb.Endpoint, :show, @locale, block.miner_hash) do %>
</td> <%= block.miner_hash %>
</tr>
<% end %> <% end %>
</tbody> </span>
</table> </div>
</div> </div>
<div class="col-md-6 text-right d-flex flex-column align-items-end justify-content-end">
<!-- Gas Used -->
<div class="">
<%= formatted_gas(block.gas_used) %>
(<%= formatted_gas(block.gas_used / block.gas_limit, format: "#.#%") %>)
<%= gettext "Gas Used" %>
</div> </div>
<div class="progress w-25">
<div class="progress-bar" role="progressbar" style="width: <%= formatted_gas(block.gas_used / block.gas_limit, format: "#.#%") %>;" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100">
</div>
</div>
<!-- Gas Limit -->
<span> <%= formatted_gas(block.gas_limit) %> <%= gettext "Gas Limit" %> </span>
</div>
</div>
</div>
<% end %>
<%= if @next_page_params do %> <%= if @next_page_params do %>
<%= link( <%= link(
gettext("Older"), gettext("Older"),
class: "button button--secondary button--sm u-float-right mt-3", class: "button button--secondary button--sm float-right mt-3",
to: block_path( to: block_path(
@conn, @conn,
:index, :index,
@ -67,4 +74,6 @@
) )
) %> ) %>
<% end %> <% end %>
</div>
</div>
</section> </section>

2
apps/explorer_web/lib/explorer_web/templates/chain/_block.html.eex
Unescape View File

@ -6,7 +6,7 @@
<span class="ml-2" data-from-now="<%= @block.timestamp %>"> </span> <span class="ml-2" data-from-now="<%= @block.timestamp %>"> </span>
</div> </div>
<span class="text-truncate"> <span class="text-truncate">
Validated by <%= gettext "Miner" %>
<%= link to: address_path(ExplorerWeb.Endpoint, :show, @locale, @block.miner), <%= link to: address_path(ExplorerWeb.Endpoint, :show, @locale, @block.miner),
"data-toggle": "tooltip", "data-toggle": "tooltip",
"data-placement": "top", "data-placement": "top",

4
apps/explorer_web/lib/explorer_web/views/block_view.ex
Unescape View File

@ -20,6 +20,10 @@ defmodule ExplorerWeb.BlockView do
"#{average} #{unit_text}" "#{average} #{unit_text}"
end end
def formatted_gas(gas, format \\ []) do
Cldr.Number.to_string!(gas, format)
end
def formatted_timestamp(%Block{timestamp: timestamp}) do def formatted_timestamp(%Block{timestamp: timestamp}) do
Timex.format!(timestamp, "%b-%d-%Y %H:%M:%S %p %Z", :strftime) Timex.format!(timestamp, "%b-%d-%Y %H:%M:%S %p %Z", :strftime)
end end

22
apps/explorer_web/priv/gettext/default.pot
Unescape View File

@ -15,7 +15,7 @@ msgstr ""
msgid "Copyright %{year} POA" msgid "Copyright %{year} POA"
msgstr "" msgstr ""
#: lib/explorer_web/templates/block/index.html.eex:20 #: lib/explorer_web/templates/block/index.html.eex:51
#: lib/explorer_web/templates/block/overview.html.eex:84 #: lib/explorer_web/templates/block/overview.html.eex:84
msgid "Gas Used" msgid "Gas Used"
msgstr "" msgstr ""
@ -40,7 +40,6 @@ msgstr ""
#: lib/explorer_web/templates/address_transaction/index.html.eex:13 #: lib/explorer_web/templates/address_transaction/index.html.eex:13
#: lib/explorer_web/templates/address_transaction/index.html.eex:55 #: lib/explorer_web/templates/address_transaction/index.html.eex:55
#: lib/explorer_web/templates/address_transaction/index.html.eex:131 #: lib/explorer_web/templates/address_transaction/index.html.eex:131
#: lib/explorer_web/templates/block/index.html.eex:19
#: lib/explorer_web/templates/block_transaction/index.html.eex:13 #: lib/explorer_web/templates/block_transaction/index.html.eex:13
#: lib/explorer_web/templates/block_transaction/index.html.eex:26 #: lib/explorer_web/templates/block_transaction/index.html.eex:26
#: lib/explorer_web/templates/block_transaction/index.html.eex:36 #: lib/explorer_web/templates/block_transaction/index.html.eex:36
@ -63,12 +62,14 @@ msgstr ""
msgid "Difficulty" msgid "Difficulty"
msgstr "" msgstr ""
#: lib/explorer_web/templates/block/index.html.eex:21 #: lib/explorer_web/templates/block/index.html.eex:59
#: lib/explorer_web/templates/block/overview.html.eex:92 #: lib/explorer_web/templates/block/overview.html.eex:92
msgid "Gas Limit" msgid "Gas Limit"
msgstr "" msgstr ""
#: lib/explorer_web/templates/block/index.html.eex:38
#: lib/explorer_web/templates/block/overview.html.eex:70 #: lib/explorer_web/templates/block/overview.html.eex:70
#: lib/explorer_web/templates/chain/_block.html.eex:9
msgid "Miner" msgid "Miner"
msgstr "" msgstr ""
@ -109,8 +110,6 @@ msgstr ""
msgid "Cumulative Gas Used" msgid "Cumulative Gas Used"
msgstr "" msgstr ""
#: lib/explorer_web/templates/block/index.html.eex:20
#: lib/explorer_web/templates/block/index.html.eex:21
#: lib/explorer_web/templates/transaction/overview.html.eex:92 #: lib/explorer_web/templates/transaction/overview.html.eex:92
msgid "Gas" msgid "Gas"
msgstr "" msgstr ""
@ -181,11 +180,11 @@ msgstr ""
msgid "POA" msgid "POA"
msgstr "" msgstr ""
#: lib/explorer_web/templates/block/index.html.eex:39 #: lib/explorer_web/templates/block/index.html.eex:29
msgid "%{count} transactions" msgid "%{count} transactions"
msgstr "" msgstr ""
#: lib/explorer_web/templates/block/index.html.eex:5 #: lib/explorer_web/templates/block/index.html.eex:7
msgid "Showing #%{start_block} to #%{end_block}" msgid "Showing #%{start_block} to #%{end_block}"
msgstr "" msgstr ""
@ -470,7 +469,7 @@ msgstr ""
#: lib/explorer_web/templates/address_internal_transaction/index.html.eex:133 #: lib/explorer_web/templates/address_internal_transaction/index.html.eex:133
#: lib/explorer_web/templates/address_transaction/index.html.eex:146 #: lib/explorer_web/templates/address_transaction/index.html.eex:146
#: lib/explorer_web/templates/block/index.html.eex:60 #: lib/explorer_web/templates/block/index.html.eex:67
#: lib/explorer_web/templates/block_transaction/index.html.eex:51 #: lib/explorer_web/templates/block_transaction/index.html.eex:51
#: lib/explorer_web/templates/pending_transaction/index.html.eex:79 #: lib/explorer_web/templates/pending_transaction/index.html.eex:79
#: lib/explorer_web/templates/transaction/index.html.eex:84 #: lib/explorer_web/templates/transaction/index.html.eex:84
@ -721,3 +720,10 @@ msgstr ""
#: lib/explorer_web/templates/address_transaction/_transaction.html.eex:61 #: lib/explorer_web/templates/address_transaction/_transaction.html.eex:61
msgid "Transfers" msgid "Transfers"
msgstr "" msgstr ""
#, elixir-format
#: lib/explorer_web/templates/block/index.html.eex:29
msgid "%{count} transaction"
msgid_plural "%{count} transactions"
msgstr[0] ""
msgstr[1] ""

22
apps/explorer_web/priv/gettext/en/LC_MESSAGES/default.po
Unescape View File

@ -27,7 +27,7 @@ msgstr "Blocks"
msgid "Copyright %{year} POA" msgid "Copyright %{year} POA"
msgstr "%{year} POA Network Ltd. All rights reserved" msgstr "%{year} POA Network Ltd. All rights reserved"
#: lib/explorer_web/templates/block/index.html.eex:20 #: lib/explorer_web/templates/block/index.html.eex:51
#: lib/explorer_web/templates/block/overview.html.eex:84 #: lib/explorer_web/templates/block/overview.html.eex:84
msgid "Gas Used" msgid "Gas Used"
msgstr "Gas Used" msgstr "Gas Used"
@ -52,7 +52,6 @@ msgstr "POA Network Explorer"
#: lib/explorer_web/templates/address_transaction/index.html.eex:13 #: lib/explorer_web/templates/address_transaction/index.html.eex:13
#: lib/explorer_web/templates/address_transaction/index.html.eex:55 #: lib/explorer_web/templates/address_transaction/index.html.eex:55
#: lib/explorer_web/templates/address_transaction/index.html.eex:131 #: lib/explorer_web/templates/address_transaction/index.html.eex:131
#: lib/explorer_web/templates/block/index.html.eex:19
#: lib/explorer_web/templates/block_transaction/index.html.eex:13 #: lib/explorer_web/templates/block_transaction/index.html.eex:13
#: lib/explorer_web/templates/block_transaction/index.html.eex:26 #: lib/explorer_web/templates/block_transaction/index.html.eex:26
#: lib/explorer_web/templates/block_transaction/index.html.eex:36 #: lib/explorer_web/templates/block_transaction/index.html.eex:36
@ -75,12 +74,14 @@ msgstr "Block #%{number} Details"
msgid "Difficulty" msgid "Difficulty"
msgstr "Difficulty" msgstr "Difficulty"
#: lib/explorer_web/templates/block/index.html.eex:21 #: lib/explorer_web/templates/block/index.html.eex:59
#: lib/explorer_web/templates/block/overview.html.eex:92 #: lib/explorer_web/templates/block/overview.html.eex:92
msgid "Gas Limit" msgid "Gas Limit"
msgstr "Gas Limit" msgstr "Gas Limit"
#: lib/explorer_web/templates/block/index.html.eex:38
#: lib/explorer_web/templates/block/overview.html.eex:70 #: lib/explorer_web/templates/block/overview.html.eex:70
#: lib/explorer_web/templates/chain/_block.html.eex:9
msgid "Miner" msgid "Miner"
msgstr "Validator" msgstr "Validator"
@ -121,8 +122,6 @@ msgstr "Transaction Details"
msgid "Cumulative Gas Used" msgid "Cumulative Gas Used"
msgstr "Cumulative Gas Used" msgstr "Cumulative Gas Used"
#: lib/explorer_web/templates/block/index.html.eex:20
#: lib/explorer_web/templates/block/index.html.eex:21
#: lib/explorer_web/templates/transaction/overview.html.eex:92 #: lib/explorer_web/templates/transaction/overview.html.eex:92
msgid "Gas" msgid "Gas"
msgstr "Gas" msgstr "Gas"
@ -193,11 +192,11 @@ msgstr "Balance"
msgid "POA" msgid "POA"
msgstr "POA" msgstr "POA"
#: lib/explorer_web/templates/block/index.html.eex:39 #: lib/explorer_web/templates/block/index.html.eex:29
msgid "%{count} transactions" msgid "%{count} transactions"
msgstr "%{count} transactions" msgstr "%{count} transactions"
#: lib/explorer_web/templates/block/index.html.eex:5 #: lib/explorer_web/templates/block/index.html.eex:7
msgid "Showing #%{start_block} to #%{end_block}" msgid "Showing #%{start_block} to #%{end_block}"
msgstr "Showing #%{start_block} to #%{end_block}" msgstr "Showing #%{start_block} to #%{end_block}"
@ -482,7 +481,7 @@ msgstr ""
#: lib/explorer_web/templates/address_internal_transaction/index.html.eex:133 #: lib/explorer_web/templates/address_internal_transaction/index.html.eex:133
#: lib/explorer_web/templates/address_transaction/index.html.eex:146 #: lib/explorer_web/templates/address_transaction/index.html.eex:146
#: lib/explorer_web/templates/block/index.html.eex:60 #: lib/explorer_web/templates/block/index.html.eex:67
#: lib/explorer_web/templates/block_transaction/index.html.eex:51 #: lib/explorer_web/templates/block_transaction/index.html.eex:51
#: lib/explorer_web/templates/pending_transaction/index.html.eex:79 #: lib/explorer_web/templates/pending_transaction/index.html.eex:79
#: lib/explorer_web/templates/transaction/index.html.eex:84 #: lib/explorer_web/templates/transaction/index.html.eex:84
@ -733,3 +732,10 @@ msgstr ""
#: lib/explorer_web/templates/address_transaction/_transaction.html.eex:61 #: lib/explorer_web/templates/address_transaction/_transaction.html.eex:61
msgid "Transfers" msgid "Transfers"
msgstr "" msgstr ""
#, elixir-format
#: lib/explorer_web/templates/block/index.html.eex:29
msgid "%{count} transaction"
msgid_plural "%{count} transactions"
msgstr[0] ""
msgstr[1] ""

Write Preview
Loading…
Cancel
Save