Add color for text_view_bg. Fixes #755

* Update README.md with instructions to use SassC

Updates the Build It instructions for using SassC instead of Ruby Sass

* Updates Makefile to replace Ruby Sass with SassC

This commit replaces the use of the Ruby Sass scss command with SassC's sassc command. Due to the more limited functionality of sassc, output directories must be created prior to running the command and only one file may be processed at a time unlike the many-to-many mode functionality of the scss command.

* Makes import directive relative in _gnome-terminal.scss

This commit changes the "widgets/button" import directive to be relative in the gtk-3.20 _gnome-terminal.scss file which is necessary when using SassC.

* Removes import directive in _gnome-terminal.scss 

This commit removes the "widgets/button" import directive in the gtk-3.20 _gnome-terminal.scss file which is unnecessary.

Co-authored-by: KTB <ktb83@users.noreply.github.com>

Makefile

@@ -1,5 +1,5 @@
-SASS=scss
-SASSFLAGS=--sourcemap=none
+SASS=sassc
+SASSFLAGS=-M -t expanded
 GLIB_COMPILE_RESOURCES=glib-compile-resources
 RES_DIR=src/gtk-3.0
 SCSS_DIR=$(RES_DIR)/scss
@@ -14,8 +14,12 @@ UTILS=scripts/utils.sh
 all: clean gresource
 
 css:
-	$(SASS) --update $(SASSFLAGS) $(SCSS_DIR):$(DIST_DIR)
-	$(SASS) --update $(SASSFLAGS) $(SCSS_DIR320):$(DIST_DIR320)
+	mkdir $(DIST_DIR)
+	$(SASS) $(SASSFLAGS) $(SCSS_DIR)/gtk.scss $(DIST_DIR)/gtk.css
+	$(SASS) $(SASSFLAGS) $(SCSS_DIR)/gtk-dark.scss $(DIST_DIR)/gtk-dark.css
+	mkdir $(DIST_DIR320)
+	$(SASS) $(SASSFLAGS) $(SCSS_DIR320)/gtk.scss $(DIST_DIR320)/gtk.css
+	$(SASS) $(SASSFLAGS) $(SCSS_DIR320)/gtk-dark.scss $(DIST_DIR320)/gtk-dark.css
 
 gresource: css
 	$(GLIB_COMPILE_RESOURCES) --sourcedir=$(RES_DIR) $(RES_DIR)/gtk.gresource.xml

README.md

@@ -16,18 +16,16 @@
 
 First, you need to compile the theme using the [Sass](http://sass-lang.com/) compiler.
 
-To install Sass, install Ruby and the gem command using your distribution's package manager. Then install `sass` with the `gem` command,
-
-`gem install sass` (not needed for Ubuntu/Debian)
+You will need to install SassC (`sassc`) which is likely to be available as a package in your distribution's software repositories.
 
 You'll also need the ```glib-compile-schemas``` and  ```gdk-pixbuf-pixdata``` commands in your path to generate the gresource binary. Install them using your distribution's package manager.
 
 |Distro|Commands|
 |:----:|:----:|
-|![arch][arch]  ![antergos][antergos]|`sudo pacman -S glib2 gdk-pixbuf2`|
-|![opensuse][opensuse]|`sudo zipper install glib2-devel gdk-pixbuf-devel`|
-|![fedora][fedora]|`sudo dnf install glib2-devel gdk-pixbuf2-devel`|
-|![debian][debian]  ![ubuntu][ubuntu]|`sudo apt-get install ruby-sass libglib2.0-dev libgdk-pixbuf2.0-dev libxml2-utils`|
+|![arch][arch]  ![antergos][antergos]|`sudo pacman -S sassc glib2 gdk-pixbuf2`|
+|![opensuse][opensuse]|`sudo zypper install sassc glib2-devel gdk-pixbuf-devel`|
+|![fedora][fedora]|`sudo dnf install sassc glib2-devel gdk-pixbuf2-devel`|
+|![debian][debian]  ![ubuntu][ubuntu]|`sudo apt-get install sassc libglib2.0-dev libgdk-pixbuf2.0-dev libxml2-utils`|
 
 After installing all the dependencies, change to the cloned directory and, run the following in Terminal,
 
@@ -49,6 +47,8 @@ xfconf-query -c xsettings -p /Net/ThemeName -s "Numix"
 xfconf-query -c xfwm4 -p /general/theme -s "Numix"
 ```
 
+In Openbox you can set the theme with [ObConf](http://openbox.org/wiki/ObConf:About) tool. Alternatively, you can set the theme by changing the `<name> `key value to `Numix` in the `<theme>` section of your rc.xml file.
+
 ### For contributors
 Start by reviewing the [guidelines for contributing](https://github.com/numixproject/numix-gtk-theme/blob/master/.github/CONTRIBUTING.md).
 

src/gtk-3.0/scss/_colors.scss

@@ -31,6 +31,7 @@
 @define-color success_color #{"" + $success_color};
 @define-color warning_color #{"" + $warning_color};
 @define-color error_color #{"" + $error_color};
+@define-color text_view_bg #{"" + $base_color};
 
 /* widget colors */
 @define-color titlebar_bg_color @dark_bg_color;

src/gtk-3.0/scss/_widgets.scss

@@ -31,6 +31,7 @@
 @import "apps/nemo";
 @import "apps/panel";
 @import "apps/synaptic";
+@import "apps/thunar";
 @import "apps/xfce";
 @import "apps/unity";
 @import "apps/lightdm";

src/gtk-3.0/scss/apps/_thunar.scss

@@ -0,0 +1,17 @@
+@include exports("thunar") {
+.thunar {
+  scrolledwindow.sidebar treeview.view {
+    background: $bg_color;
+    color: $fg_color;
+    
+    &:selected, &:active {
+      background: $selected_bg_color;
+      color: $selected_fg_color;
+    }
+  }
+
+  scrolledwindow.shortcuts-pane {
+    border-top-width: 1;
+  }
+ }
+}

src/gtk-3.0/scss/apps/_xfce.scss

@@ -23,4 +23,17 @@
 
         .menu { -gtk-image-effect: none; }
     }
+
+    #XfceNotifyWindow {
+        background-color: $osd_bg;
+        color: $osd_fg;
+        border-radius: $roundness;
+        border: 1px solid border_normal($osd_bg);
+
+        GtkLabel {
+            &#summary {
+                font-weight: bold;
+            }
+        }
+    }
 }

src/gtk-3.0/scss/widgets/_osd.scss

@@ -8,8 +8,7 @@
 @include exports("osd") {
     GtkOverlay.osd { background-color: transparent; }
 
-    .osd,
-    #XfceNotifyWindow {
+    .osd {
         &.background {
             background-color: alpha($osd_bg, .8);
             color: $osd_fg;

src/gtk-3.20/scss/_colors.scss

@@ -31,6 +31,7 @@
 @define-color success_color #{"" + $success_color};
 @define-color warning_color #{"" + $warning_color};
 @define-color error_color #{"" + $error_color};
+@define-color text_view_bg #{"" + $base_color};
 
 /* widget colors */
 @define-color titlebar_bg_color @dark_bg_color;

src/gtk-3.20/scss/_widgets.scss

@@ -34,8 +34,10 @@
 @import "apps/nemo";
 @import "apps/panel";
 @import "apps/synaptic";
+@import "apps/thunar";
 @import "apps/xfce";
 @import "apps/unity";
 @import "apps/lightdm";
 @import "apps/gnome-terminal";
 @import "apps/budgie";
+@import "apps/eclipse";

src/gtk-3.20/scss/apps/_budgie.scss

@@ -24,4 +24,38 @@
     .raven-mpris {
         background-color: transparentize($bg_color, .3);
     }
+
+    .budgie-panel {
+        background-color: $dark_bg_color;
+        color: $dark_fg_color;
+    }
+    
+    .budgie-panel > box > widget > separator {
+        background-color: transparentize($dark_fg_color, .8);
+    }
+    
+    .workspace-switcher {
+        background-color: $dark_bg_color;
+        .workspace-icon-button {
+            background-color: transparent;
+            &:hover {
+                background-color: transparentize($selected_bg_color, .5);
+                border: transparent;
+            }
+        }
+        .workspace-more-label {
+            color: $dark_fg_color;
+        }
+        .workspace-add-button {
+            background-color: transparentize($selected_bg_color, .8);
+            color: $selected_bg_color;
+            border: transparent;
+            &:hover {
+                background-color: transparentize($selected_bg_color, .5);
+            }
+        }
+        .current-workspace {
+            background-color: $selected_bg_color;
+        }
+    }
 }

src/gtk-3.20/scss/apps/_eclipse.scss

@@ -0,0 +1,9 @@
+/***********
+ ! Eclipse *
+ ***********/
+
+@include exports("eclipse") {
+	button.flat.image-button > image {
+		padding: 3px;
+	}
+}

src/gtk-3.20/scss/apps/_gnome-terminal.scss

@@ -1,5 +1,3 @@
-@import "widgets/button";
-
 /**********************
  ! Genome Terminal *
 ***********************/

src/gtk-3.20/scss/apps/_thunar.scss

@@ -0,0 +1,17 @@
+@include exports("thunar") {
+.thunar {
+  scrolledwindow.sidebar treeview.view {
+    background: $bg_color;
+    color: $fg_color;
+    
+    &:selected, &:active {
+      background: $selected_bg_color;
+      color: $selected_fg_color;
+    }
+  }
+
+  scrolledwindow.shortcuts-pane {
+    border-top-width: 1;
+  }
+ }
+}

src/gtk-3.20/scss/apps/_xfce.scss

@@ -27,4 +27,65 @@
             text-shadow: none;
         }
     }
+
+    #XfceNotifyWindow {
+        .osd {
+            background-color: $osd_bg;
+            color: $osd_fg;
+            border-radius: $roundness;
+            border: 1px solid border_normal($osd_bg);
+        }
+
+        &.osd {
+            label {
+                &#summary {
+                    font-weight: bold;
+                }
+            }
+        }
+    }
+
+    #whiskermenu-window {
+		* {
+			border-color: border_normal($dark_bg_color);
+			outline: none;
+        }
+
+        background-color: $dark_bg_color;
+        color: $dark_fg_color;
+
+        entry {
+			background-color: shade($dark_bg_color, 1.2);
+			color: $dark_fg_color;
+        }
+
+        button {
+            font-weight: bold;
+            padding: 6px 12px;
+			margin: 3px 0px;
+			border: none;
+			@include linear_gradient($dark_bg_color);
+			color: $dark_fg_color;
+
+			&:focus, &:hover {
+			    background-color: $selected_bg_color;
+                color: $selected_fg_color;
+			}
+
+			&:checked {
+                background-color: shade($selected_bg_color, .9);
+                color: $selected_fg_color;
+			}
+        }
+
+        treeview {
+            background-color: shade($dark_bg_color, 1.2);
+			color: $dark_fg_color;
+
+			&:selected, &:hover {
+                background-color: $selected_bg_color;
+                color: $selected_fg_color;
+			}
+        }
+    }
 }

src/gtk-3.20/scss/widgets/_osd.scss

@@ -23,8 +23,7 @@
         }
     }
 
-    button.osd,
-    #XfceNotifyWindow button {
+    button.osd {
         @include button($osd_bg, $osd_fg);
 
         &.image-button {
@@ -73,8 +72,7 @@
         }
     }
 
-    .osd,
-    #XfceNotifyWindow {
+    .osd {
         background-color: $osd_bg;
         color: $osd_fg;
 

src/openbox-3/themerc

@@ -59,6 +59,9 @@ window.active.button.hover.bg: flat solid
 window.active.button.hover.bg.color: #444444
 window.active.button.hover.image.color: #f06860
 
+window.active.button.toggled.image.color: #eeeeee
+window.active.button.toggled.hover.image.color: #f06860
+
 
 # Inactive window
 window.inactive.border.color: #393939
@@ -93,6 +96,9 @@ window.inactive.button.hover.bg: flat solid
 window.inactive.button.hover.bg.color: #444444
 window.inactive.button.hover.image.color: #f06860
 
+window.inactive.button.toggled.image.color: #888888
+window.inactive.button.toggled.hover.image.color: #f06860
+
 
 # OSD
 osd.border.width: 1