Add dropdown menu with direct links to members

1 files changed, 28 insertions, 0 deletions

diff --git a/commun.css b/commun.css
index d26ac63..7eb648b 100644
--- a/commun.css
+++ b/commun.css
@@ -68,6 +68,34 @@ nav > ol > li {
     padding: 0.5em 0.1em;
 }
 
+/* TODO fix horizontal padding which misaligns white backgrounds on quatuor page */
+/* TODO highlight current quatuor member */
+nav li.dropdown {
+    position: relative;
+}
+nav li.dropdown ul {
+    display: none;
+    position: absolute;
+    padding-left: 0;
+    width: 100%;
+    background: white;
+    z-index: 1;
+}
+nav li.dropdown:hover ul {
+    display: block;
+    text-align: left;
+}
+nav li:hover ul li {
+    list-style-type: none;
+    padding-inline-start: 10%;
+}
+nav li.dropdown > ul > li:hover {
+    background: lightgrey;
+}
+nav li.dropdown > ul > li a {
+    display: block;       /* Make link span whole containing block. */
+}
+
 .current {
     background-color: white;
 }