From 3605738bf5e15cfbb9dda1f0d8485b0eaa5ce914 Mon Sep 17 00:00:00 2001
From: brian <b9andrews@gmail.com>
Date: Tue, 25 Oct 2022 01:22:46 -0400
Subject: [PATCH] drop downs click but need fix

---
 css/dropdown.css |  9 +--------
 css/dropdown.js  | 20 ++++++++++++++++++++
 index.html       | 28 +++++++++++-----------------
 3 files changed, 32 insertions(+), 25 deletions(-)
 create mode 100644 css/dropdown.js

diff --git a/css/dropdown.css b/css/dropdown.css
index cfb236f4..04b3adfa 100644
--- a/css/dropdown.css
+++ b/css/dropdown.css
@@ -41,11 +41,4 @@
   display: block;
 }
 
-/* Change color of dropdown links on hover */
-.dropdown-content a:hover {background-color: #ddd;}
-
-/* Show the dropdown menu on hover */
-.dropdown:hover .dropdown-content {display: block;}
-
-/* Change the background color of the dropdown button when the dropdown content is shown */
-.dropdown:hover .dropbtn {background-color: #000001;}
+/* removed hover capabilities and added js click capabilities in css/dropdown.js */
diff --git a/css/dropdown.js b/css/dropdown.js
new file mode 100644
index 00000000..2dadad50
--- /dev/null
+++ b/css/dropdown.js
@@ -0,0 +1,20 @@
+function PRlist() {
+  var click = document.getElementById("PR");
+  if(click.style.display ==="none") {
+    click.style.display ="block";
+  } else {
+    click.style.display ="none";
+  }
+}
+
+function PLTlist() {
+  var click = document.getElementById("PLT");
+  if(click.style.display ==="none") {
+    click.style.display ="block";
+  } else {
+    click.style.display ="none";
+  }
+}
+
+document.getElementById('PR').addEventListener("click", PRlist);
+document.getElementById('PLT').addEventListener("click", PLTlist);
diff --git a/index.html b/index.html
index 535838d5..06af619c 100644
--- a/index.html
+++ b/index.html
@@ -36,7 +36,6 @@
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
   <link rel="stylesheet" href="css/dropdown.css">
 
-
   <!-- Favicon
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
   <link rel="icon" type="image/png" href="images/avatar.jng">
@@ -107,8 +106,8 @@
         -->
 
         <div class="dropdown">
-          <button class="dropbtn">Professional Resources<img class="icon" src="images/downarrow.png"></button>
-          <div class="dropdown-content">
+          <button onclick="PRlist()" class="dropbtn">Professional Resources<img class="icon" src="images/downarrow.png"></button>
+          <div id="PR" class="dropdown-content">
             <!-- Resume -->
             <a class="button button-github" href="images/Andrews_Resume_2022.pdf" target="_blank" rel="noopener">
                 <img class="icon" src="images/icons/resume.png">Resume</a>
@@ -133,8 +132,8 @@
         <br>
 
         <div class="dropdown">
-          <button class="dropbtn-PLT"><img class="icon" src="images/icons/PLT.png">Pro Lacrosse Talk<img class="icon" src="images/downarrow.png"></button>
-          <div class="dropdown-content">
+          <button onclick="PLTlist()" class="dropbtn-PLT"><img class="icon" src="images/icons/PLT.png">Pro Lacrosse Talk<img class="icon" src="images/downarrow.png"></button>
+          <div id="PLT" class="dropdown-content">
             <!-- Put here spotify links and links to an article or two!
             Also change the PLT font color in the drop down field -->
             <a class="button button-spotify" href="https://open.spotify.com/show/1wvPf4MiVvv6HY7tIGcdYJ?si=c3a123beab884c64" target="_blank" rel="noopener">
@@ -151,18 +150,10 @@
           </div>
         </div>
 
-        <div class="dropdown">
-          <button class="dropbtn">Contact<img class="icon" src="images/downarrow.png"></button>
-          <div class="dropdown-content">
-            <!-- Email -->
-            <a class="button button-default" target="_blank" rel="noopener">
-                <img class="icon" src="images/icons/email.svg" alt="Email Icon">b9andrews@gmail.com</a>
-
-            <!-- Email Alternative -->
-            <a class="button button-default" target="_blank" rel="noopener">
-                <img class="icon" src="images/icons/email.svg" alt="Email Icon">ba553@drexel.edu</a>
-          </div>
-        </div>
+        <!-- Email -->
+        <a class="button button-default" target="_blank" rel="noopener">
+            <img class="icon" src="images/icons/email.svg" alt="Email Icon">b9andrews@gmail.com</a>
+        <br>
 
         <!-- Buy Me a Coffee -->
         <a class="button button-coffee" href="https://account.venmo.com/u/Brian-Andrews-9" target="_blank" rel="noopener">
@@ -182,6 +173,9 @@
     </div>
   </div>
 
+  <script type="text/javascript" src="css/dropdown.js">
+  </script>
+
   <!-- End Document
   –––––––––––––––––––––––––––––––––––––––––––––––––– -->
 </body>