Clean up scss code for original white background

13 files changed, 52 insertions, 45 deletions

diff --git a/app/assets/stylesheets/color-variables.scss b/app/assets/stylesheets/color-variables.scss
index 3defde114..449f7eb1b 100644
--- a/app/assets/stylesheets/color-variables.scss
+++ b/app/assets/stylesheets/color-variables.scss
@@ -23,8 +23,8 @@ $light-green: lighten($green, 20%);
 $red: #a80000;
 $blue: #3f8fba;
 
-$sidebars-background: #f0f0f0;
-$sidebars-sub-background: darken($sidebars-background, 12%);
+$sidebars-background: #f0f0f0 !default;
+$sidebars-sub-background: darken($sidebars-background, 12%) !default;
 $left-navbar-drawer-background: darken($sidebars-background, 6%);
 
-$card-shadow: 0 1px 2px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
+$card-shadow: 0 1px 2px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12) !default;
diff --git a/app/assets/stylesheets/color_themes/_color_theme_override.scss b/app/assets/stylesheets/color_themes/_color_theme_override.scss
index acdde2690..9525782fa 100644
--- a/app/assets/stylesheets/color_themes/_color_theme_override.scss
+++ b/app/assets/stylesheets/color_themes/_color_theme_override.scss
@@ -24,7 +24,7 @@ body {
     }
   }
 
-  #left-navbar .hoverable:hover { background-color: $main-color-essence; }
+  .left-navbar .hoverable:hover { background-color: $main-color-essence; }
 
   .poll_form .progress .bar { background-color: $main-color-dark; }
 
diff --git a/app/assets/stylesheets/color_themes/_color_theme_override_origwhite.scss b/app/assets/stylesheets/color_themes/_color_theme_override_origwhite.scss
index 7bd0073c8..ff7450ecf 100644
--- a/app/assets/stylesheets/color_themes/_color_theme_override_origwhite.scss
+++ b/app/assets/stylesheets/color_themes/_color_theme_override_origwhite.scss
@@ -1,23 +1,26 @@
-/* Raw CSS */
 body {
-  #left-navbar .hoverable { border-bottom: none; }
-
-  #left-navbar-fixed-sub-background { background: $sidebars-background; }
-  #left-navbar-fixed-background {
-    background: $sidebars-background;
-    border-right: 1px solid $sidebars-background;
+  #main_stream .stream_element {
+    border: 0;
+    border-bottom: 1px solid $border-grey;
+    margin-bottom: 10px;
   }
-  #left-navbar {
-    background: $sidebars-background;
-    border-right: 1px solid $sidebars-background;
+
+  .profile_header > div {
+    border-bottom: 1px solid $border-grey;
   }
-  #right-sidebar-fixed-sub-background { background: $sidebars-background; }
-  #right-sidebar-fixed-background {
-    background: $sidebars-background;
-    border-left: 1px solid $sidebars-background;
+
+  .left-navbar .hoverable { border-bottom: 0; }
+
+  .profile-sidebar,
+  .left-navbar-fixed-background,
+  &.page-tags .left-navbar-fixed-background,
+  .left-navbar {
+    border-right: 1px solid $border-grey;
   }
+
+  .right-sidebar-fixed-background,
+  .right-sidebar-fixed-background,
   .rightbar {
-    background: $sidebars-background;
     border-left: 1px solid $sidebars-background;
   }
 }
diff --git a/app/assets/stylesheets/color_themes/original_white/_style.scss b/app/assets/stylesheets/color_themes/original_white/_style.scss
index 1885c568a..5997151c8 100644
--- a/app/assets/stylesheets/color_themes/original_white/_style.scss
+++ b/app/assets/stylesheets/color_themes/original_white/_style.scss
@@ -1,12 +1,14 @@
-/* Main color(s) */
+// Main color(s)
 $main-color: #585858;
-$background: #ffffff;
+$background: #fff;
 
-/* Shades */
+// Shades
 $main-color-dark: darken($main-color, 15%);
 
-/* Variables */
+// Variables
 $header-background-color: $main-color-dark;
 $sidebars-background: $background;
+$sidebars-sub-background: $background;
+$card-shadow: none;
 
-@import "color_themes/color_theme_override_origwhite"
+@import 'color_themes/color_theme_override_origwhite';
diff --git a/app/assets/stylesheets/color_themes/original_white/desktop.scss b/app/assets/stylesheets/color_themes/original_white/desktop.scss
index fc325a510..7c6bf9507 100644
--- a/app/assets/stylesheets/color_themes/original_white/desktop.scss
+++ b/app/assets/stylesheets/color_themes/original_white/desktop.scss
@@ -1,2 +1,3 @@
-@import "style";
-@import "application";
+@import 'color-variables';
+@import 'style';
+@import 'application';
diff --git a/app/assets/stylesheets/color_themes/original_white/mobile.scss b/app/assets/stylesheets/color_themes/original_white/mobile.scss
index e8a543736..24ffc11db 100644
--- a/app/assets/stylesheets/color_themes/original_white/mobile.scss
+++ b/app/assets/stylesheets/color_themes/original_white/mobile.scss
@@ -1,2 +1,3 @@
-@import "style";
-@import "mobile/mobile";
+@import 'color-variables';
+@import 'style';
+@import 'mobile/mobile';
diff --git a/app/assets/stylesheets/navbar_left.scss b/app/assets/stylesheets/navbar_left.scss
index 4a9f83175..35896974e 100644
--- a/app/assets/stylesheets/navbar_left.scss
+++ b/app/assets/stylesheets/navbar_left.scss
@@ -1,18 +1,18 @@
 /* Fixed backgrounds are a common practice to avoid height issues */
-#left-navbar-fixed-sub-background {
+.left-navbar-fixed-sub-background {
   background: $sidebars-sub-background;
   position: fixed;
   height: 100%;
 }
 
-#left-navbar-fixed-background {
+.left-navbar-fixed-background {
   background: $sidebars-background;
   border-right: 1px solid $light-grey;
   position: fixed;
   height: 100%;
 }
 
-#left-navbar {
+.left-navbar {
   background: $sidebars-background;
   border-right: 1px solid $light-grey;
   a {
diff --git a/app/assets/stylesheets/navbar_right.scss b/app/assets/stylesheets/navbar_right.scss
index 4a75bd450..6737418eb 100644
--- a/app/assets/stylesheets/navbar_right.scss
+++ b/app/assets/stylesheets/navbar_right.scss
@@ -1,11 +1,11 @@
-#right-sidebar-fixed-background {
+.right-sidebar-fixed-background {
   height: 100%;
   border-left: 1px solid $light-grey;
   background: $sidebars-background;
   position: fixed;
   right: 0;
 }
-#right-sidebar-fixed-sub-background {
+.right-sidebar-fixed-sub-background {
   height: 100%;
   background: $sidebars-sub-background;
   position: fixed;
@@ -89,7 +89,7 @@
 }
 
 @media screen and (min-width: 1200px) {
-  #right-sidebar-fixed-background {
+  .right-sidebar-fixed-background {
     margin-right: 8.33333%; /* Only for LARGE screens, same as lg-offset-1 class, BS3 does not provide right side offsetting */
   }
 }
diff --git a/app/assets/stylesheets/tag.scss b/app/assets/stylesheets/tag.scss
index a70a70592..037cc1c70 100644
--- a/app/assets/stylesheets/tag.scss
+++ b/app/assets/stylesheets/tag.scss
@@ -24,8 +24,8 @@ h1.tag {
 }
 .page-tags {
   background-color: $sidebars-background;
+  .left-navbar-fixed-background { border-right: 0; }
   #tags_show {
-    #left-navbar-fixed-background { border-right: none; }
     .col-md-3 {
       h4 { margin: 25px 0 15px; }
       .side_stream #people_stream {
diff --git a/app/views/people/show.html.haml b/app/views/people/show.html.haml
index 403d7e108..d980b2281 100644
--- a/app/views/people/show.html.haml
+++ b/app/views/people/show.html.haml
@@ -14,7 +14,7 @@
 .container-fluid#profile_container
   .row
     .col-md-3
-      #profile
+      .profile-sidebar#profile
         -# here be JS
 
     .col-md-9
diff --git a/app/views/streams/main_stream.html.haml b/app/views/streams/main_stream.html.haml
index ee0e0e57b..b2c5ad088 100644
--- a/app/views/streams/main_stream.html.haml
+++ b/app/views/streams/main_stream.html.haml
@@ -22,9 +22,9 @@
 
 %div.container-fluid
   .row
-    #left-navbar-fixed-sub-background.col-lg-1.visible-lg
-    #left-navbar-fixed-background.col-lg-offset-1.col-lg-2.col-md-3.hidden-sm.hidden-xs
-    #left-navbar.col-lg-offset-1.col-lg-2.col-md-3
+    .left-navbar-fixed-sub-background.col-lg-1.visible-lg
+    .left-navbar-fixed-background.col-lg-offset-1.col-lg-2.col-md-3.hidden-sm.hidden-xs
+    .left-navbar.col-lg-offset-1.col-lg-2.col-md-3
       #home_user_badge
         = owner_image_link
         %h4
@@ -48,8 +48,8 @@
       #aspect_stream_container.stream_container
         = render 'aspects/aspect_stream', stream: @stream
 
-    #right-sidebar-fixed-sub-background.col-lg-3.visible-lg
-    #right-sidebar-fixed-background.col-md-3.col-lg-2.hidden-sm.hidden-xs
+    .right-sidebar-fixed-sub-background.col-lg-3.visible-lg
+    .right-sidebar-fixed-background.col-md-3.col-lg-2.hidden-sm.hidden-xs
     .col-md-3.col-lg-2.hidden-xs.hidden-sm.rightbar
       #selected_aspect_contacts.section
         .title
diff --git a/app/views/tags/show.haml b/app/views/tags/show.haml
index 67ce26712..f40a6f889 100644
--- a/app/views/tags/show.haml
+++ b/app/views/tags/show.haml
@@ -10,8 +10,8 @@
 
 .container-fluid#tags_show
   .row
-    .col-lg-1.visible-lg#left-navbar-fixed-sub-background
-    .col-lg-offset-1.col-lg-3.col-md-4.hidden-sm.hidden-xs#left-navbar-fixed-background
+    .col-lg-1.visible-lg.left-navbar-fixed-sub-background
+    .col-lg-offset-1.col-lg-3.col-md-4.hidden-sm.hidden-xs.left-navbar-fixed-background
     .col-lg-offset-1.col-lg-3.col-md-4
       %h4
         = t('.tagged_people', count: @stream.tagged_people_count, tag: @stream.display_tag_name)
@@ -34,7 +34,7 @@
           %span.loader.hidden
             .spinner
 
-    .col-lg-1.visible-lg#right-sidebar-fixed-sub-background
+    .col-lg-1.visible-lg.right-sidebar-fixed-sub-background
 
       %a.back-to-top#back-to-top{title: "#{t('layouts.application.back_to_top')}", href: "#"}
         ⇧
diff --git a/config/color_themes.yml b/config/color_themes.yml
index 79446014b..6aaa75dfc 100644
--- a/config/color_themes.yml
+++ b/config/color_themes.yml
@@ -1,6 +1,6 @@
 available:
   original: "Original Dark"
+  original_white: "Original White Background"
   dark_green: "Dark Green"
   magenta: "Magenta"
   egyptian_blue: "Egyptian Blue"
-  original_white: "Original White Background"