Merge branch 'feat/design_touches' into 'master'

Design touches

See merge request !26

templates/default-layout.lucius

@@ -20,7 +20,8 @@
   --fontbase: #34303a;
   --fontsec: #5b5861;
   /* THEME 4 */
-  --darkbase: #263C4C;
+  --darkerbase: #274a65;
+  --darkbase: #425d79;
   --lightbase: #598EB5;
   --lighterbase: #5F98C2;
   --whitebase: #FCFFFA;

templates/standalone/modal.lucius

@@ -70,7 +70,7 @@
   justify-content: center;
   width: 30px;
   height: 30px;
-  background-color: var(--darkbase);
+  background-color: var(--darkerbase);
   border-radius: 2px;
   cursor: pointer;
   z-index: 20;

templates/widgets/asidenav.hamlet

@@ -18,10 +18,11 @@ $newline never
         WiSe 17/18
       <ul .asidenav__list>
         $forall (Entity _ Course{..}) <- favourites
-          <li .asidenav__list-item>
-            <a .asidenav__link-wrapper href=@{CourseR courseTermId courseShorthand CourseShowR}>
-              <div .asidenav__link-shorthand>#{courseShorthand}
-              <div .asidenav__link-label>#{courseName}
+          $with route <- CourseR courseTermId courseShorthand CourseShowR
+            <li .asidenav__list-item :Just route == mcurrentRoute:.asidenav__list-item--active>
+              <a .asidenav__link-wrapper href=@{route}>
+                <div .asidenav__link-shorthand>#{courseShorthand}
+                <div .asidenav__link-label>#{courseName}
 
         <li .asidenav__list-item>
           <a .asidenav__link-wrapper href="/course/S2018/ixd/show">

templates/widgets/asidenav.lucius

@@ -1,6 +1,6 @@
 .main__aside {
   position: relative;
-  background-color: var(--darkbase);
+  background-color: #425d79;
   box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
   z-index: 1;
   flex: 0 0 300px;
@@ -22,7 +22,11 @@
 
   .asidenav__box-title {
     width: 50px;
-    padding: 0;
+    padding: 1px;
+    font-size: 18px;
+    text-align: center;
+    margin-bottom: 0;
+    background-color: var(--fontsec);
   }
 
   .asidenav__link-wrapper {
@@ -35,10 +39,11 @@
       width: 50px;
       text-align: center;
       opacity: 1;
-      font-size: 16px;
+      font-size: 15px;
       line-height: 1em;
       margin-right: 13px;
       flex-shrink: 0;
+      padding: 1px;
       outline: 1px solid white;
       text-transform: uppercase;
       word-break: break-all;
@@ -78,6 +83,9 @@
 
 .asidenav__box-title {
   padding: 7px 13px;
+  margin-top: 13px;
+  background-color: transparent;
+  transition: all .2s ease;
 
   a {
     color: white;
@@ -155,6 +163,11 @@
     pointer-events: none;
     color: white;
   }
+
+  .asidenav__link-shorthand {
+    transform: scale(1.05, 1.0);
+    transform-origin: right;
+  }
 }
 
 .asidenav__link-wrapper {

templates/widgets/navbar.lucius

@@ -7,11 +7,11 @@
   width: 100%;
   height: var(--header-height);
   padding-right: 5vw;
-  padding-left: 340px;
-  background: var(--darkbase); /* Old browsers */
-  background: -moz-linear-gradient(bottom, var(--darkbase) 0%, #425d79 100%); /* FF3.6-15 */
-  background: -webkit-linear-gradient(bottom, var(--darkbase) 0%,#425d79 100%); /* Chrome10-25,Safari5.1-6 */
-  background: linear-gradient(to top, var(--darkbase) 0%,#425d79 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+  padding-left: 90px;
+  background: var(--darkerbase); /* Old browsers */
+  background: -moz-linear-gradient(bottom, var(--darkerbase) 0%, #425d79 100%); /* FF3.6-15 */
+  background: -webkit-linear-gradient(bottom, var(--darkerbase) 0%,#425d79 100%); /* Chrome10-25,Safari5.1-6 */
+  background: linear-gradient(to top, var(--darkerbase) 0%,#425d79 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   color: white;
   box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
   z-index: 10;
@@ -86,8 +86,7 @@
 }
 
 .navbar .navbar__list-item:not(.navbar__list-item--active):hover {
-  background-color: var(--darkbase);
-  color: var(--whitebase);
+  background-color: var(--darkerbase);
 }
 .navbar .navbar__list-item:not(.navbar__list-item--active):hover .navbar__link-wrapper {
   color: var(--whitebase);

templates/widgets/pageactionprime.hamlet

@@ -1,7 +1,6 @@
 $newline never
 $if hasPageActions
   <div .page-nav-prime>
-    <h3>Aktionen:
     <ul .pagenav__list>
       $forall menuType <- menuTypes
         $case menuType

templates/widgets/pageactionprime.lucius

@@ -1,8 +1,6 @@
 .page-nav-prime {
   background-color: var(--lightgreybase);
-  box-shadow: -20px -20px 0 20px var(--lightgreybase),
-              20px -20px 0 20px var(--lightgreybase);
-  padding: 13px 0;
+  padding: 13px;
 }
 
 .page-nav-prime .pagenav__list {
@@ -11,11 +9,5 @@
 }
 .page-nav-prime .pagenav__list-item {
   display: inline-block;
-  border-bottom: 2px solid var(--lightbase);
   margin-right: 7px;
-  transition: border-bottom-color .2s ease;
-
-  &:hover {
-    border-bottom-color: var(--lighterbase);
-  }
 }