Update index.html

etcswap · Sep 12, 2024 · 755f7b2 · 755f7b2
1 parent 8d6c4fe
commit 755f7b2
Showing 1 changed file with 37 additions and 17 deletions.
diff --git a/index.html b/index.html
@@ -85,6 +85,43 @@ <h1 style="color: rgb(151,151,151);font-size: 20px;margin: 34px;font-family: Bas
                                 <p style="font-family: 'Basel Book';color: rgb(155,155,155);">Multiple fee tiers, enable Liquidity Providers to receive suitable compensation based on the differing levels of risk they assume.</p>
                             </div>
                         </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col">
+                <div class="card bg-transparent">
+                    <div class="card-body p-4">
+                        <div class="d-flex align-items-center align-items-md-center align-items-xl-center" style="background: #1b1b1b;padding: 24px;min-height: 250px;border-radius: 24px;border-style: solid;border-color: rgba(255,255,255,0.07);margin-top: 24px;margin-bottom: 24px;">
+                            <div>
+                                <div class="bs-icon-md bs-icon-circle bs-icon-primary-light d-flex justify-content-center align-items-center d-inline-block mb-3 bs-icon"><i class="icon ion-waterdrop text-primary"></i></div>
+                                <p style="font-family: 'Basel Book';color: rgb(255,255,255);font-size: 24px;">Concentrated Liquidity</p>
+                                <p style="font-family: 'Basel Book';color: rgb(155,155,155);">Concentrated Liquidity grants individual Liquidity Providers precise control over the price ranges where their capital is allocated. Each provider’s positions are amalgamated into a unified pool, creating a singular curve for users to execute trades against.</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col">
+                <div class="card bg-transparent">
+                    <div class="card-body p-4">
+                        <div class="d-flex align-items-center align-items-md-center align-items-xl-center" style="background: #1b1b1b;padding: 24px;min-height: 250px;border-radius: 24px;border-style: solid;border-color: rgba(255,255,255,0.07);margin-top: 24px;margin-bottom: 24px;">
+                            <div>
+                                <div class="bs-icon-md bs-icon-circle bs-icon-primary-light d-flex justify-content-center align-items-center d-inline-block mb-3 bs-icon"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-rss text-primary">
+                                        <path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2z"></path>
+                                        <path d="M5.5 12a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-3-8.5a1 1 0 0 1 1-1c5.523 0 10 4.477 10 10a1 1 0 1 1-2 0 8 8 0 0 0-8-8 1 1 0 0 1-1-1m0 4a1 1 0 0 1 1-1 6 6 0 0 1 6 6 1 1 0 1 1-2 0 4 4 0 0 0-4-4 1 1 0 0 1-1-1"></path>
+                                    </svg></div>
+                                <p style="font-family: 'Basel Book';color: rgb(255,255,255);font-size: 24px;">On-Chain Price Oracles</p>
+                                <p style="font-family: 'Basel Book';color: rgb(155,155,155);">V3 oracles are capable of providing time-weighted average prices (TWAPs) on demand for any period within the last ~9 days.</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="row gy-4 row-cols-1 row-cols-md-2 row-cols-xl-3">
+            <div class="col">
+                <div class="card bg-transparent">
+                    <div class="card-body p-4">
                         <div class="d-flex align-items-center align-items-md-center align-items-xl-center" style="background: #1b1b1b;padding: 24px;min-height: 250px;border-radius: 24px;border-style: solid;border-color: rgba(255,255,255,0.07);margin-top: 24px;margin-bottom: 24px;">
                             <div>
                                 <div class="bs-icon-md bs-icon-circle bs-icon-primary-light d-flex justify-content-center align-items-center d-inline-block mb-3 bs-icon"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-cash-coin text-primary">
@@ -103,13 +140,6 @@ <h1 style="color: rgb(151,151,151);font-size: 20px;margin: 34px;font-family: Bas
             <div class="col">
                 <div class="card bg-transparent">
                     <div class="card-body p-4">
-                        <div class="d-flex align-items-center align-items-md-center align-items-xl-center" style="background: #1b1b1b;padding: 24px;min-height: 250px;border-radius: 24px;border-style: solid;border-color: rgba(255,255,255,0.07);margin-top: 24px;margin-bottom: 24px;">
-                            <div>
-                                <div class="bs-icon-md bs-icon-circle bs-icon-primary-light d-flex justify-content-center align-items-center d-inline-block mb-3 bs-icon"><i class="icon ion-waterdrop text-primary"></i></div>
-                                <p style="font-family: 'Basel Book';color: rgb(255,255,255);font-size: 24px;">Concentrated Liquidity</p>
-                                <p style="font-family: 'Basel Book';color: rgb(155,155,155);">Concentrated Liquidity grants individual Liquidity Providers precise control over the price ranges where their capital is allocated. Each provider’s positions are amalgamated into a unified pool, creating a singular curve for users to execute trades against.</p>
-                            </div>
-                        </div>
                         <div class="d-flex align-items-center align-items-md-center align-items-xl-center" style="background: #1b1b1b;padding: 24px;min-height: 250px;border-radius: 24px;border-style: solid;border-color: rgba(255,255,255,0.07);margin-top: 24px;margin-bottom: 24px;">
                             <div>
                                 <div class="bs-icon-md bs-icon-circle bs-icon-primary-light d-flex justify-content-center align-items-center d-inline-block mb-3 bs-icon"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-crosshair text-primary">
@@ -125,16 +155,6 @@ <h1 style="color: rgb(151,151,151);font-size: 20px;margin: 34px;font-family: Bas
             <div class="col">
                 <div class="card bg-transparent">
                     <div class="card-body p-4">
-                        <div class="d-flex align-items-center align-items-md-center align-items-xl-center" style="background: #1b1b1b;padding: 24px;min-height: 250px;border-radius: 24px;border-style: solid;border-color: rgba(255,255,255,0.07);margin-top: 24px;margin-bottom: 24px;">
-                            <div>
-                                <div class="bs-icon-md bs-icon-circle bs-icon-primary-light d-flex justify-content-center align-items-center d-inline-block mb-3 bs-icon"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-rss text-primary">
-                                        <path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2z"></path>
-                                        <path d="M5.5 12a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-3-8.5a1 1 0 0 1 1-1c5.523 0 10 4.477 10 10a1 1 0 1 1-2 0 8 8 0 0 0-8-8 1 1 0 0 1-1-1m0 4a1 1 0 0 1 1-1 6 6 0 0 1 6 6 1 1 0 1 1-2 0 4 4 0 0 0-4-4 1 1 0 0 1-1-1"></path>
-                                    </svg></div>
-                                <p style="font-family: 'Basel Book';color: rgb(255,255,255);font-size: 24px;">On-Chain Price Oracles</p>
-                                <p style="font-family: 'Basel Book';color: rgb(155,155,155);">V3 oracles are capable of providing time-weighted average prices (TWAPs) on demand for any period within the last ~9 days.</p>
-                            </div>
-                        </div>
                         <div class="d-flex align-items-center align-items-md-center align-items-xl-center" style="background: #1b1b1b;padding: 24px;min-height: 250px;border-radius: 24px;border-style: solid;border-color: rgba(255,255,255,0.07);margin-top: 24px;margin-bottom: 24px;">
                             <div>
                                 <div class="bs-icon-md bs-icon-circle bs-icon-primary-light d-flex justify-content-center align-items-center d-inline-block mb-3 bs-icon"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16" class="bi bi-bar-chart-fill text-primary">