Merge pull request #26 from Bryson69/main

Add footer section

Author: vinzvinci

assets/css/styles.css

@@ -27,6 +27,7 @@
      :root {
         --big-font-size: 5rem;
         --h2-font-size: 2rem;
+        --h4-font-size: 1.25rem;
         --normal-font-size: 1rem;
         --small-font-size: .875rem;
     }
@@ -472,44 +473,16 @@ img {
 
 
 /*========== FOOTER ==========*/
-
 .footer__container {
-    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
-    row-gap: 2rem;
-}
-
-.footer__logo {
-    font-size: var(--h3-font-size);
-    color: var(--first-color);
-    font-weight: var(--font-semi-bold);
-}
-
-.footer__description {
-    display: block;
-    font-size: var(--small-font-size);
-    margin: .25rem 0 var(--mb-3);
-}
-
-.footer__social {
-    font-size: 1.5rem;
-    color: var(--title-color);
-    margin-right: var(--mb-2);
+    display: flex;
+    margin: 15px;
 }
 
 .footer__title {
-    font-size: var(--h2-font-size);
+    font-size: var(--h4-font-size);
     color: var(--title-color);
     margin-bottom: var(--mb-2);
-}
-
-.footer__link {
-    display: inline-block;
-    color: var(--text-color);
-    margin-bottom: var(--mb-1);
-}
-
-.footer__link:hover {
-    color: var(--first-color);
+    letter-spacing: 1px;
 }
 
 .footer__copy {

index.html

@@ -302,8 +302,40 @@ <h3>someones name</h3><br><span>Moderator</span>
 
 
     <!--========== FOOTER ==========-->
+    <!--========== FOOTER ==========-->
+    
     <footer class="footer section bd-container">
-        <p class="footer__copy">&#169; 2021 SurPath. All right reserved</p>
+        <div class="footer__container bd-grid">
+
+            <div class="footer__content">
+                <h3 class="footer__title">Follow Us</h3>
+            </div>
+
+            <div class="footer__content">
+                <h3 class="footer__title">Privacy</h3>
+            </div>
+
+            <div class="footer__content">
+                <h3 class="footer__title">Code of Conduct</h3>
+            </div>
+
+            <div class="footer__content">
+                <h3 class="footer__title">LOGO</h3>
+            </div>
+
+            <div class="footer__content">
+                <h3 class="footer__title">Contribution guidlines</h3>
+            </div>
+
+            <div class="footer__content">
+                <h3 class="footer__title">Blog</h3>
+            </div>
+
+            <div class="footer__content">
+                <h3 class="footer__title">Training</h3>
+            </div>
+        </div>
+        <p class="footer__copy">&#169; 2021 SurPath Hub. All right reserved</p>
     </footer>
 
     <!--===== SCROLL JS =====-->