Changed event timer

css/general.css

@@ -45,7 +45,7 @@ nav * {
 }
 
 #nav-logo:hover {
-  transform: scale(1.05);
+  transform: scale(1.03);
   transition: 0.5s;
 }
 
@@ -66,7 +66,7 @@ nav ul {
   margin-right: 20px;
 }
 
-nav li {
+nav ul li {
   display: inline-block;
   line-height: 30px;
   margin: 10px 7px;
@@ -74,19 +74,19 @@ nav li {
   cursor: pointer;
 }
 
-nav li a {
+.navlink {
   color:rgb(233, 203, 104);
   font-size: 18px;
   text-decoration: none;
   position: relative;
 }
 
-nav li a.active,a:hover {
+.navlink.active,a:hover {
   color: rgba(233, 203, 104, 0.774);
   transition: .5s;
 }
 
-nav li a::after {
+.navlink::after {
   content: '';
   position: absolute;
   bottom: 0;
@@ -100,8 +100,8 @@ nav li a::after {
   transform-origin: center;
   }
 
-nav li a:hover::after,
+.navlink:hover::after,
-nav li a:focus::after{
+.navlink:focus::after{
   transform: scale(1);
 }
 
@@ -181,6 +181,29 @@ nav li a:focus::after{
   text-decoration: none;
 }
 
+#timer-link {
+  color:rgb(252, 188, 93);
+  text-decoration: none;
+  cursor: pointer;
+  background: unset;
+}
+/* 
+@keyframes flash {
+  0% {
+    background-color: #0d1117;
+  }
+  70% {
+    background-color: #2d2d2d;
+  }
+  100% {
+    background-color: #0d1117;
+  }
+} */
+
+.link:hover {
+  color:rgba(252, 188, 93, 0.719);
+}
+
 @keyframes blinking {
   0% {
     opacity: 1;

index.html

@@ -56,13 +56,13 @@
             </label>
             <a onclick="check('01'); save();" target="_blank" href="https://forms.gle/coK7q43RwBV2f15i7"><div id="sign-up">SIGN UP</div></a>
             <ul>
-                <li><a onclick="uncheck('check')" href="#event">Event</a></li>
+                <li><a class="navlink" onclick="uncheck('check')" href="#event">Event</a></li>
-                <li><a onclick="uncheck('check')" href="#rules">Rules</a></li>
+                <li><a class="navlink" onclick="uncheck('check')" href="#rules">Rules</a></li>
-                <li><a onclick="uncheck('check')" href="#prizes">Prizes</a></li>
+                <li><a class="navlink" onclick="uncheck('check')" href="#prizes">Prizes</a></li>
-                <li><a onclick="uncheck('check')" href="#team">Team</a></li>
+                <li><a class="navlink" onclick="uncheck('check')" href="#team">Team</a></li>
             </ul>
             <div id="banner">
-                <p id="banner-text">Next event:<br>Opening Ceremony <abbr class="tooltip-nav" title="Aug 12, 4pm"><span id="timer"></span></abbr></p>
+                <p id="banner-text"><a class="navlink" id="timer-link" href="#timeline" title="Click for more info">Opening Ceremony</a> in<abbr class="tooltip-nav" title="Aug 12, 4pm"><span id="timer"></span></abbr></p>
             </div>
         </div>
     </nav>
@@ -681,6 +681,7 @@
     All Rights Reserved
 </footer>
 <!-- JavaScript Refs -->
+<script src="js/jquery-3.6.0.min.js"></script>
 <script src="js/scroll_nav.js"></script>
 <script src="js/scroll_element.js"></script>
 <script src="js/timer.js"></script>

js/data_checkbox.js

@@ -22,7 +22,7 @@ function check(id) {
 function uncheck(id) {
     document.getElementById(id).checked = false;
 }
-function notifitcation_popup(id) {
+function notification(id) {
     if (localStorage.getItem(checkboxes[id].value) != true) { verify = false; }
     if (verify) { document.getElementById('notification').style.visibility = visible; }
 }