add content at index.php

6 years ago · 202a0687d6
parent a4728c7098
commit 202a0687d6
1 changed files with 85 additions and 0 deletions
--- a/index.php
+++ b/index.php
@ -63,6 +63,49 @@
 .dropdown a:hover {background-color: none;}

 .show {display: block;}
+
+
+
+
+.dropbtn2 {
+  font-family: "Old Standard TT";
+  font-weight: bold; 
+  font-size: 24px;
+  color: black;
+  padding: 16px;
+  border: none;
+  cursor: pointer;
+}
+
+.dropbtn2:hover, .dropbtn:focus {
+  background-color: pink;
+}
+
+.dropdown2 {
+  position: relative;
+  display: inline-block;
+}
+
+.dropdown-content2 {
+  display: none;
+  position: absolute;
+  background-color: white;
+  min-width: 1900px;
+  overflow: auto;
+  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+  z-index: 1;
+}
+
+.dropdown-content2 a {
+  color: black;
+  padding: 12px 16px;
+  text-decoration: none;
+  display: block;
+}
+
+.dropdown2 a:hover {background-color: none;}
+
+.show2 {display: block;}
 </style>

 <body>
@ -104,6 +147,27 @@
  </div>
 </div>

+<!-- internet resources -->
+  <div class="dropdown2">
+  <button onclick="myFunction2()" class="dropbtn2">Internet sources</button>
+  <div id="myDropdown2" class="dropdown-content2">
+    <li class="list">
+    <a href="https://www.youtube.com/watch?v=HlvfPizooII" target="_blank">Angela Davis @Occupy Wall St </a>
+  </li>
+  <li class="list">
+    <a href="https://www.youtube.com/watch?v=JVpoOdz1AKQ&feature=youtu.be" target="_blank">Judith Butler @Occupy Wall Street</a>
+    
+  </li>
+  <li class="list">
+    <a href="https://www.youtube.com/watch?v=SirOxIeuNDE" target="_blank">Laurie Anderson - Mach 20</a>
+  </li>
+  <li class="list">
+    <a href="https://www.thisamericanlife.org/667/wartime-radio" target="_blank">Ballout, D. (2019) ‘Good Morning, Kafranbel’, This American Life: Wartime Radio</a>
+    
+  </li>
+  </div>
+</div>
+

 <!-- <div style="position:absolute; top:30%; left:26%;">
  <img src="thesis/carson-list.jpg"></img>
@ -277,6 +341,27 @@ window.onclick = function(event) {
 }
 </script>

+<script>
+/* When the user clicks on the button, 
+toggle between hiding and showing the dropdown content */
+function myFunction2() {
+  document.getElementById("myDropdown2").classList.toggle("show2");
+}
+
+// Close the dropdown if the user clicks outside of it
+window.onclick2 = function(event) {
+  if (!event.target.matches('.dropbtn2')) {
+    var dropdowns = document.getElementsByClassName("dropdown-content2");
+    var i;
+    for (i = 0; i < dropdowns.length; i++) {
+      var openDropdown = dropdowns[i];
+      if (openDropdown.classList.contains('show2')) {
+        openDropdown.classList.remove('show2');
+      }
+    }
+  }
+}
+</script>