From b0ebc620aeba5353fc5f54788875b4410bb45e1a Mon Sep 17 00:00:00 2001
From: Felix Hamann <felix.hamann@campus.lmu.de>
Date: Thu, 29 Mar 2018 23:46:29 +0200
Subject: [PATCH] added hover-menus for asidenav

---
 templates/widgets/asidenav.hamlet | 15 +++++++++++
 templates/widgets/asidenav.lucius | 43 ++++++++++++++++++++++++++++++-
 2 files changed, 57 insertions(+), 1 deletion(-)

diff --git a/templates/widgets/asidenav.hamlet b/templates/widgets/asidenav.hamlet
index 8676c0893..f110c1e24 100644
--- a/templates/widgets/asidenav.hamlet
+++ b/templates/widgets/asidenav.hamlet
@@ -21,13 +21,28 @@ $newline never
           <a .asidenav__link-wrapper href="/course/S2018/ixd/show">
             <div .asidenav__link-triple>IXD
             <div .asidenav__link-label>Interaction Design
+          <ul .asidenav__nested-list>
+            <li .asidenav__list-item>
+              <a .asidenav__link-wrapper href="/course/S2018/ixd/ex">Übungsblätter
+            <li .asidenav__list-item>
+              <a .asidenav__link-wrapper href="/course/S2018/ixd/show">Klausuren
+            <li .asidenav__list-item>
+              <a .asidenav__link-wrapper href="/course/S2018/ixd/show">Übungsgruppen
         <li .asidenav__list-item>
           <a .asidenav__link-wrapper href="/course/S2018/ffp/show">
             <div .asidenav__link-triple>FFP
             <div .asidenav__link-label>Fortgeschrittene Funktionale Programmierung
+          <ul .asidenav__nested-list>
+            <li .asidenav__list-item>
+              <a .asidenav__link-wrapper href="/course/S2018/ffp/ex">Abgaben
+            <li .asidenav__list-item>
+              <a .asidenav__link-wrapper href="/course/S2018/ffp/show">Klausuren
         <li .asidenav__list-item>
           <a .asidenav__link-wrapper href="/course/S2018/dbs/show">
             <div .asidenav__link-triple>DBS
             <div .asidenav__link-label>Datenbanksysteme
+          <ul .asidenav__nested-list>
+            <li .asidenav__list-item>
+              <a .asidenav__link-wrapper href="/course/S2018/dbs/ex">Übungsgruppen
 
   <div .asidenav__toggler>
diff --git a/templates/widgets/asidenav.lucius b/templates/widgets/asidenav.lucius
index 9922752de..d073cea89 100644
--- a/templates/widgets/asidenav.lucius
+++ b/templates/widgets/asidenav.lucius
@@ -4,7 +4,6 @@
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
   z-index: 1;
   flex: 0 0 300px;
-  overflow: hidden;
 }
 .main__aside--transitioning {
   transition: flex-basis .2s ease;
@@ -19,6 +18,7 @@
 .main__aside--collapsed {
   width: 50px;
   flex-basis: 50px;
+  overflow: hidden;
 
   .asidenav__box-title {
     width: 50px;
@@ -44,6 +44,9 @@
   margin-top: 20px;
   color: white;
 
+  .js-show-hide__target {
+    overflow: visible;
+  }
   .js-show-hide__toggle::before {
     top: 14px;
     right: 12px;
@@ -76,6 +79,39 @@
   }
 }
 
+.asidenav__nested-list {
+  position: absolute;
+  top: 0;
+  right: 0;
+  color: var(--fontbase);
+  transform: translateX(0);
+  opacity: 0;
+  transition: all .2s ease;
+  z-index: -1;
+
+  .asidenav__list-item {
+    background-color: var(--darkbase);
+    color: white;
+
+    &:first-child {
+      margin-top: 0;
+    }
+  }
+
+  .asidenav__link-wrapper {
+    padding-left: 13px;
+    padding-right: 13px;
+    border-left: 20px solid white;
+    transition: all .2s ease;
+
+    &:hover {
+      background-color: white;
+      color: var(--darkbase) !important;
+      border-left: 20px solid var(--darkbase);
+    }
+  }
+}
+
 .asidenav__list-item {
   position: relative;
   background-color: white;
@@ -86,6 +122,11 @@
     color: white;
     background-color: var(--darkbase);
 
+    .asidenav__nested-list {
+      transform: translateX(100%);
+      opacity: 1;
+    }
+
     .asidenav__link-wrapper,
     .asidenav__link-label {
       color: white;