From 457c06440825fb9e16fcceaf4227856885081206 Mon Sep 17 00:00:00 2001
From: Anita-ihuman <charlesanita403@gmail.com>
Date: Wed, 17 Feb 2021 13:18:47 +0100
Subject: [PATCH] changing the elemente to sematic html

---
 components/footer.tsx     | 36 ++++++++++++++++++++----------------
 components/nav.tsx        |  4 ++--
 styles/footer.module.scss | 36 +++++++++++++++++++++++++++---------
 3 files changed, 49 insertions(+), 27 deletions(-)

diff --git a/components/footer.tsx b/components/footer.tsx
index af0047b..72f16b4 100644
--- a/components/footer.tsx
+++ b/components/footer.tsx
@@ -4,9 +4,9 @@ import styles from "../styles/footer.module.scss";
 const Footer = () => {
   return (
     <>
-      <footer>
-        <div className={styles.Third}>
-          <div className={styles.text}>
+      <footer className={styles.footer}>
+        <section className={styles.Third}>
+          <article className={styles.text}>
             <div>
               <img src="Logo.png" className={styles.textimg} />
               <p>
@@ -17,25 +17,29 @@ const Footer = () => {
             <div className={styles.copy}>
               Copyright 2019 MNTN, Inc. Terms & Privacy
             </div>
-          </div>
-          <div className={styles.text2}>
-            <div className={styles.text}>
+          </article>
+          <article className={styles.text2}>
+            <div className={styles.text1}>
               <h3>More on The Blog</h3>
-              <p>About MNTN</p>
-              <p>Contributors & Writers</p>
-              <p>Write For Us</p>
-              <p>Contact Us</p>
-              <p>Privacy Policy</p>
+              <ul>
+                <li>About MNTN</li>
+                <li>Contributors & Writers</li>
+                <li>Write For Us</li>
+                <li> Contact Us</li>
+                <li>Privacy Policy</li>
+              </ul>
             </div>
 
             <div className={styles.text1}>
               <h3>More on MNTN</h3>
-              <p>The Team </p>
-              <p>Jobs </p>
-              <p>Press </p>
+              <ul>
+                <li>The Team</li>
+                <li>Jobs</li>
+                <li>Press</li>
+              </ul>
             </div>
-          </div>
-        </div>
+          </article>
+        </section>
       </footer>
     </>
   );
diff --git a/components/nav.tsx b/components/nav.tsx
index 61631e2..63576ff 100644
--- a/components/nav.tsx
+++ b/components/nav.tsx
@@ -6,9 +6,9 @@ const Navbar = () => {
     <>
       <nav className={styles.nav}>
         <div className={styles.header}>
-          <div className={styles.brand}>
+          <figure className={styles.brand}>
             <img src="/Logo.png" alt="Logo" color="black" />
-          </div>
+          </figure>
 
           
           <div>
diff --git a/styles/footer.module.scss b/styles/footer.module.scss
index c5b8353..e014717 100644
--- a/styles/footer.module.scss
+++ b/styles/footer.module.scss
@@ -1,10 +1,15 @@
+.footer {
+  width: 100%;
+    background: #10222a;
+}
+
 .Third {
   color: white;
   display: flex;
   padding: 40px 0px;
-  width: 100%;
-  justify-content: space-around;
-  background: #10222a;
+  width: 90%;
+  justify-content: space-evenly;
+margin: 0 auto;
 }
 
 .text2 {
@@ -12,11 +17,13 @@
   justify-content: space-evenly;
   font-family: Gilroy;
   font-style: normal;
+  margin-right: 90px;
 }
 .text1 {
   margin-left: 100px;
   color: white;
   font-family: Gilroy;
+ 
 }
 .text p {
   font-family: Gilroy;
@@ -25,13 +32,24 @@
   line-height: 22px;
   width: 170px;
 }
-.text1 p {
+.text ul {
+  font-family: Gilroy;
+  font-weight: normal;
+  font-size: 12px;
+  line-height: 22px;
+  list-style: none;
+  padding: 0;
+}
+.text1 ul {
+  padding: 0;
+  list-style: none;
   font-family: Gilroy;
   font-weight: normal;
   font-size: 12px;
   line-height: 22px;
 }
 .text {
+  margin-right: 150px;
 }
 .textimg {
   width: 70px;
@@ -66,13 +84,13 @@
   text-align: center;
 }
 @media (max-width: 600px) {
-  .third{
+  .third {
     flex-wrap: wrap;
-flex-direction: row;
-justify-content: center;
+    flex-direction: row;
+    justify-content: center;
   }
-  .text2{
+  .text2 {
     flex-wrap: wrap;
     flex-direction: row;
   }
-}
\ No newline at end of file
+}