MDJAmin
diff --git a/‎assets/close_FILL0_wght400_GRAD0_opsz48.svg‎
Lines changed: 0 additions & 1 deletion b/‎assets/close_FILL0_wght400_GRAD0_opsz48.svg‎
Lines changed: 0 additions & 1 deletion
diff --git a/‎assets/laptop.jpg‎
-401 KB b/‎assets/laptop.jpg‎
-401 KB
diff --git a/‎assets/menu_FILL0_wght400_GRAD0_opsz48.svg‎
Lines changed: 0 additions & 1 deletion b/‎assets/menu_FILL0_wght400_GRAD0_opsz48.svg‎
Lines changed: 0 additions & 1 deletion
diff --git a/‎css/style.css‎
Lines changed: 43 additions & 4 deletions b/‎css/style.css‎
Lines changed: 43 additions & 4 deletions
diff --git a/‎favicon.png‎
28.9 KB b/‎favicon.png‎
28.9 KB
diff --git a/‎index.html‎
Lines changed: 42 additions & 15 deletions b/‎index.html‎
Lines changed: 42 additions & 15 deletions
@@ -4,18 +4,24 @@
   list-style: none;
   text-decoration: none;
   box-sizing: border-box;
+  overflow-y: hidden;
 }
 body {
-  min-height: 100vh;
+  min-height: 90vh;
   background: url("laptop.jpg");
   background-size: cover;
   background-repeat: no-repeat;
   background-position: center;
   font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
 }
 nav {
-  background-color: white;
+  background-color: #337c60;
   box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.1);
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
 }
 nav ul {
   width: 100%;
@@ -33,11 +39,11 @@ nav a {
   text-decoration: none;
   display: flex;
   align-items: center;
-  color: black;
+  color: white;
 }
 
 nav a:hover {
-  background-color: #f0f0f0;
+  background-color: #5d8475ac;
 }
 nav li:first-child {
   margin-right: auto;
@@ -80,5 +86,38 @@ nav li:first-child {
   }
 }
 .Hero-bg {
+  height: 100vh;
   width: 100%;
 }
+
+.MDJAminDiv {
+  z-index: 4444;
+  position: fixed;
+  bottom: 5%;
+  left: 2%;
+  z-index: 100;
+}
+
+.MDJAmin {
+  text-decoration: none;
+  padding: 4px 0;
+  /* color: rgba(44, 44, 44, 0.525); */
+  color: rgba(204, 204, 204, 0.414);
+  font-family: monospace;
+  font-style: italic;
+  font-size: 1.1em;
+  transition: all 0.5s;
+}
+
+.MDJAmin:hover {
+  /* color: #000000; */
+  color: #28bc83;
+}
+
+.menuBtn {
+  font-size: 2em;
+}
+
+.closeBtn {
+  font-size: 2em;
+}
@@ -2,19 +2,31 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="stylesheet" href="css/style.css" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0"
+    />
+    <link
+      rel="stylesheet"
+      href="css/style.css"
+    />
+    <link
+      rel="shortcut icon"
+      href="favicon.png"
+      type="image/x-icon"
+    />
     <title>Responsive Navbar</title>
   </head>
   <body>
     <nav>
       <ul class="sidebar">
         <li>
-          <a href="#" onclick="hideSidebar()"
-            ><img
-              src="assets/close_FILL0_wght400_GRAD0_opsz48.svg"
-              alt="Close-icon"
-          /></a>
+          <a
+            class="closeBtn"
+            href="#"
+            onclick="hideSidebar()"
+            >×</a
+          >
         </li>
         <li><a href="#">Blog</a></li>
         <li><a href="#">Products</a></li>
@@ -23,24 +35,39 @@
         <li><a href="#">Login</a></li>
       </ul>
       <ul>
-        <li><a href="#">A~Shop</a></li>
+        <li><a href="https://github.com/MDJAmin">MDJAmin</a></li>
         <li class="hideOnMobile"><a href="#">Blog</a></li>
         <li class="hideOnMobile"><a href="#">Products</a></li>
         <li class="hideOnMobile"><a href="#">About</a></li>
         <li class="hideOnMobile"><a href="#">Forum</a></li>
         <li class="hideOnMobile"><a href="#">Login</a></li>
-        <li class="menu-button" onclick="showSidebar()">
-          <a href="#"
-            ><img
-              src="assets/menu_FILL0_wght400_GRAD0_opsz48.svg"
-              alt="Menu-icon"
-          /></a>
+        <li
+          class="menu-button"
+          onclick="showSidebar()"
+        >
+          <a
+            class="menuBtn"
+            href="#"
+            >=</a
+          >
         </li>
       </ul>
     </nav>
     <main>
-      <img class="Hero-bg" src="assets/laptop.jpg" alt="Hero-img" />
+      <img
+        class="Hero-bg"
+        src="https://images.unsplash.com/photo-1755134148217-2dd89cc6a2c2?q=80&w=1170&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D"
+        alt="Hero-img"
+      />
     </main>
+    <div class="MDJAminDiv">
+      <a
+        class="MDJAmin"
+        href="https://github.com/MDJAmin"
+        target="_blank"
+        >MDJAmin</a
+      >
+    </div>
     <script>
       function showSidebar() {
         const sidebar = document.querySelector(".sidebar");