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

Merge branch 'master' into optimized-indexer

Browse Source
pull/162/head
Luke Imhoff 7 years ago
parent e97827a926 bec1300c0a
commit d4bd784d15
11 changed files with 106 additions and 124 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. 55
      apps/explorer_web/assets/css/_content.scss
  2. 4
      apps/explorer_web/assets/css/app.scss
  3. 3
      apps/explorer_web/assets/css/components/_footer.scss
  4. 3
      apps/explorer_web/assets/css/components/_header.scss
  5. 54
      apps/explorer_web/assets/css/components/_sidebar.scss
  6. 71
      apps/explorer_web/assets/css/explorer/_wrapper.scss
  7. 2
      apps/explorer_web/assets/css/theme/_neutral-variables.scss
  8. 2
      apps/explorer_web/assets/js/lib/sidebar.js
  9. 16
      apps/explorer_web/lib/explorer_web/templates/layout/app.html.eex
  10. 10
      apps/explorer_web/priv/gettext/default.pot
  11. 10
      apps/explorer_web/priv/gettext/en/LC_MESSAGES/default.po

55
apps/explorer_web/assets/css/_content.scss
Unescape View File

@ -0,0 +1,55 @@
.content-wrapper {
display: flex;
align-items: stretch;
min-height: 100vh;
}
#content {
flex-grow: 1;
display: flex;
flex-direction: column;
}
.content-container {
flex-grow: 1;
padding-top: 90px;
}
.content-header {
display: flex;
position: fixed;
width: 100%;
}
.container {
&__section {
display: block;
padding: 0 15px;
margin: 0 10px;
}
}
@media (min-width: 768px) {
.content-header {
width: calc(100% - 200px);
}
.container {
&__section {
&--partitioned {
display: flex;
justify-content: space-between;
align-items: stretch;
}
}
&__subsection {
flex: 1;
margin-right: 10px;
& + & { margin-left: 5px; }
}
}
}

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

@ -21,10 +21,10 @@
@import "node_modules/bootstrap/scss/transitions";
// Custom SCSS
@import "explorer/wrapper";
@import "content";
@import "theme/fonts";
@import "utilities";
@import "typography";
@import "components/menu";
@import "components/sidebar";
@import "explorer/button";
@import "explorer/filter";

3
apps/explorer_web/assets/css/components/_footer.scss
Unescape View File

@ -1,7 +1,5 @@
.footer {
font-size: 12px;
position: fixed;
width: calc(100% - 200px);
display: block;
bottom: 0;
background: explorer-color("gray", "50");
@ -10,6 +8,7 @@
padding: 14px;
height: 50px;
@media (max-width: 768px) {
width: 100%;
}

3
apps/explorer_web/assets/css/components/_header.scss
Unescape View File

@ -9,7 +9,7 @@
width: 100%;
&__container {
margin-top: 7px;
}
&__row {
@ -29,6 +29,7 @@
@include explorer-typography("body1");
padding-left: 8px;
width: 90%;
margin-top: 7px;
}
&--search-form {

54
apps/explorer_web/assets/css/components/_menu.scss → apps/explorer_web/assets/css/components/_sidebar.scss
Unescape View File

@ -2,26 +2,15 @@
/* ---------------------------------------------------
SIDEBAR STYLE
----------------------------------------------------- */
#sidebar {
min-width: 200px;
background: $gray-200;
position: sticky;
#sidebar {
width: 200px;
background: $navbar-light-color;
top: 0px;
@media (max-width: 768px) {
transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
transform-origin: bottom left;
}
z-index: 9999;
height: 100%;
position: fixed;
}
#sidebar .active {
@media (max-width: 768px) {
margin-left: -200px;
transform: rotateY(100deg);
}
}
#sidebar .sidebar-header {
background-color: $primary;
color: $gray-800;
@ -64,11 +53,6 @@
}
#sidebar ul li.active > a, a[aria-expanded="true"] {
}
#sidebar li {
list-style-type: none;
padding-left: 5px;
@ -78,6 +62,10 @@ a[data-toggle="collapse"] {
position: relative;
}
#sidebar--container {
width: 200px;
}
#pageSubmenu {
margin-bottom: 5px;
}
@ -94,24 +82,31 @@ a[data-toggle="collapse"] {
MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 768px) {
#sidebar {
#sidebar--container {
margin-left: -200px;
transform: rotateY(90deg);
height: 100vh;
position: fixed;
transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
~ #content {
position: absolute;
left: 0;
right: 0;
transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
}
}
}
#sidebar.active {
#sidebar--container.active {
margin-left: 0;
transform: none;
outline: none;
~ #content {
position: absolute;
left: 200px;
right: -200px;
}
}
}
#sidebar .menu-items div {
padding-top: 11px;
@ -120,8 +115,9 @@ a[data-toggle="collapse"] {
#sidebarCollapse {
display: block;
width: 45px;
height: 65px;
height: 66px;
background-image: none;
background-color: $primary;
border-color: transparent !important;
box-shadow: 0 2px 2px 0 rgba(38,50,56,.16), 0 0 2px 0 rgba(38,50,56,.12);
outline: none;
@ -132,7 +128,7 @@ a[data-toggle="collapse"] {
height: 2px;
margin: 0 auto;
display: block;
background: $black;
background: $white;
transition: all 0.8s;
}

71
apps/explorer_web/assets/css/explorer/_wrapper.scss
Unescape View File

@ -1,71 +0,0 @@
.wrapper {
display: flex;
align-items: stretch;
height: 100vh !important;
}
#content {
width: 100%;
display: flex;
flex-direction: column;
min-height: 100vh;
transition: all 0.3s;
transition: all 0.6s cubic-bezier(0.945, 0.020, 0.270, 0.665);
position: absolute;
right: 0px;
@media (min-width: 768px) {
position: static;
}
}
.content-container {
padding-top: 90px;
@media (max-width: 768px){
padding-top: 40px;
}
}
.content-header {
width: calc(100% - 200px);
display: flex;
z-index: 1000;
@media (min-width: 768px){
position: absolute;
}
}
.container {
&__section {
display: block;
padding: 0 15px;
margin: 0 10px;
}
}
@media (min-width: 768px) {
.container {
&__section {
&--partitioned {
display: flex;
justify-content: space-between;
align-items: stretch;
}
}
&__subsection {
flex: 1;
margin-right: 10px;
& + & { margin-left: 5px; }
}
}
}

2
apps/explorer_web/assets/css/theme/_neutral-variables.scss
Unescape View File

@ -640,7 +640,7 @@ $navbar-dark-disabled-color: rgba($white, .25) !default;
$navbar-dark-toggler-icon-bg: str-replace(url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='#{$navbar-dark-color}' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"), "#", "%23") !default;
$navbar-dark-toggler-border-color: rgba($white, .1) !default;
$navbar-light-color: rgba($black, .5) !default;
$navbar-light-color: $gray-200 !default;
$navbar-light-hover-color: rgba($black, .7) !default;
$navbar-light-active-color: rgba($black, .9) !default;
$navbar-light-disabled-color: rgba($black, .3) !default;

2
apps/explorer_web/assets/js/lib/sidebar.js
Unescape View File

@ -1,4 +1,4 @@
$('#sidebarCollapse').on('click', function () {
$('#sidebar').toggleClass('active')
$('#sidebar--container').toggleClass('active')
$(this).toggleClass('active')
})

16
apps/explorer_web/lib/explorer_web/templates/layout/app.html.eex
Unescape View File

@ -9,9 +9,10 @@
</head>
<body>
<div class="wrapper wrapper-overflow">
<div class="content-wrapper">
<!-- Sidebar Holder -->
<nav id="sidebar" class="sticky fixed-top">
<div id="sidebar--container">
<nav id="sidebar">
<div class="sidebar-header">
<%= link to: chain_path(@conn, :show), "data-test": "header_logo" do %>
<img class="" src="<%= static_path(@conn, "/images/logo.svg") %>" />
@ -37,9 +38,10 @@
</div>
</div>
</nav>
</div>
<!-- Page Content Holder -->
<div id="content" class="size-content">
<div class="content-header sticky fixed-top">
<div id="content">
<div class="content-header">
<nav>
<button type="button" id="sidebarCollapse" class="navbar-btn" data-test="hamburger_menu_button">
<span></span>
@ -56,7 +58,7 @@
<%= search_input f, :q, class: 'header__cell--search-input', placeholder: gettext "Search by address, transaction hash, or block number" %>
<% end %>
</div>
<div class="header__cell header__cell--links" align="right">
<div class="header__cell header__cell--links u-nudge-top" align="right">
<a href="https://www.facebook.com/PoaNetwork/" target="_blank" class="header__link">
<div class="social-media">
<i class="fa fa-facebook-f"></i>
@ -71,7 +73,7 @@
<div class="social-media">
<i class="fa fa-twitter"></i>
</div>
</a>
</a>
</div>
</div>
</div>
@ -82,9 +84,9 @@
<p class="alert alert-info" role="alert"><%= get_flash(@conn, :info) %></p>
<p class="alert alert-danger" role="alert"><%= get_flash(@conn, :error) %></p>
<%= render @view_module, @view_template, assigns %>
<%= render ExplorerWeb.LayoutView, "_footer.html", assigns %>
</main>
</div>
<%= render ExplorerWeb.LayoutView, "_footer.html", assigns %>
<!-- <%= render ExplorerWeb.LayoutView, "_footer.html", assigns %> -->
</div>
<script src="<%= static_path(@conn, "/js/app.js") %>"></script>

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

@ -17,7 +17,7 @@ msgid "Block"
msgstr ""
#: lib/explorer_web/templates/chain/show.html.eex:58
#: lib/explorer_web/templates/layout/app.html.eex:24
#: lib/explorer_web/templates/layout/app.html.eex:25
msgid "Blocks"
msgstr ""
@ -56,7 +56,7 @@ msgstr ""
#: lib/explorer_web/templates/chain/show.html.eex:45
#: lib/explorer_web/templates/chain/show.html.eex:72
#: lib/explorer_web/templates/chain/show.html.eex:99
#: lib/explorer_web/templates/layout/app.html.eex:30
#: lib/explorer_web/templates/layout/app.html.eex:31
#: lib/explorer_web/templates/pending_transaction/index.html.eex:12
#: lib/explorer_web/templates/transaction/index.html.eex:12
msgid "Transactions"
@ -223,7 +223,7 @@ msgstr ""
msgid "Showing %{count} Transactions"
msgstr ""
#: lib/explorer_web/templates/layout/app.html.eex:35
#: lib/explorer_web/templates/layout/app.html.eex:36
#: lib/explorer_web/templates/pending_transaction/index.html.eex:19
#: lib/explorer_web/templates/transaction/index.html.eex:19
#: lib/explorer_web/templates/transaction/overview.html.eex:56
@ -339,7 +339,7 @@ msgstr ""
msgid "Internal Transactions"
msgstr ""
#: lib/explorer_web/templates/layout/app.html.eex:56
#: lib/explorer_web/templates/layout/app.html.eex:58
msgid "Search by address, transaction hash, or block number"
msgstr ""
@ -381,7 +381,7 @@ msgstr ""
msgid "Fee"
msgstr ""
#: lib/explorer_web/templates/layout/app.html.eex:34
#: lib/explorer_web/templates/layout/app.html.eex:35
msgid "Validated"
msgstr ""

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

@ -29,7 +29,7 @@ msgid "Block"
msgstr "Block"
#: lib/explorer_web/templates/chain/show.html.eex:58
#: lib/explorer_web/templates/layout/app.html.eex:24
#: lib/explorer_web/templates/layout/app.html.eex:25
msgid "Blocks"
msgstr "Blocks"
@ -68,7 +68,7 @@ msgstr "POA Network Explorer"
#: lib/explorer_web/templates/chain/show.html.eex:45
#: lib/explorer_web/templates/chain/show.html.eex:72
#: lib/explorer_web/templates/chain/show.html.eex:99
#: lib/explorer_web/templates/layout/app.html.eex:30
#: lib/explorer_web/templates/layout/app.html.eex:31
#: lib/explorer_web/templates/pending_transaction/index.html.eex:12
#: lib/explorer_web/templates/transaction/index.html.eex:12
msgid "Transactions"
@ -235,7 +235,7 @@ msgstr "Showing #%{start_block} to #%{end_block}"
msgid "Showing %{count} Transactions"
msgstr "Showing %{count} Transactions"
#: lib/explorer_web/templates/layout/app.html.eex:35
#: lib/explorer_web/templates/layout/app.html.eex:36
#: lib/explorer_web/templates/pending_transaction/index.html.eex:19
#: lib/explorer_web/templates/transaction/index.html.eex:19
#: lib/explorer_web/templates/transaction/overview.html.eex:56
@ -351,7 +351,7 @@ msgstr ""
msgid "Internal Transactions"
msgstr ""
#: lib/explorer_web/templates/layout/app.html.eex:56
#: lib/explorer_web/templates/layout/app.html.eex:58
msgid "Search by address, transaction hash, or block number"
msgstr ""
@ -393,7 +393,7 @@ msgstr ""
msgid "Fee"
msgstr ""
#: lib/explorer_web/templates/layout/app.html.eex:34
#: lib/explorer_web/templates/layout/app.html.eex:35
msgid "Validated"
msgstr ""

Write Preview
Loading…
Cancel
Save