Updated pool summary page to display more info on hashrate and blocks

frontend/src/app/components/pool/pool.component.scss

@@ -36,6 +36,7 @@
   @media (max-width: 768px) {
     margin-bottom: 10px;
   }
+  height: 400px;
 }
 
 div.scrollable {
@@ -52,15 +53,22 @@ div.scrollable {
 }
 
 .label {
-  width: 30%;
+  width: 25%;
+  @media (min-width: 767.98px) {
+    vertical-align: middle;
+  }
   @media (max-width: 767.98px) {
     font-weight: bold;
   }
 }
+.label.addresses {
+  vertical-align: top;
+  padding-top: 25px;
+}
 
 .data {
   text-align: right;
-  padding-left: 25%;
+  padding-left: 5%;
   @media (max-width: 992px) {
     text-align: left;
     padding-left: 12px;
@@ -114,10 +122,6 @@ div.scrollable {
   }
 }
 
-.fees {
-  width: 0%;  
-}
-
 .size {
   width: 12%;
   @media (max-width: 1000px) {
@@ -146,6 +150,10 @@ div.scrollable {
 .skeleton-loader {
   max-width: 200px;
 }
+.skeleton-loader.data {
+  max-width: 70px;
+}
+
 
 .loadingGraphs {
   position: absolute;
@@ -159,8 +167,34 @@ div.scrollable {
 
 .small-button {
   height: 20px;
-  transform: translateY(-20px);
   font-size: 10px;
   padding-top: 0;
   padding-bottom: 0;
+  transform: translateY(-20px);
+  @media (min-width: 767.98px) {
+    transform: translateY(-17px);
+  }
+}
+
+.block-count-title {
+  color: #4a68b9;
+  font-size: 14px;
+  text-align: left;
+  @media (max-width: 767.98px) {
+    text-align: center;
+  }
+}
+
+.table-data tr {
+  background-color: transparent;
+}
+.table-data td {
+  text-align: left;
+  @media (max-width: 767.98px) {
+    text-align: center;
+  }
+}
+
+.taller-row {
+  height: 75px;
 }