Added content

src/layouts/page/gui.html

@@ -15,10 +15,8 @@
           <p class="small light-gray ms-3" style="position:relative;top:7px;">Version 0.5.2 | Currently in Beta</p>
         </div>
         </div>
-      <div class="col">
-        <div class="download-hero dark-gray-bg">
-
-        </div>
+      <div class="col-6">
+          <img style="width:100%;" src="/Images/gui-screenshot-hero.png" alt="tea/gui">
       </div>
     </div>
   </div>
@@ -40,6 +38,11 @@
     font-size:50px !important;
   }
 
+  h3{
+    font-size:26px !important;
+    line-height: 1.5em;
+  }
+
   p{
     font-size: 16px;
   }
@@ -90,20 +93,20 @@
 
 <!-- Features -->
 
-<section class="two-boxes">
+<section class="two-boxes-down">
   <div class="container">
     <div class="row">
-      <div class="col">
+      <div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
         <h3>One-Click Installs</h3>
-        <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>
+        <p>Say goodbye to the days of scanvenging through cluttered docs. tea/gui enables to you to query our expansive pantry and install your desired version of any package with one-click. Opena-python, jupyter, youtube-dl, and hundreds more&#8230; all available to you within in seconds.</p>
       </div>
-      <div class="col">
+      <div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
         <h3>Easy Updates</h3>
-        <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>
+        <p>Our aim is to enhance your workflow, not disrupt it. tea/gui will alert you via desktop notifcations when new updates are available for your installed packages. Your can bullk update everything, or update one-by-one in the event you'd like to exercise some more discretion. </p>
       </div>
-      <div class="col">
+      <div class="col-xl-4 col-lg-4 col-md-4 col-sm-12 col-12">
         <h3>Version Management</h3>
-        <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>
+        <p>tea/gui makes it managing your package versions simply delightful experience. You can prune packages to remove all but the latest version, choose your desired version when installing, and install or add specific versions for previously installed packages.</p>
       </div>
     </div>
   </div>
@@ -114,11 +117,8 @@
 <section class="teal-bg two-boxes">
   <div class="container">
     <div class="row">
-      <div class="col">
-        <h3 class="black text-center">Download the GUI today</h3>
-        <a href="https://github.com/login/oauth/authorize?client_id=9d1f1a72f1300b6991df&state=teaxyz">
-          <button class="hbtn-black hb-fill-right-black auth-click">DOWNLOAD</button>
-        </a>
+      <div class="col mx-auto">
+        <h3 class="black text-center">Get started with visual package management today!</h3>
       </div>
     </div>
   </div>