Color of menu buttons should adhere to Main Event Color (#210)

* Color of menu buttons should adhere to Main Event Color and a second color should be available for scroll over

* fix-206 fix font color to switch to white to have a good readable contrast

src/pretalx/static/agenda/scss/_agenda.scss

@@ -43,20 +43,55 @@ header {
   }
 }
 
+@function is-dark($color) {
+  $luminance: (0.2126 * red($color) + 0.7152 * green($color) + 0.0722 * blue($color)) / 255;
+  @return $luminance < 0.5;
+}
+
+@mixin contrast-color($bg-color) {
+  @if is-dark($bg-color) {
+    color: #fff;
+  } @else {
+    color: #000;
+  }
+}
+
+@mixin active-state($color) {
+    background-color: $color;
+    @include contrast-color($color);
+}
+
+@mixin outline-button($color) {
+  color: $color;
+  border-color: $color;
+
+  &:hover, &.active {
+    @include active-state($color);
+  }
+}
+
 #schedule-nav {
-  display: flex;
-  flex-direction: row;
-  align-content: space-between;
-  z-index: 900;
+    display: flex;
+    flex-direction: row;
+    align-content: space-between;
+    z-index: 900;
 
-  a {
-    font-size: 16px;
-    font-weight: normal;
-    border-radius: 0;
-    margin: 0;
-    &.active {
+    a {
+        font-size: 16px;
+        font-weight: normal;
+        border-radius: 0;
+        margin: 0;
+        &.active {
+        }
+    }
+
+    .btn-outline-success {
+      @include outline-button($brand-primary);
+    }
+
+    .btn-outline-info {
+      @include outline-button($brand-primary);
     }
-  }
 
   form {
     max-width: 250px;
@@ -73,6 +108,8 @@ header {
       summary {
         height: 100%;
         margin-bottom: 3px;
+        color: $brand-primary;
+        border-color: $brand-primary;
       }
     }
   }
@@ -476,4 +513,4 @@ article .pretalx-session .pretalx-session-info .abstract {
   transition: opacity .5s ease-in-out;
   -moz-transition: opacity .5s ease-in-out;
   -webkit-transition: opacity .5s ease-in-out;
-}
+}