feature: mix of bits (#439)

* feature: mix of bits

* bugfix: codestyle

webui.dev/style.css

@@ -177,7 +177,7 @@ nav.topbar ul li a {
 nav.sidebar ul li {
   list-style: none;
   text-align: left;
-  border-bottom: 1px inset black;
+  border-bottom: 1px solid #ccc;
 }
 
 table {
@@ -502,9 +502,12 @@ span.annotation-value {
   text-align: left;
 }
 
+.border-radius {
+  border-radius: .7em;
+}
+
 .box-shadow p {
   padding: .6em;
-  background-color: #fff;
   margin: 0;
 }
 
@@ -557,17 +560,12 @@ div.display {
   flex-direction: column;
 }
 
-#contentLogin form {
-  width: 40%;
-  place-self: center;
-}
-
-#contentLogin hr {
+#content-login hr {
   border: 0;
   border-top: 1px dashed #ccc;
 }
 
-#contentLogin button {
+#content-login button {
   display: block;
   width: 100%;
   grid-column: 1 / span 3;
@@ -576,10 +574,25 @@ div.display {
   background-color: #ced3d7;
 }
 
-#contentLogin button:last-child {
+#content-login button:last-child {
   margin-bottom: 0;
 }
 
+#content-login ul {
+  list-style: none;
+  padding: 0;
+}
+
+#content-login form {
+  width: auto;
+  place-self: center;
+}
+
+.oauth2-icon {
+  font-size: 1.8em;
+  vertical-align: middle;
+}
+
 @media screen and (width <= 600px) {
   fieldset {
     grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
@@ -622,10 +635,7 @@ div.display {
   }
 
   .box-shadow {
-    box-shadow: 0 0 6px 0 #ccc;
-  }
-
-  .box-shadow p {
+    box-shadow: 0 0 6px 0 #625c5c;
     background-color: #222;
   }
 
@@ -670,8 +680,17 @@ div.display {
     color: white;
   }
 
+  nav.sidebar ul li {
+    border-bottom: 1px solid #3e3e3e;
+  }
+
   nav ul li a:hover {
-    background-color: #666;
+    background-color: #1b5988;
+    color: white;
+  }
+
+  nav ul li a.selected {
+    background-color: #0c3351;
     color: white;
   }
 
@@ -692,7 +711,7 @@ div.display {
   }
 
   tr:hover td {
-    background-color: #666;
+    background-color: #1b5988;
   }
 
   div.toolbar {
@@ -702,4 +721,10 @@ div.display {
   div.display {
     box-shadow: 0 0 6px 0 #444;
   }
+
+  #content-login button {
+    background-color: #000;
+    border: 1px solid #666;
+    color: white;
+  }
 }