Merge pull request #272 from mantlenetworkio/hotfix/v0.8.3

merge v0.8.3 into main

apps/block_scout_web/assets/css/_typography.scss

@@ -13,18 +13,6 @@ $success: #34c0ad !default;
   font-weight: bold;
 }
 
-@font-face {
-  font-family: 'icomoon';
-  src:  url('./icomoon/fonts/icomoon.eot');
-  src:  url('./icomoon/fonts/icomoon.eot') format('embedded-opentype'),
-    url('./icomoon/fonts/icomoon.ttf') format('truetype'),
-    url('./icomoon/fonts/icomoon.woff') format('woff'),
-    url('./icomoon/fonts/icomoon.svg') format('svg');
-  font-weight: normal;
-  font-style: normal;
-  font-display: block;
-}
-
 body {
   font-family: $font-family;
   font-size: 12px;

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

@@ -17,6 +17,7 @@ $alert-danger-color: #ff7986 !default;
     align-items: center;
     padding-top:12px !important;
     padding-bottom:12px !important;
+    width:100%;
     span {
         color: #3F7470;
         padding:0;

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

@@ -56,9 +56,9 @@ $dropdown-menu-background: #cbe9e7;
   &[target='_blank']{
     padding-right: 20px;
     &:after{
-      font-family: 'icomoon';
-      content: "\e901";
-      font-size: 20px;
+      content: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13 8.5L9 8.5C7.89543 8.5 7 9.39543 7 10.5L7 14' stroke='%2315181C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M12 6L14.5 8.5L12 11' stroke='%2315181C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
+      width: 20px;
+      height: 20px;
       position: absolute;
       right: 5px;
       top: 50%;

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

@@ -538,4 +538,32 @@
 	justify-content: center;
 	display: flex;
 	background: rgba($primary, 0.1) !important;
+
+	position: relative;
+	display: grid !important;
+	grid-template-columns: repeat(4, minmax(0, 1fr));
+	grid-auto-rows:1fr;
+	gap: 16px;
+
+	@media screen and (max-width: 1199px) {
+		grid-template-columns: repeat(3, minmax(0, 1fr));
+	}
+	@media screen and (max-width: 991px) {
+		grid-template-columns: repeat(4, minmax(0, 1fr));
+	}
+	@media screen and (max-width: 767px) {
+		grid-template-columns: repeat(2, minmax(0, 1fr));
+	}
+
+	.dz-message-wrapper{
+		position: absolute;
+		left: 50%;
+		transform: translateX(-50%);
+	}
+	.dz-image{
+		margin: 0 auto;
+	}
+	.dz-preview{
+		margin: 0;
+	}
 }

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

@@ -68,9 +68,38 @@ $navbar-network-label-background-color: #bae1d7;
         padding-left: $header-link-horizontal-padding;
         padding-right: $header-link-horizontal-padding;
         width: fit-content;
+        &+.dropdown-menu{
+          .dropdown-item{
+            display: flex;
+            align-items: center;
+            justify-content: flex-start;
+            .nav-link-icon{
+              display: none;
+              align-items: center;
+              justify-content: center;
+              filter: drop-shadow(0px 0px 5px #06dd76);
+              border: 1px solid #06dd76;
+              border-radius: 6px;
+              margin-right: 8px;
+              circle{
+                fill: #06dd76;
+              }
+            }
+            &.active .nav-link-icon{
+              display: flex;
+            }
+          }
+        }
         @media (min-width: 992px) {
           margin: 0 10px;
         }
+        &:hover{
+          .dropdown-toggle-icon{
+            path{
+              stroke: #21413f;
+            }
+          }
+        }
         &.active,
         &:hover,
         &.active-icon {
@@ -129,9 +158,32 @@ $navbar-network-label-background-color: #bae1d7;
     }
   }
   .navbar-nav-custom {
+    .dropdown-toggle{
+      .dropdown-toggle-icon{
+        width: 13px;
+        height: 12px;
+        margin-left: 4px;
+        transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
+        path{
+          transition: all 0.4s ease-in-out;
+          stroke:#21413f;
+        }
+      }
+      &[aria-expanded="true"]{
+        .dropdown-toggle-icon{
+          transform: rotate(180deg);
+        }
+      }
+      &:hover{
+        .dropdown-toggle-icon{
+          path{
+            stroke:white;
+          }
+        }
+      }
+    }
     .dropdown-toggle::after {
-      font-family: 'icomoon';
-      content: "\e900";
+      display: none;
       border: none;
     }
   }

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

@@ -186,6 +186,11 @@ $tile-body-a-color: #007bff;
 }
 
 .tile {
+  [data-test="chain_transaction"]{
+    a[data-test="address_hash_link"]{
+      display: inline-block;
+    }
+  }
   span[data-address-hash] {
     color: $tile-body-a-color;
   }

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

@@ -2,7 +2,7 @@ $tooltip-background-color: #CBE9E7 !default;
 $tooltip-color: #fff !default;
 
 .tooltip {
-  max-width: 335px;
+  max-width: 340px;
   min-width: 100px;
   opacity: 1 !important;
 
@@ -12,7 +12,7 @@ $tooltip-color: #fff !default;
     color: #15181C;
     padding: 15px;
     font-size: 12px;
-    max-width: 335px;
+    max-width: 340px;
   }
 
   .arrow::before {