v0.0.4

css/main.css

@@ -14,7 +14,7 @@
 }
 
 body {
-  font-size: 16px;
+  font-size: 14px;
 }
 
 input[type=text]::-ms-clear {
@@ -124,7 +124,7 @@ section header h1 {
 }
 
 section header .border {
-  height: 0.4em;
+  height: 0.3rem;
   width: 50%;
   background: var(--primary-color);
 }
@@ -202,7 +202,7 @@ section .dark-background {
   right: 0;
   font-size: 12rem;
   text-align: right;
-  opacity: 0.1;
+  opacity: 0.06;
   line-height: 1em;
 }
 
@@ -276,7 +276,7 @@ section .dark-background {
 }
 
 .transaction .transaction-header .border {
-  height: 0.3em;
+  height: 0.2em;
   width: 50%;
   background: var(--primary-color);
 }
@@ -304,6 +304,7 @@ section .dark-background {
   text-transform: uppercase;
   margin-bottom: 0.4em;
   opacity: 0.8;
+  font-size: 0.7em;
 }
 
 .transaction h4 {
@@ -329,6 +330,9 @@ section .dark-background {
 }
 
 @media only screen and (min-width: 640px) {
+  body {
+    font-size: 16px;
+  }
   .padding {
     padding: 0 6vw;
   }
@@ -400,10 +404,6 @@ section .dark-background {
   .margin {
     margin: 0 24vw;
   }
-  #top_transaction_container {
-    -ms-grid-columns: (1fr)[6];
-        grid-template-columns: repeat(6, 1fr);
-  }
 }
 
 @media only screen and (max-width: 320px) {

css/main.scss

@@ -11,7 +11,7 @@
     --primary-color: #00A7B4;
 }
 body{
-    font-size: 16px;
+    font-size: 14px;
 }
 input[type=text]::-ms-clear {  display: none; width : 0; height: 0; }
 input[type=text]::-ms-reveal {  display: none; width : 0; height: 0; }
@@ -81,7 +81,7 @@ section{
             font-size: 1.5rem;
         }
         .border{
-            height: 0.4em;
+            height: 0.3rem;
             width: 50%;
             background: var(--primary-color);
         }
@@ -142,7 +142,7 @@ section{
         right: 0;
         font-size: 12rem;
         text-align: right;
-        opacity: 0.1;
+        opacity: 0.06;
         line-height: 1em;
     }
 }
@@ -197,7 +197,7 @@ section{
             letter-spacing: 0.06em;
         }
         .border{
-            height: 0.3em;
+            height: 0.2em;
             width: 50%;
             background: var(--primary-color);
         }
@@ -221,6 +221,7 @@ section{
         text-transform: uppercase;
         margin-bottom: 0.4em;
         opacity: 0.8;
+        font-size: 0.7em;
     }  
     h4{
         cursor: pointer;
@@ -243,6 +244,9 @@ section{
     }
 }
 @media only screen and (min-width: 640px){
+    body{
+        font-size: 16px;
+    }
     .padding{
         padding: 0 6vw;
     }
@@ -310,9 +314,6 @@ section{
     .margin{
         margin: 0 24vw;
     }
-    #top_transaction_container{
-        grid-template-columns: repeat(6, 1fr);
-    }
 }
 @media only screen and (max-width: 320px){
     body{

index.html

@@ -114,26 +114,6 @@
                     <h4 class="breakable">FDhQizsksSHs4dyJBeLqGcbyuEg163jhXi</h4>
                     <h3>₹0.000000007</h3>
                 </div>
-                <div class="transaction">
-                    <div class="transaction-header grid grid-2">
-                        <div>
-                            <h5>Token transfer</h5>
-                            <h2>Rupee</h2>
-                            <div class="border"></div>
-                        </div>
-                        <div class="icon">
-                            <svg  viewBox="0 0 64 64">
-                                <title>More infomation icon</title>
-                                <path d="M32,0A32,32,0,1,0,64,32,32,32,0,0,0,32,0Zm3.07,47.91a3.1,3.1,0,0,1-6.19,0V26.55a3.1,3.1,0,0,1,6.19,0Zm-.49-29.27a3.46,3.46,0,0,1-2.59.93,3.46,3.46,0,0,1-2.59-.93,3.22,3.22,0,0,1-.9-2.33,3.3,3.3,0,0,1,.9-2.37A3.43,3.43,0,0,1,32,13a3.43,3.43,0,0,1,2.59.94,3.27,3.27,0,0,1,.92,2.37A3.2,3.2,0,0,1,34.58,18.64Z"/>
-                            </svg>
-                        </div>
-                    </div>
-                    <h5>From</h5>
-                    <h4 class="breakable">FDhQizsksSHs4dyJBeLqGcbyuEg163jhXi</h4>
-                    <h5>to</h5>
-                    <h4 class="breakable">FDhQizsksSHs4dyJBeLqGcbyuEg163jhXi</h4>
-                    <h3>₹0.000000007</h3>
-                </div>
             </div>
         </section>
     </main>