css

uxkolip · Dec 20, 2023 · 25fe405 · 25fe405
1 parent cd2a069
commit 25fe405
Show file tree

Hide file tree

Showing 20 changed files with 3,270 additions and 811 deletions.
diff --git a/dist/css/styles.css b/dist/css/styles.css
diff --git a/dist/css/styles.css.map b/dist/css/styles.css.map
diff --git a/src/accusonus.html b/src/accusonus.html
@@ -382,7 +382,7 @@ <h2 class="section-title">Overview</h2>
                     <h2 class="section-title">Problems</h2>
                     <p class="mt-4">Mostly based on assumptions through research, the team decided to focus on three key problems that professionals were facing during online calls.</p>
 
-                    <div class="row mt-5 grid gap-3 pt-4">
+                    <div class="row mt-5 pt-4">
 
                       <div class="col-12">
                         <div class="row">
@@ -446,7 +446,7 @@ <h2 class="section-title">Competitive analysis</h2>
                 </div>
 
                 <div class="col-12 mt-5">
-                  <div class="row grid gap-3">
+                  <div class="row">
 
                     <div class="col-12 col-lg mb-4">
 
@@ -576,7 +576,7 @@ <h2 class="section-title">Competitive analysis</h2>
                 <h2 class="section-title">Discovery phase</h2>
                 <p class="mt-4">During the discovery phase, I analyzed UI's and UX's from key competitors as I typically do.</p>
               </div>
-              <div class="row mt-5 pt-3 grid gap-4">
+              <div class="row mt-5 pt-3">
 
                 <div class="col-12 col-md text-center mb-4">
 
@@ -600,7 +600,7 @@ <h2 class="section-title">Discovery phase</h2>
 
                 </div>
 
-                <div class="row grid gap-4">
+                <div class="row">
 
                   <div class="col-12 col-md text-center mb-4">
                     <div class="col-12 p-5 mx-auto bg-secondary border-radius" style="min-height: 340px">
@@ -661,7 +661,7 @@ <h2 class="section-title">User persona</h2>
                 <div class="row">
                   <div class="col-12 col-lg-7">
 
-                    <div class="row grid gap-4 mb-4">
+                    <div class="row mb-4">
 
                       <div class="col-12">
                         <div class="col-12 bg-secondary the-border large-shadow border-radius py-3 px-5 position-relative">
@@ -671,7 +671,7 @@ <h2 class="section-title">User persona</h2>
                         </div>
                       </div>
 
-                      <div class="col-12">
+                      <div class="col-12 my-4">
                         <div class="col-12 bg-secondary the-border large-shadow border-radius py-3 px-5 position-relative">
                           <p class="ms-n1 position-absolute top-50 start-0 translate-middle"><span class="badge text-bg-background the-border rounded-circle text-center p-3" style="min-width: 45px">2</span></p>
                           <p class="font-weight-bold mb-0 bigger-1">Higher confidence perception</p>
@@ -928,7 +928,7 @@ <h2 class="section-title">Initial mockups (Mid-Fi)</h2>
                 </div>
 
 
-                <div class="row pt-3 grid gap-2">
+                <div class="row pt-3">
 
                   <p class="semi-title mt-5 pt-5">The ERA Bundle</p>
 
@@ -1093,7 +1093,7 @@ <h2 class="section-title">Final mockups (Mid-Fi)</h2>
 
               <div class="col-12 mt-5 p-5 mx-auto bg-secondary border-radius position-relative">
 
-                <div class="row grid gap-3">
+                <div class="row">
 
                   <div class="col-12 col-md position-relative d-flex align-items-center justify-content-center">
                       <img src="img/misc/elements/ogma-dark-01.svg" alt="OgmaCast mockup screen" class="img-fluid large-shadow" style="max-height: 624px"/>

diff --git a/src/contactpigeon.html b/src/contactpigeon.html
@@ -385,7 +385,7 @@ <h2 class="section-title">Overview</h2>
                     <h2 class="section-title">Problems</h2>
                     <p class="mt-4">As a company closely collaborating with content creators in the sound engineering industry, our team created a survey which identified three key challenges commonly encountered by many YouTubers publishing scripted videos.</p>
 
-                    <div class="row mt-5 grid gap-3 pt-4">
+                    <div class="row mt-5 pt-4">
 
                       <div class="col-12">
                         <div class="row">
@@ -459,7 +459,7 @@ <h2 class="section-title">Competitive analysis</h2>
                 </div>
 
                 <div class="col-12 mt-5">
-                  <div class="row grid gap-3">
+                  <div class="row">
 
                     <div class="col-12 col-lg mb-4">
                       <div class="col-10 col-lg-12 mx-auto bg-secondary the-border large-shadow border-radius p-0 text-end">
@@ -504,7 +504,7 @@ <h2 class="section-title">User persona</h2>
                   <div class="row">
                     <div class="col-12 col-lg-7">
 
-                      <div class="row grid gap-4 mb-4">
+                      <div class="row mb-4">
 
                         <div class="col-12">
                           <div class="col-12 bg-secondary the-border large-shadow border-radius py-3 px-5 position-relative">
@@ -839,7 +839,7 @@ <h2 class="section-title">Prototype</h2>
             </div>
 
 
-            <div class="row grid gap-3">
+            <div class="row">
 
               <div class="col-12">
                 <p>What I'm presenting above is how to <img src="img/misc/shapes/arrow-right.svg" alt="Right arrow" class="img-fluid ms-2"></p>