From f1526e5502f106660e0be81c95f4b723006f296b Mon Sep 17 00:00:00 2001
From: ArcherDilunaire <aurelrichard00@gmail.com>
Date: Fri, 22 Mar 2024 12:36:26 +0100
Subject: [PATCH] added list item to libraries section

---
 public/index.html    | 53 +++++++++++++++++++++++++++++++-------------
 public/style.css     | 11 +++++++--
 public/style.css.map |  2 +-
 scss/style.scss      | 48 +++++++++++++++++++++++++--------------
 4 files changed, 79 insertions(+), 35 deletions(-)

diff --git a/public/index.html b/public/index.html
index b3ca917..db4756f 100644
--- a/public/index.html
+++ b/public/index.html
@@ -256,21 +256,44 @@ <h3> Victor Oliva</h3>
         <div class="line line-h"></div>
         <h2 class="scroll-animate highlight"><span>Our Libraries</span></h2>
         <div class="line line-h" style="transform: translateY(-2px)"></div>
-        <div class="title-wrapper">
-            <h3>Polkadot-API:</h3>
-            <a class="arrow-icon" href="https://github.com/polkadot-api" target="_blank"
-                aria-label="extrenal link to go to the library page">
-                <svg id="a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.01 40" fill="white"
-                    width="24" height="24">
-                    <polygon
-                        points="38.01 0 38.01 0 0 0 0 2.01 36.58 2.01 .04 38.55 1.45 39.96 38.01 3.41 38.01 40 40.01 40 40.01 0 38.01 0" />
-                </svg>
-            </a>
-        </div>
-        <p>Polkadot-API aims to surpass PolkadotJs by offering meticulously crafted, composable libraries aligned with a
-            "light-client first" philosophy. It empowers decentralized app developers, enhancing the overall developer
-            experience and setting a new standard for efficiency, adaptability, and performance in the Polkadot
-            ecosystem.</p>
+        <ul>
+            <li>
+                <div class="title-wrapper">
+                    <h3>Polkadot-API:</h3>
+                    <a class="arrow-icon" href="https://github.com/polkadot-api" target="_blank"
+                        aria-label="extrenal link to go to the library page">
+                        <svg id="a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.01 40"
+                            fill="white" width="24" height="24">
+                            <polygon
+                                points="38.01 0 38.01 0 0 0 0 2.01 36.58 2.01 .04 38.55 1.45 39.96 38.01 3.41 38.01 40 40.01 40 40.01 0 38.01 0" />
+                        </svg>
+                    </a>
+                </div>
+                <p>Polkadot-API aims to surpass PolkadotJs by offering meticulously crafted, composable libraries
+                    aligned with a
+                    "light-client first" philosophy. It empowers decentralized app developers, enhancing the overall
+                    developer
+                    experience and setting a new standard for efficiency, adaptability, and performance in the Polkadot
+                    ecosystem.</p>
+            </li>
+            <li>
+                <div class="title-wrapper">
+                    <h3>React.js:</h3>
+                    <a class="arrow-icon" href="https://github.com/polkadot-api" target="_blank"
+                        aria-label="extrenal link to go to the library page">
+                        <svg id="a" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40.01 40"
+                            fill="white" width="24" height="24">
+                            <polygon
+                                points="38.01 0 38.01 0 0 0 0 2.01 36.58 2.01 .04 38.55 1.45 39.96 38.01 3.41 38.01 40 40.01 40 40.01 0 38.01 0" />
+                        </svg>
+                    </a>
+                </div>
+                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
+                    et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
+                    aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
+                    cillum dolore eu fugiat nulla pariatur.</p>
+            </li>
+        </ul>
     </section>
     <footer id="contact-us">
         <div class="content">
diff --git a/public/style.css b/public/style.css
index ce393d4..14af391 100644
--- a/public/style.css
+++ b/public/style.css
@@ -590,6 +590,14 @@ section.hero .subtitle {
   }
 }
 
+#our-libraries ul {
+  padding: 0;
+}
+#our-libraries ul li {
+  display: block;
+  padding-bottom: var(--margin-1);
+  border-bottom: solid 1px #202740;
+}
 #our-libraries .title-wrapper {
   display: flex;
   align-items: center;
@@ -611,8 +619,7 @@ section.hero .subtitle {
   fill: #0f0f1b;
 }
 #our-libraries p {
-  padding: var(--margin-1);
-  border-bottom: solid 1px #202740;
+  padding: var(--margin-0) var(--margin-1);
 }
 
 footer {
diff --git a/public/style.css.map b/public/style.css.map
index e1ebba3..0f4d351 100644
--- a/public/style.css.map
+++ b/public/style.css.map
@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["../scss/_variables.scss","../scss/_mixins.scss","../scss/style.scss"],"names":[],"mappings":"AAcA;EACI;EACA;EAEA;EACA;EACA;;ACfA;EDSJ;IASQ;IACA;IACA;IACA;;;;AAKR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI,YAnCK;;;AAqCT;EACI,YArCM;;;AAwCV;EACI;EACA;EACA;EACA;EACA;EACA;EACA,YAtDK;EAuDL;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;;;AAGJ;AAAA;EAEI;;;AAGJ;EACI;IAAI;;EACJ;IAAM;;;AAGV;EACI;IAAI;;EACJ;IAAM;;;AEhFV;AAAA;AAAA;EAGI;EACA;;;AAGJ;AAAA;EAEI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA,kBFlBK;EEmBL,OFfM;EEgBN;;;AAGJ;EAKI;EACA;;AALA;EACI;;AAQA;EACI;EACA;;;AAKZ;EACI;;AAEA;EACI,OFtCC;;;AE0CT;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI,kBF1EM;EE2EN,OFlFK;EEmFL;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA,OFhGM;;;AEmGV;EACI;EACA;EAQA,kBF3GM;EE4GN;EACA;EACA;EACA;EACA;EACA;;AAZA;EACI;EACA;EACA;;;AAYR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OFjIM;;AEoIF;EACI,YFnIH;;AEqIG;EAEI,YFvIP;;AE4IL;AACI;EACA;EACA;EACA,YFlJE;;AEoJF;EAEI;EACA;EACA;AACA;EACA;EACA;EACA,YF5JF;;AE+JF;EACI;;AAGJ;EACI;;AAKJ;EACI;;AAEA;EACI;;AAGJ;EACI;;AD3KZ;ECiHJ;IAgEQ;;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA,kBFrMK;EEsML;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI,OFhPN;EEiPM;EACA;;AD5OZ;ECqLJ;IA6DQ;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;EAEA;IACI;;EAGJ;IACI;IACA;;EAGJ;IACI;IACA;IACA;;EAEA;IACI;IACA;IACA;IACA;;EAEA;IACI;;EAGJ;IACI;;EAGJ;IACI,OF/RV;IEgSU;IACA;;EAEA;IACI,OFlSf;;;;AE0ST;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;;AAKZ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;;AAKZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;;AAKJ;EACI;;AAEA;EACI,kBFjXF;EEkXE;EACA;EACA;EACA;EACA;EACA;;;AAQJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGI;EACI;EACA;;AAGA;EACI;EACA;;AAEA;EACI;;AAEJ;EACI;;AAMhB;EACI;EACA,OFrbX;EEsbW;EACA;EACA;EACA;;AAEA;EACI;;AAIJ;EACI;;AAGJ;EACI;;AACA;EACI;EACA;;AACA;EACI;EACA;;AAKZ;EACI;EACA;;AACA;EACI;EACA;;AACA;EACI;EACA;;AAKZ;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI,kBFtgBnB;;AEwgBmB;EACI,MF/gBvB;;AEohBW;EACI;EACA;;AAIR;EACI;EACA;;ADlhBhB;EC4XI;IA2JQ;IACA;IACA;;EAEA;IACI;;EAGJ;IACI;IACA;;EAEA;IACI;;EAIR;IACI;IACA;;EAGJ;IACI;IACA;;EAEA;IACI;IACA;IACA;IACA;IACA;;EAEA;IACI;IACA;IACA;IACA;;EAEA;IACI;;EAKZ;IACI;;;;AASpB;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;;AAEA;EACI,kBFlmBP;;AEomBO;EACI,MF3mBX;;AEknBL;EACI;EACA;;;AAKR;EACI,kBFznBK;;AE2nBL;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;;;AAOpB;EACI;EACA,YF7oBQ;EE8oBR;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI","file":"style.css"}
\ No newline at end of file
+{"version":3,"sourceRoot":"","sources":["../scss/_variables.scss","../scss/_mixins.scss","../scss/style.scss"],"names":[],"mappings":"AAcA;EACI;EACA;EAEA;EACA;EACA;;ACfA;EDSJ;IASQ;IACA;IACA;IACA;;;;AAKR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI,YAnCK;;;AAqCT;EACI,YArCM;;;AAwCV;EACI;EACA;EACA;EACA;EACA;EACA;EACA,YAtDK;EAuDL;EACA;;;AAGJ;EACI;;;AAGJ;AAAA;EAEI;;;AAGJ;AAAA;EAEI;;;AAGJ;EACI;IAAI;;EACJ;IAAM;;;AAGV;EACI;IAAI;;EACJ;IAAM;;;AEhFV;AAAA;AAAA;EAGI;EACA;;;AAGJ;AAAA;EAEI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA,kBFlBK;EEmBL,OFfM;EEgBN;;;AAGJ;EAKI;EACA;;AALA;EACI;;AAQA;EACI;EACA;;;AAKZ;EACI;;AAEA;EACI,OFtCC;;;AE0CT;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI,kBF1EM;EE2EN,OFlFK;EEmFL;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA,OFhGM;;;AEmGV;EACI;EACA;EAQA,kBF3GM;EE4GN;EACA;EACA;EACA;EACA;EACA;;AAZA;EACI;EACA;EACA;;;AAYR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,OFjIM;;AEoIF;EACI,YFnIH;;AEqIG;EAEI,YFvIP;;AE4IL;AACI;EACA;EACA;EACA,YFlJE;;AEoJF;EAEI;EACA;EACA;AACA;EACA;EACA;EACA,YF5JF;;AE+JF;EACI;;AAGJ;EACI;;AAKJ;EACI;;AAEA;EACI;;AAGJ;EACI;;AD3KZ;ECiHJ;IAgEQ;;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA,kBFrMK;EEsML;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI,OFhPN;EEiPM;EACA;;AD5OZ;ECqLJ;IA6DQ;IACA;IACA;IACA;IACA;IACA;IACA;IACA;IACA;;EAEA;IACI;;EAGJ;IACI;IACA;;EAGJ;IACI;IACA;IACA;;EAEA;IACI;IACA;IACA;IACA;;EAEA;IACI;;EAGJ;IACI;;EAGJ;IACI,OF/RV;IEgSU;IACA;;EAEA;IACI,OFlSf;;;;AE0ST;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;;;AAKZ;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;;AAKZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;;AAKJ;EACI;;AAEA;EACI,kBFjXF;EEkXE;EACA;EACA;EACA;EACA;EACA;;;AAQJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGI;EACI;EACA;;AAIA;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;;AAMhB;EACI;EACA,OFvbX;EEwbW;EACA;EACA;EACA;;AAEA;EACI;;AAIJ;EACI;;AAGJ;EACI;;AAEA;EACI;EACA;;AAEA;EACI;EACA;;AAKZ;EACI;EACA;;AAEA;EACI;EACA;;AAEA;EACI;EACA;;AAKZ;EACI;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAKZ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI,kBF5gBnB;;AE8gBmB;EACI,MFrhBvB;;AE0hBW;EACI;EACA;;AAIR;EACI;EACA;;ADxhBhB;EC4XI;IAiKQ;IACA;IACA;;EAEA;IACI;;EAGJ;IACI;IACA;;EAEA;IACI;;EAIR;IACI;IACA;;EAGJ;IACI;IACA;;EAEA;IACI;IACA;IACA;IACA;IACA;;EAEA;IACI;IACA;IACA;IACA;;EAEA;IACI;;EAKZ;IACI;;;;AASpB;EACI;;AACA;EACI;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;;AAEA;EACI,kBFjnBP;;AEmnBO;EACI,MF1nBX;;AEioBL;EACI;;;AAKR;EACI,kBFvoBK;;AEyoBL;EACI;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;;AAEA;EACI;EACA;;AAEA;EACI;;;AAOpB;EACI;EACA,YF3pBQ;EE4pBR;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI","file":"style.css"}
\ No newline at end of file
diff --git a/scss/style.scss b/scss/style.scss
index 74f3032..ef1ceba 100644
--- a/scss/style.scss
+++ b/scss/style.scss
@@ -33,8 +33,8 @@ body {
     background: radial-gradient(at 40% 40%, rgba(13, 20, 33, 0.5), rgba(10, 9, 15, 0.1)),
     radial-gradient(at 60% 60%, rgba(20, 33, 66, 0.8), rgba(0, 0, 0, 0));
 
-    &.loaded{
-        .hero-img{
+    &.loaded {
+        .hero-img {
             opacity: 1;
             transition: opacity 1s linear .3s;
         }
@@ -417,21 +417,23 @@ section {
                 width: 100%;
                 margin-bottom: var(--margin-1);
 
-                &.scroll-animate{
+                &.scroll-animate {
                     .strip {
                         will-change: transform;
                         transform: scaleX(0.8);
                     }
-                    &.animate{
-                        .strip{
+
+                    &.animate {
+                        .strip {
                             transform: scaleX(1);
-                            transition: 1s cubic-bezier(.77,0,.18,1) 0.3s;
+                            transition: 1s cubic-bezier(.77, 0, .18, 1) 0.3s;
 
                             &:nth-child(2) {
-                                transform: scaleX(1) translateX(-16px); 
+                                transform: scaleX(1) translateX(-16px);
                             }
+
                             &:nth-child(3) {
-                                transform: scaleX(1) translateX(16px); 
+                                transform: scaleX(1) translateX(16px);
                             }
                         }
                     }
@@ -445,7 +447,7 @@ section {
                     height: 32px;
                     align-items: center;
 
-                    &.scroll-translate{
+                    &.scroll-translate {
                         transform: translateX(0px);
 
                     }
@@ -456,11 +458,13 @@ section {
 
                     &:nth-child(2) {
                         background: #e0c9ff;
-                        &.scroll-animate{
+
+                        &.scroll-animate {
                             will-change: transform;
                             transform: translateX(0);
-                            &.animate{
-                                transition: 1s cubic-bezier(.77,0,.18,1) 0.3s;
+
+                            &.animate {
+                                transition: 1s cubic-bezier(.77, 0, .18, 1) 0.3s;
                                 transform: translateX(-16px);
                             }
                         }
@@ -469,11 +473,13 @@ section {
                     &:nth-child(3) {
                         background: #b7cbff;
                         justify-content: end;
-                        &.scroll-animate{
+
+                        &.scroll-animate {
                             will-change: transform;
                             transform: translateX(0);
-                            &.animate{
-                                transition: 1s cubic-bezier(.77,0,.18,1) 0.3s;
+
+                            &.animate {
+                                transition: 1s cubic-bezier(.77, 0, .18, 1) 0.3s;
                                 transform: translateX(16px);
                             }
                         }
@@ -601,6 +607,15 @@ section {
 }
 
 #our-libraries {
+    ul {
+        padding: 0;
+        li {
+            display: block;
+            padding-bottom: var(--margin-1);
+            border-bottom: solid 1px $grid-blue;
+        }
+    }
+
     .title-wrapper {
         display: flex;
         align-items: center;
@@ -628,8 +643,7 @@ section {
     }
 
     p {
-        padding: var(--margin-1);
-        border-bottom: solid 1px $grid-blue;
+        padding: var(--margin-0) var(--margin-1);
     }
 }