Responsive starter

EveStarLITE · EveStarLITE · commit a0b31a1cc2ac · 2022-02-15T07:15:25.000-08:00
diff --git a/index.html b/index.html
@@ -10,29 +10,33 @@
     <title>Software Team - FRC Team 3512</title>
     <link rel="stylesheet" type="text/css" href="main.css" />
     <link rel="shortcut icon" type="image/ico" href="favicon.png" />
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
   </head>
   <body>
-    <div id="Sidenav" class="sidenav">
-        <a href="/index.html">Home</a>
-        <a href="bootstrap/index.html">Bootstraps</a>
-        <a href="ci/index.html">Curriculum</a>
-        <a href="vpn/index.html">VPN Setup</a>
-        <a href="fll/index.html">FLL</a>
-        <a href="admin/index.html">Admin</a>
-        <a href="archives/index.html">Archives</a>
-        <div class="Media_Wrapper"> 
-          <a href="https://github.com/frc3512">
-            <img 
-              src="/Assets/github.png"
-              alt="Our Github">
-          </a>           
-          <a href="https://www.youtube.com/channel/UCecHOosspPz6o9_ZXzDxxVw">
-            <img
+    <div class="sidenav">
+      <a href="/index.html">Home</a>
+      <a href="bootstrap/index.html">Bootstraps</a>
+      <a href="ci/index.html">Curriculum</a>
+      <a href="vpn/index.html">VPN Setup</a>
+      <a href="fll/index.html">FLL</a>
+      <a href="admin/index.html">Admin</a>
+      <a href="archives/index.html">Archives</a>
+      <div class="Media_Wrapper"> 
+        <a href="https://github.com/frc3512">
+          <img 
+            src="/Assets/github.png"
+            alt="Our Github">
+        </a>           
+        <a href="https://www.youtube.com/channel/UCecHOosspPz6o9_ZXzDxxVw">
+          <img
             src="/Assets/youtube.png"
             alt="Youtube">
-          </a> 
-        </div>
-      </div>
+        </a> 
+      </div> 
+      <a href="javascript:void(0);" class="icon" onclick="myFunction()">
+        <i class="fa fa-bars"></i>
+      </a> 
+    </div> 
     <div class="Content">
         <div class="top">
         </div>
diff --git a/main.css b/main.css
@@ -3,6 +3,14 @@
   src: url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
 }
 
+@media (max-width: 500px) {
+  .sidenav{
+    display: none;
+  }
+
+  
+}
+
 .sidenav {
   height: 100%;
   width: 10rem;
