Started another major redsign

[bookstack] / resources / assets / sass / styles.scss

diff --git a/resources/assets/sass/styles.scss b/resources/assets/sass/styles.scss
index d6534789aceb989e25de3db928c3fbf6fc6bc33d..62d0e7ad1fccf1bc360667bafe4fb9db60a17d44 100644 (file)
--- a/resources/assets/sass/styles.scss
+++ b/resources/assets/sass/styles.scss
@@ -16,83 +16,51 @@ header {
   display: block;
   z-index: 2;
   top: 0;
+  background-color: $primary-dark;
+  color: #fff;
   .padded {
     padding: $-m;
   }
+  border-bottom: 1px solid #DDD;
   //margin-bottom: $-l;
-}
-
-#sidebar {
-  position: fixed;
-  background-color: #444;
-  color: #EEE;
-  height: 100%;
-  top: 0;
-  z-index: 1;
-  //padding-top: $-m;
-  width: 340px;
-  border-right: 1px solid #DDD;
-  h4, li, p, a {
-    color: #CCC;
+  .links a {
+    display: inline-block;
+    padding: $-l;
+    color: #FFF;
+    &:last-child {
+      padding-right: 0;
+    }
   }
-}
-
-#content {
-  //margin-top: 63px;
-  margin-left: 340px;
-  display: block;
-  position: relative;
-  padding: 0 16px;
-}
-
-.logo-container {
-  padding: $-l $-s 0 $-s;
-  color: #CCC;
-  .logo {
-    display: block;
-    font-size: 2em;
-    font-weight: bold;
-    padding: $-m 0;
+  .search-box {
+    padding-top: $-l *0.8;
   }
-  i {
-    padding-right: $-s;
+  .avatar, .user-name {
+    display: inline-block;
+  }
+  .avatar {
+    margin-top: $-l*0.8;
   }
-}
-
-.user-overview {
-  margin-top: $-m;
   .user-name {
-    display: inline-block;
     vertical-align: top;
-    padding: $-m $-s;
+    padding-top: $-l*1.1;
+    padding-left: $-m;
   }
 }
 
-
-.search-box {
-  input {
-    width: 100%;
-    border-radius: 0;
-    padding: $-m;
-    background-color: rgba(0, 0, 0, 0.1);
-    border: none;
-    border-top: 1px solid #333;
-    border-bottom: 1px solid #333;
-    color: #EEE;
-  }
+#content {
+  display: block;
+  position: relative;
 }
 
-.menu {
-  list-style: none;
-  margin: 0;
-  .col-md-4 {
-    padding: 0;
-  }
-  a {
-    padding: $-m;
-    display: block;
-    border-bottom: 1px solid #3A3939;
-  }
+
+.logo {
+  display: inline-block;
+  font-size: 1.8em;
+  color: #fff;
+  font-weight: 400;
+  padding: $-l $-l $-l 0;
+  vertical-align: top;
+  line-height: 1;
 }
 
 .page-title input {
@@ -259,10 +227,11 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 .faded-small {
-  color: #666;
+  color: #000;
   font-size: 0.9em;
+  background-color: rgba(21, 101, 192, 0.15);
   a, span {
-    color: #666;
+    color: #000;
   }
 }
 
@@ -271,6 +240,9 @@ h1, h2, h3, h4, h5, h6 {
   a {
     display: inline-block;
     padding: $-s;
+    &:last-child {
+      padding-right: 0;
+    }
   }
 }
 
@@ -488,16 +460,14 @@ body.dragging, body.dragging * {
 }
 
 .setting-nav {
-  margin-top: $-l;
-  border-top: 1px solid #DDD;
-  border-bottom: 1px solid #DDD;
+  text-align: center;
   a {
     padding: $-m;
     display: inline-block;
     //color: #666;
     &.selected {
       //color: $primary;
-      background-color: #f8f8f8;
+      border-bottom: 2px solid $primary;
     }
   }
 }
\ No newline at end of file