style: basic style footer

Davilands · Oct 15, 2024 · 430ccd9 · 430ccd9
1 parent aeec2d8
commit 430ccd9
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 109 deletions.
diff --git a/app/footer/page.tsx b/app/footer/page.tsx
@@ -6,26 +6,10 @@ export default function Footer() {
   return (
     <div>
       <footer>
-        <div className="footerContainer">
-          <div className="socialIcons">
-            <a href=""><i className='bx bxl-youtube'></i></a>
-            <a href=""><i className='bx bxl-tiktok' ></i></a>
-            <a href=""><i className='bx bxl-github' ></i></a>
-            <a href=""><i className='bx bxl-facebook' ></i></a>
-            {/* <a href=""><i className="fa-brands fa-youtube"></i></a> */}
-          </div>
-          <div className="footerNav">
-            <ul><li><a href="">Home</a></li>
-              <li><a href="">News</a></li>
-              <li><a href="">About</a></li>
-              <li><a href="">Contact Us</a></li>
-              <li><a href="">our Team</a></li>
-            </ul>
-          </div>
+        <div className="footer">
+          <p>Released under the MIT License.</p>
 
-        </div>
-        <div className="footerBottom">
-          <p>Copyright &copy;2023; Designed by <span className="designer">Noman</span></p>
+          <p>Copyright © 2024 Davis</p>
         </div>
       </footer>
     </div>

diff --git a/styles/footer.css b/styles/footer.css
@@ -4,99 +4,13 @@
   box-sizing: border-box;
 } */
 footer {
-  background-color: #111;
-}
-
-.footerContainer {
-  width: 100%;
-  padding: 70px 30px 20px;
-}
-
-.socialIcons {
-  display: flex;
+  z-index: 5;
+  position: relative;
+  border-top: solid 1px #59595936;
   justify-content: center;
-}
-
-.socialIcons a {
-  text-decoration: none;
-  padding: 10px;
-  background-color: white;
-  margin: 10px;
-  border-radius: 50%;
-}
-
-.socialIcons a i {
-  font-size: 2em;
-  color: black;
-  opacity: 0, 9;
-}
-
-/* Hover affect on social media icon */
-.socialIcons a:hover {
-  background-color: #111;
-  transition: 0.5s;
-}
-
-.socialIcons a:hover i {
-  color: white;
-  transition: 0.5s;
-}
-
-.footerNav {
-  margin: 30px 0;
-}
-
-.footerNav ul {
   display: flex;
-  justify-content: center;
-  list-style-type: none;
-}
-
-.footerNav ul li a {
-  color: white;
-  margin: 20px;
-  text-decoration: none;
-  font-size: 1.3em;
-  opacity: 0.7;
-  transition: 0.5s;
-
-}
-
-.footerNav ul li a:hover {
-  opacity: 1;
 }
 
-.footerBottom {
-  background-color: #000;
-  padding: 20px;
+footer p {
   text-align: center;
-}
-
-.footerBottom p {
-  color: white;
-}
-
-.designer {
-  opacity: 0.7;
-  text-transform: uppercase;
-  letter-spacing: 1px;
-  font-weight: 400;
-  margin: 0px 5px;
-}
-
-@media (max-width: 700px) {
-  .footerNav ul {
-    flex-direction: column;
-  }
-
-  .footerNav ul li {
-    width: 100%;
-    text-align: center;
-    margin: 10px;
-  }
-
-  .socialIcons a {
-    padding: 8px;
-    margin: 4px;
-  }
 }