Merge pull request #1849 from poanetwork/improve-menu

Improve chains menu

CHANGELOG.md

@@ -12,6 +12,7 @@
 - [#1830](https://github.com/poanetwork/blockscout/pull/1830) - Make block size field nullable
 - [#1840](https://github.com/poanetwork/blockscout/pull/1840) - Handle case when total supply is nil
 - [#1838](https://github.com/poanetwork/blockscout/pull/1838) - Block counter calculates only consensus blocks
+- [#1849](https://github.com/poanetwork/blockscout/pull/1849) - Improve chains menu
 
 ### Chore
 

apps/block_scout_web/assets/css/components/_dropdown.scss

@@ -45,6 +45,7 @@
     &,
     &:hover,
     &:active {
+      padding-left: 10px;
       background-color: transparent;
       cursor: default;
       color: #333;
@@ -53,7 +54,7 @@
   }
 
   &.division {
-    border-color: $base-border-color;
+    border-top: 1px solid $base-border-color;
   }
 }
 

apps/block_scout_web/assets/css/components/_navbar.scss

@@ -217,14 +217,6 @@ $navbar-logo-width: auto !default;
     padding-left: $header-link-horizontal-padding;
     padding-right: $header-link-horizontal-padding;
   }
-
-  &.header {
-    font-weight: bold;
-
-    &.division {
-      border-top: 1px solid rgb(183, 185, 184);
-    }
-  }
 }
 
 .add-border {

apps/block_scout_web/config/config.exs

@@ -68,19 +68,23 @@ config :block_scout_web,
     },
     %{
       title: "Ethereum Classic",
-      url: "https://blockscout.com/etc/mainnet"
+      url: "https://blockscout.com/etc/mainnet",
+      other?: true
     },
     %{
       title: "Aerum Mainnet",
-      url: "https://blockscout.com/aerum/mainnet"
+      url: "https://blockscout.com/aerum/mainnet",
+      other?: true
     },
     %{
       title: "Callisto Mainnet",
-      url: "https://blockscout.com/callisto/mainnet"
+      url: "https://blockscout.com/callisto/mainnet",
+      other?: true
     },
     %{
       title: "RSK Mainnet",
-      url: "https://blockscout.com/rsk/mainnet"
+      url: "https://blockscout.com/rsk/mainnet",
+      other?: true
     }
   ]
 

apps/block_scout_web/lib/block_scout_web/templates/layout/_topnav.html.eex

@@ -84,13 +84,17 @@
             <%= subnetwork_title() %>
           </a>
           <div class="dropdown-menu" aria-labelledby="navbarDropdown">
-            <a class="dropdown-item header">Mainnet</a>
-            <%= for %{url: url, title: title} <- main_nets() do %>
-            <a class="dropdown-item" href="<%= url%>"><%= title %></a>
+            <a class="dropdown-item header division">Mainnets</a>
+            <%= for %{url: url, title: title} <- head_main_nets() do %>
+              <a class="dropdown-item" href="<%= url%>"><%= title %></a>
             <% end %>
-            <a class="dropdown-item header division">Testnet</a>
+            <a class="dropdown-item header division">Testnets</a>
             <%= for %{url: url, title: title} <- test_nets() do %>
-            <a class="dropdown-item" href="<%= url%>"><%= title %></a>
+              <a class="dropdown-item" href="<%= url%>"><%= title %></a>
+            <% end %>
+            <a class="dropdown-item header division">Other networks</a>
+            <%= for %{url: url, title: title} <- other_nets() do %>
+              <a class="dropdown-item" href="<%= url%>"><%= title %></a>
             <% end %>
           </div>
         </li>

apps/block_scout_web/lib/block_scout_web/views/layout_view.ex

@@ -107,10 +107,19 @@ defmodule BlockScoutWeb.LayoutView do
     Enum.reject(other_networks(), &Map.get(&1, :test_net?))
   end
 
+  def head_main_nets do
+    main_nets()
+    |> Enum.reject(&Map.get(&1, :other?))
+  end
+
   def test_nets do
     Enum.filter(other_networks(), &Map.get(&1, :test_net?))
   end
 
+  def other_nets do
+    Enum.filter(other_networks(), &Map.get(&1, :other?))
+  end
+
   def other_explorers do
     if Application.get_env(:block_scout_web, :link_to_other_explorers) do
       Application.get_env(:block_scout_web, :other_explorers, [])

apps/block_scout_web/priv/gettext/default.pot

@@ -711,8 +711,8 @@ msgid "Responses"
 msgstr ""
 
 #, elixir-format
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:107
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:125
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:110
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:128
 msgid "Search"
 msgstr ""
 
@@ -1653,8 +1653,8 @@ msgid "Error: Could not determine contract creator."
 msgstr ""
 
 #, elixir-format
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:101
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:105
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:104
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:108
 msgid "Search by address, token symbol name, transaction hash, or block number"
 msgstr ""
 

apps/block_scout_web/priv/gettext/en/LC_MESSAGES/default.po

@@ -711,8 +711,8 @@ msgid "Responses"
 msgstr ""
 
 #, elixir-format
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:107
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:125
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:110
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:128
 msgid "Search"
 msgstr ""
 
@@ -1653,8 +1653,8 @@ msgid "Error: Could not determine contract creator."
 msgstr ""
 
 #, elixir-format
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:101
-#: lib/block_scout_web/templates/layout/_topnav.html.eex:105
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:104
+#: lib/block_scout_web/templates/layout/_topnav.html.eex:108
 msgid "Search by address, token symbol name, transaction hash, or block number"
 msgstr ""