From 3c358ee6cb276412197e0d829704f6fc0e1af9c1 Mon Sep 17 00:00:00 2001
From: Thomas Smith <49042513+tsmitty11@users.noreply.github.com>
Date: Mon, 24 Oct 2022 16:54:47 -0400
Subject: [PATCH] Styling and content progress

---
 src/layouts/index.html                  | 12 ++++-----
 src/layouts/page/white-paper.html       | 36 ++++++++++++++-----------
 src/layouts/partials/package-grid.html  |  4 +--
 src/layouts/partials/sort-dropdown.html |  7 +++--
 src/static/css/homepage.css             |  2 +-
 src/static/css/typography.css           |  4 +--
 6 files changed, 34 insertions(+), 31 deletions(-)

diff --git a/src/layouts/index.html b/src/layouts/index.html
index 8353688..04fdfb1 100644
--- a/src/layouts/index.html
+++ b/src/layouts/index.html
@@ -186,16 +186,16 @@
         </div>
         <div class="row">
           <div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12 one-box-down">
-            <h5>heading one</h5>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing 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.</p>
+            <h5>Map out the Tea’cosystem</h5>
+            <p>The more people authenticate, the clearer picture we have on just how strong the pot of tea we’re brewing is. We’ll be able to see just how many newcomers and bona-fide OSS veterans have enlisted for the revolution.</p>
           </div>
           <div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12 one-box-down">
-            <h5>heading one</h5>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing 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.</p>
+            <h5>Get Recognized</h5>
+            <p>Authenticating your GitHub enables us to quantify and reward the contributions <em>you’ve already made</em> to the Open-Source Community</p>
           </div>
           <div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12 one-box-down">
-            <h5>heading one</h5>
-            <p>Lorem ipsum dolor sit amet, consectetur adipisicing 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.</p>
+            <h5>NFT Reward Badges</h5>
+            <p>Authenticating your GitHub entitles you to unique NFT reward badges, including one with rare artwork specific to how soon you authenticate.</p>
           </div>
         </div>
       </div>
diff --git a/src/layouts/page/white-paper.html b/src/layouts/page/white-paper.html
index 50347c2..18f0933 100644
--- a/src/layouts/page/white-paper.html
+++ b/src/layouts/page/white-paper.html
@@ -1,7 +1,7 @@
 {{ define "main" }}
 
 <!-- Hero Section -->
-<div class="section">
+<div class="section two-boxes">
   <div class="container">
     <div class="row">
       <div class="col">
@@ -9,24 +9,28 @@
         <p>Open‐source is about the many coming together to create something great. In the spirit of that, we’re inviting developers, speculators, and enthusiasts alike to contribute to our white paper and help brew the future of the internet. This is our revolutionary undertaking to create equitable open‐source for web3, and we want you to be a part of laying its groundwork.</p>
       </div>
     </div>
-
-    <hr>
-
-    <div class="row">
-        <div class="col mb-4 mt-3">
-          <h4>Our white paper is available in multiple languages</h4>
-          <p>Thanks to the tea community's generosity and time, our white paper is available in several world languages. Select your preferred language from the dropdown menu.</p>
-          <div class="dropdown">
-            <button class="btn btn-secondary dropdown-toggle languages" type="button" data-bs-toggle="dropdown" aria-expanded="false">
-              Choose a Language
-            </button>
-            <ul class="dropdown-menu" id="language-selector"></ul>
-          </div>
-        </div>
-      </div>
   </div>
 </div>
 
+<hr>
+
+<section>
+  <div class="container one-box">
+    <div class="row">
+      <div class="col">
+        <h4>Our white paper is available in multiple languages</h4>
+        <p>Thanks to the tea community's generosity and time, our white paper is available in several world languages. Select your preferred language from the dropdown menu.</p>
+        <div class="dropdown">
+          <button class="btn btn-secondary dropdown-toggle languages" type="button" data-bs-toggle="dropdown" aria-expanded="false">
+            Choose a Language
+          </button>
+          <ul class="dropdown-menu" id="language-selector"></ul>
+        </div>
+      </div>
+    </div>
+  </div>
+</section>
+
 <section>
   <div class="container">
     <div class="row">
diff --git a/src/layouts/partials/package-grid.html b/src/layouts/partials/package-grid.html
index 1df43fa..0076d29 100644
--- a/src/layouts/partials/package-grid.html
+++ b/src/layouts/partials/package-grid.html
@@ -9,7 +9,7 @@
         <h3>packages</h3>
         {{- partial "sort-dropdown.html" -}}
       </section>
-      <p>There are already plenty of packages available through tea. As the communi’tea builds the library, contributions will live here.</p>
+      <p style="width:60%;">There are already plenty of packages available through tea. As the communi’tea builds the library, contributions will live here.</p>
     </div>
   <hr>
   <div class="container package-grid">
@@ -128,7 +128,7 @@
     for(const sp of sortedPackages) {
       grid.appendChild(sp);
     }
-    
+
     const isPopularity = sortBy === sortOptions.popularity;
 
     setBtnStyles(sortOptions.popularity, isPopularity);
diff --git a/src/layouts/partials/sort-dropdown.html b/src/layouts/partials/sort-dropdown.html
index 7b76e24..77a5d97 100644
--- a/src/layouts/partials/sort-dropdown.html
+++ b/src/layouts/partials/sort-dropdown.html
@@ -3,9 +3,9 @@
       display:inline-block;
       font-family: "pp-neue-machina", sans-serif;
       background-color: #1a1a1a;
-      border: .5px solid #ffffff;
+      border: 1px solid #ffffff;
       color: #fff;
-      padding-top: 0.279vw;
+      text-align: center;
       text-decoration: none;
       text-transform: uppercase;
       max-width: 240px;
@@ -78,7 +78,7 @@
     }
 
 </style>
-    
+
 <section class="sorting-container">
     <div class="dropdown">
         <div class="dropdown-title">SORT ORDER</div>
@@ -88,4 +88,3 @@
         </ul>
     </div>
 </section>
-    
\ No newline at end of file
diff --git a/src/static/css/homepage.css b/src/static/css/homepage.css
index ed8c863..a6cc27c 100644
--- a/src/static/css/homepage.css
+++ b/src/static/css/homepage.css
@@ -76,7 +76,7 @@
 
   .container{
     max-width: 1920px;
-    padding: 5.4vw 3vw;
+    padding: 5.5vw 3vw;
   }
 }
 
diff --git a/src/static/css/typography.css b/src/static/css/typography.css
index c67e79d..5525dc8 100644
--- a/src/static/css/typography.css
+++ b/src/static/css/typography.css
@@ -222,8 +222,8 @@ li{
 @media only screen and (max-width: 576px) {
 
   .impact{
-    font-size: 20vw !important;
-    line-height: 20.4vw !important;
+    font-size: 22vw !important;
+    line-height: 22vw !important;
   }
 
   h1{