feat(homepage): applied new dimensions and refactor

edenia · Nov 16, 2022 · d6e36a6 · d6e36a6
1 parent 54afefb
commit d6e36a6
Show file tree

Hide file tree

Showing 3 changed files with 162 additions and 174 deletions.
diff --git a/docs/images/bgimage.png b/docs/images/bgimage.png
diff --git a/docs/index.html b/docs/index.html
@@ -87,8 +87,6 @@
 
 <body>
   <div class="header">
-    <div class="section-wrapper">
-      <img alt="logo" id="bg-image" src="./images/test1.webp" />
       <div class="image-box">
         <img alt="name" id="middle-logo" src="./images/antelope-tools.svg" />
         <img alt="bg" id="bg-image-mobile" src="./images/background-mobile.png" />
@@ -116,70 +114,75 @@
           <div class="visit-text">Visit our network dashboards</div>
         </a>
       </div>
-      <div class="box-network">
-        <div class="flex2">
-          <div class="flex-text">
-            <div class="Line-5"></div>
-            <p id="nav">
-              Mainnets
-            </p>
-          </div>
-        </div>
-        <div id="network-desktop">
-          <section>
-            <div class="grid">
-              <a class="grid-item" href="https://eos.antelope.tools/"><img alt="EOSIO" height="188.3px"
-                  src="./images/eos-grid.png" width="197.9px" /><span class="name-networks">EOS Mainnet</span></a>
-              <a class="grid-item" href="https://proton.antelope.tools/"><img alt="Proton Mainnet" height="188.3px"
-                  src="./images/proton-grid.png" width="169.5px" /><span class="name-networks">Proton Mainnet</span></a>
-              <a class="grid-item" href="https://wax.antelope.tools/"><img alt="Wax Mainnet" height="188.3px"
-                  src="./images/wax-grid.png" width="188.3px" /><span class="name-networks">Wax
-                  Mainnet</span></a>
-              <a class="grid-item" href="https://telos.antelope.tools/"><img alt="Telos Mainnet" height="188.3px"
-                  src="./images/telos-grid.png" width="188.3px" /><span class="name-networks">Telos Mainnet</span></a>
-              <a class="grid-item" href="https://libre.antelope.tools/"><img alt="Libre Mainnet" height="188.3px"
-                  src="./images/libre.png" width="188.3px" /><span class="name-networks">Libre Mainnet</span></a>
-              <a class="grid-item" href="https://lacchain.antelope.tools/"><img alt="LACChain EOSIO" height="188.3px"
-                  src="./images/lacchain-grid.png" width="160px" />
-                <span class="name-networks">LACChain EOSIO</span>
-              </a>
-          </section>
+  </div>
+
+
+  <div id="divider-line"></div>
+  <div id="networks">
+    <div class="box-network">
+      <div class="flex2">
+        <div class="flex-text">
+          <div class="Line-5"></div>
+          <p id="nav">
+            Mainnets
+          </p>
         </div>
       </div>
-      <div class="box-network">
-        <div class="flex2">
-          <div class="flex-text">
-            <div class="Line-5"></div>
-            <p>
-              Testnets
-            </p>
-          </div>
-        </div>
-        <div id="network-desktop">
-          <section>
-            <div class="grid">
-              <a class="grid-item" href="https://jungle.antelope.tools/"><img alt="Jungle4 Testnet" height="188.1px"
-                  src="./images/jungle-grid.png" width="127.9px" /><span class="name-networks">Jungle4 Testnet</span></a>
-              <a class="grid-item" href="https://proton-testnet.antelope.tools/"><img alt="Proton Mainnet"
-                  height="188.1px" src="./images/proton-grid.png" width="169.3px" /><span class="name-networks">Proton
-                  Testnet</span></a>
-              <a class="grid-item" href="https://wax-testnet.antelope.tools/"><img alt="Wax Mainnet" height="188.1px"
-                  src="./images/wax-grid.png" width="188.1px" /><span class="name-networks">Wax
-                  Testnet</span></a>
-              <a class="grid-item" href="https://telos-testnet.antelope.tools/"><img alt="Telos Mainnet"
-                  height="188.1px" src="./images/telos-grid.png" width="188.1px" /><span class="name-networks">Telos
-                  Testnet</span></a>
-              <a class="grid-item" href="https://libre.antelope.tools/"><img alt="Libre Mainnet" height="188.1px"
-                  src="./images/libre.png" width="188.1px" /><span class="name-networks">Libre Mainnet</span></a>
-              <a class="grid-item" href="https://ultra-testnet.antelope.tools/"><img alt="Ultra Testnet"
-                  height="188.1px" src="./images/ultra-grid.png" width="188.1px" />
-                <span class="name-networks">Ultra Testnet</span>
-              </a>
-          </section>
+      <div id="network-desktop">
+        <section>
+          <div class="grid">
+            <a class="grid-item" href="https://eos.antelope.tools/"><img alt="EOSIO" height="188.3px"
+                src="./images/eos-grid.png" width="197.9px" /><span class="name-networks">EOS Mainnet</span></a>
+            <a class="grid-item" href="https://proton.antelope.tools/"><img alt="Proton Mainnet" height="188.3px"
+                src="./images/proton-grid.png" width="169.5px" /><span class="name-networks">Proton Mainnet</span></a>
+            <a class="grid-item" href="https://wax.antelope.tools/"><img alt="Wax Mainnet" height="188.3px"
+                src="./images/wax-grid.png" width="188.3px" /><span class="name-networks">Wax
+                Mainnet</span></a>
+            <a class="grid-item" href="https://telos.antelope.tools/"><img alt="Telos Mainnet" height="188.3px"
+                src="./images/telos-grid.png" width="188.3px" /><span class="name-networks">Telos Mainnet</span></a>
+            <a class="grid-item" href="https://libre.antelope.tools/"><img alt="Libre Mainnet" height="188.3px"
+                src="./images/libre.png" width="188.3px" /><span class="name-networks">Libre Mainnet</span></a>
+            <a class="grid-item" href="https://lacchain.antelope.tools/"><img alt="LACChain EOSIO" height="188.3px"
+                src="./images/lacchain-grid.png" width="160px" />
+              <span class="name-networks">LACChain EOSIO</span>
+            </a>
+        </section>
+      </div>
+    </div>
+    <div class="box-network">
+      <div id="flex2">
+        <div class="flex-text">
+          <div class="Line-5"></div>
+          <p>
+            Testnets
+          </p>
         </div>
       </div>
+      <div id="network-desktop">
+        <section>
+          <div class="grid">
+            <a class="grid-item" href="https://jungle.antelope.tools/"><img alt="Jungle4 Testnet" height="188.1px"
+                src="./images/jungle-grid.png" width="127.9px" /><span class="name-networks">Jungle4 Testnet</span></a>
+            <a class="grid-item" href="https://proton-testnet.antelope.tools/"><img alt="Proton Mainnet"
+                height="188.1px" src="./images/proton-grid.png" width="169.3px" /><span class="name-networks">Proton
+                Testnet</span></a>
+            <a class="grid-item" href="https://wax-testnet.antelope.tools/"><img alt="Wax Mainnet" height="188.1px"
+                src="./images/wax-grid.png" width="188.1px" /><span class="name-networks">Wax
+                Testnet</span></a>
+            <a class="grid-item" href="https://telos-testnet.antelope.tools/"><img alt="Telos Mainnet" height="188.1px"
+                src="./images/telos-grid.png" width="188.1px" /><span class="name-networks">Telos
+                Testnet</span></a>
+            <a class="grid-item" href="https://libre-testnet.antelope.tools/"><img alt="Libre Mainnet" height="188.1px"
+                src="./images/libre.png" width="188.1px" /><span class="name-networks">Libre Testnet</span></a>
+            <a class="grid-item" href="https://ultra-testnet.antelope.tools/"><img alt="Ultra Testnet" height="188.1px"
+                src="./images/ultra-grid.png" width="188.1px" />
+              <span class="name-networks">Ultra Testnet</span>
+            </a>
+        </section>
+      </div>
     </div>
   </div>
+
   <div class="content">
     <div class="section-wrapper">
       <div class="box-paragraph">