From 55ef11254d4f7ab0bb93962b592cba8a0dd088ad Mon Sep 17 00:00:00 2001
From: maxgrapps <maxgrapps@gmail.com>
Date: Wed, 3 Jul 2019 19:35:47 +0300
Subject: [PATCH] dashboard fix for md resolution, transactions load fix

---
 .../css/components/_dashboard-banner.scss     | 14 +++++++++----
 .../assets/css/components/_tile.scss          | 21 +++++++++++++++++++
 2 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/apps/block_scout_web/assets/css/components/_dashboard-banner.scss b/apps/block_scout_web/assets/css/components/_dashboard-banner.scss
index ecde4e882b..33d104a9fd 100644
--- a/apps/block_scout_web/assets/css/components/_dashboard-banner.scss
+++ b/apps/block_scout_web/assets/css/components/_dashboard-banner.scss
@@ -146,6 +146,11 @@ $dashboard-banner-chart-axis-font-color: $dashboard-stats-item-value-color !defa
   width: 750px;
   position: relative;
 
+  @include media-breakpoint-down(lg) {
+    margin-top: 15px;
+    width: 550px;
+  }
+
   @include media-breakpoint-down(md) {
     border-top-right-radius: 10px;
     height: auto;
@@ -157,10 +162,6 @@ $dashboard-banner-chart-axis-font-color: $dashboard-stats-item-value-color !defa
     box-shadow: 0 0 35px 0 rgba(0, 0, 0, 0.2);
   }
 
-  @include media-breakpoint-down(lg) {
-    margin-top: 15px;
-  }
-
   @include media-breakpoint-down(sm) {
     width: 100%;
   }
@@ -189,6 +190,11 @@ $dashboard-banner-chart-axis-font-color: $dashboard-stats-item-value-color !defa
   display: grid;
   grid-template-columns: 1fr 1fr 1fr 1fr;
 
+  @include media-breakpoint-down(lg) {
+    grid-template-columns: 1fr 1fr;
+    row-gap: 20px;
+  }
+
   @include media-breakpoint-down(md) {
     grid-template-columns: 1fr;
     row-gap: 20px;
diff --git a/apps/block_scout_web/assets/css/components/_tile.scss b/apps/block_scout_web/assets/css/components/_tile.scss
index 68b873334c..8965715727 100644
--- a/apps/block_scout_web/assets/css/components/_tile.scss
+++ b/apps/block_scout_web/assets/css/components/_tile.scss
@@ -272,6 +272,7 @@ $tile-body-a-color: #5959d8 !default;
   }
 
   &.tile-type-block {
+    max-width: 100%;
     .tile-title {
       font-weight: 700;
       line-height: 1.2;
@@ -330,3 +331,23 @@ $tile-body-a-color: #5959d8 !default;
     }
   }
 }
+
+.card-chain-blocks {
+  .card-body {
+    .col-lg-3 {
+      @include media-breakpoint-down(lg) {
+        padding-left: 6px;
+        padding-right: 6px;
+      }
+      .tile-type-block {
+        overflow: hidden;
+      }
+    }
+    .row {
+      @include media-breakpoint-down(lg) {
+        margin-left: -6px;
+        margin-right: -6px;
+      }
+    }
+  }
+}