no more shorthands in expanded asidenav

templates/course.hamlet

@@ -9,7 +9,7 @@
       <tr>
         <th #description>Beschreibung
         <td>
-          <p>#{descr}
+          #{descr}
     $maybe link <- courseLinkExternal course
       <tr>
         <th #website>Website

templates/course.lucius

@@ -1,3 +1,12 @@
 .course__registration {
   margin-top: 20px;
 }
+
+th {
+  vertical-align: top;
+  text-align: left;
+}
+
+th, td {
+  padding-bottom: 7px;
+}

templates/widgets/asidenav.julius

@@ -89,6 +89,8 @@ document.addEventListener('DOMContentLoaded', function() {
     // remove me before flight:
     // EXPERIMENTAL
     var selector = document.querySelector('#theme-selector');
+    var lsTheme = window.localStorage.getItem('theme');
+    setTheme(lsTheme || 'default');
     var options = Array.from(selector.querySelectorAll('option'))
       .reduce(function(acc, optEl) {
           if (!acc.includes(optEl.value)) {
@@ -103,6 +105,7 @@ document.addEventListener('DOMContentLoaded', function() {
     });
 
     function setTheme(theme) {
+      window.localStorage.setItem('theme', theme);
       document.body.className = 'theme--' + theme;
     }
 

templates/widgets/asidenav.lucius

@@ -38,7 +38,7 @@
 
 .asidenav__box-title {
   padding: 7px 13px;
-  margin-top: 13px;
+  margin-top: 30px;
   background-color: transparent;
   transition: all .2s ease;
 }
@@ -47,6 +47,7 @@
   position: relative;
   color: var(--color-lightwhite);
   margin: 4px 0;
+  padding-left: 10px;
 
   &:hover {
     color: var(--color-link);
@@ -87,7 +88,7 @@
 .asidenav__link-wrapper {
   position: relative;
   display: flex;
-  height: 50px;
+  height: 43px;
   align-items: center;
   justify-content: flex-start;
   color: var(--color-lightwhite);
@@ -104,17 +105,7 @@
 }
 
 .asidenav__link-shorthand {
-  display: block;
-  position: absolute;
-  color: var(--color-grey);
-  line-height: 50px;
-  opacity: 0.2;
-  right: 10px;
-  top: 0;
-  font-size: 40px;
-  text-transform: uppercase;
-  transition: transform .2s ease;
-  text-shadow: 1px 1px 4px rgba(30, 30, 30, 0.8);
+  display: none;
 }
 
 .asidenav__link-label {
@@ -214,8 +205,9 @@
   .asidenav__link-shorthand {
     display: flex;
     position: static;
-    background-color: var(--color-dark);
-    color: var(--color-lightwhite);
+    // TODO: make shorthands in collapsed beautiful *.*
+    // background-color: var(--color-dark);
+    // color: var(--color-lightwhite);
     height: 50px;
     width: 50px;
     text-align: center;
@@ -248,4 +240,12 @@
   .asidenav__link-label {
     padding-left: 0;
   }
+
+  .asidenav__list-item--active {
+
+    .asidenav__link-wrapper {
+      background-color: var(--color-lightwhite);
+      color: var(--color-dark);
+    }
+  }
 }