Added xfce and lightdm styles

gtk-3.0/scss/_colors.scss

@@ -53,14 +53,14 @@
 @define-color lightdm_fg_color #{"" + $lightdm_fg_color};
 
 /* window manager colors */
-@define-color wm_bg @titlebar_bg_color;
+@define-color wm_bg #{"" + $wm_bg};
-@define-color wm_border_focused mix(shade(@titlebar_bg_color, 0.7), @titlebar_fg_color, 0.21);
+@define-color wm_border_focused #{"" + $wm_border_focused};
-@define-color wm_border_unfocused mix(shade(@titlebar_bg_color, 0.7), @titlebar_fg_color, 0.12);
+@define-color wm_border_unfocused #{"" + $wm_border_unfocused};
-@define-color wm_title_focused mix(@titlebar_fg_color, @titlebar_bg_color, 0.1);
+@define-color wm_title_focused #{"" + $wm_title_focused};
-@define-color wm_title_unfocused mix(@titlebar_fg_color, @titlebar_bg_color, 0.4);
+@define-color wm_title_unfocused #{"" + $wm_title_unfocused};
-@define-color wm_icons_focused mix(@titlebar_fg_color, @titlebar_bg_color, 0.1);
+@define-color wm_icons_focused #{"" + $wm_icons_focused};
-@define-color wm_icons_focused_prelight @selected_bg_color;
+@define-color wm_icons_focused_prelight #{"" + $wm_icons_focused_prelight};
-@define-color wm_icons_focused_pressed shade(@selected_bg_color, 0.8);
+@define-color wm_icons_focused_pressed #{"" + $wm_icons_unfocused_pressed};
-@define-color wm_icons_unfocused mix(@titlebar_fg_color, @titlebar_bg_color, 0.4);
+@define-color wm_icons_unfocused #{"" + $wm_icons_unfocused};
-@define-color wm_icons_unfocused_prelight @selected_bg_color;
+@define-color wm_icons_unfocused_prelight #{"" + $wm_icons_unfocused_prelight};
-@define-color wm_icons_unfocused_pressed shade(@selected_bg_color, 0.8);
+@define-color wm_icons_unfocused_pressed #{"" + $wm_icons_unfocused_pressed};

gtk-3.0/scss/_functions.scss

@@ -1,5 +1,3 @@
-@import "global";
-
 $modules: () !default;
 
 @mixin exports($name) {

gtk-3.0/scss/_global.scss

@@ -1,3 +1,5 @@
+@import "functions";
+
 // default color scheme
 $bg_color: #eee;
 $fg_color: #333;
@@ -51,8 +53,20 @@ $osd_fg: $dark_fg_color;
 $lightdm_bg_color: $dark_bg_color;
 $lightdm_fg_color: $dark_fg_color;
 
+$wm_bg: $titlebar_bg_color;
+$wm_border_focused: mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.21);
+$wm_border_unfocused: mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.12);
+$wm_title_focused: mix($titlebar_fg_color, $titlebar_bg_color, 0.1);
+$wm_title_unfocused: mix($titlebar_fg_color, $titlebar_bg_color, 0.4);
+$wm_icons_focused: mix($titlebar_fg_color, $titlebar_bg_color, 0.1);
+$wm_icons_focused_prelight: $selected_bg_color;
+$wm_icons_focused_pressed: shade($selected_bg_color, 0.8);
+$wm_icons_unfocused: mix($titlebar_fg_color, $titlebar_bg_color, 0.4);
+$wm_icons_unfocused_prelight: $selected_bg_color;
+$wm_icons_unfocused_pressed: shade($selected_bg_color, 0.8);
+
 // widget styles
 $roundness: 2px;
-$spacing: 5px;
+$spacing: 4px;
 $gradient: 0;
 $contrast: .7;

gtk-3.0/scss/apps/_lightdm.scss

@@ -0,0 +1,193 @@
+/***********************
+ ! LightDM GTK Greeter *
+ ***********************/
+
+@include exports("lightdm") {
+    #panel_window {
+        background-color: transparent;
+        background-image: none;
+        color: white;
+        font: bold;
+        text-shadow: 0 1px alpha(black, 0.5);
+        icon-shadow: 0 1px alpha(black, 0.5);
+
+        .menubar {
+            &, > .menuitem {
+                background-color: transparent;
+                background-image: none;
+                color: white;
+                font: bold;
+                text-shadow: 0 1px alpha(black, 0.5);
+                icon-shadow: 0 1px alpha(black, 0.5);
+
+                *:hover { color: white; }
+
+                &:hover {
+                    border-style: none;
+                    background-color: alpha(white, 0.2);
+                    background-image: none;
+                    color: white;
+                }
+
+                &:insensitive { color: alpha(white, 0.7); }
+
+                .menu {
+                    border-radius: 1px;
+
+                    .menuitem {
+                        font: normal;
+                        text-shadow: none;
+                    }
+                }
+            }
+        }
+    }
+
+    #content_frame { padding-bottom: 14px; }
+
+    #login_window, #shutdown_dialog, #restart_dialog {
+        border-style: none;
+        border-radius: $roundness;
+        background-color: $lightdm_bg_color;
+        color: $lightdm_fg_color;
+
+        /* draw border using box-shadow */
+        box-shadow: inset 1px 0 mix(shade($lightdm_bg_color, 0.7), $lightdm_fg_color, 0.21),
+                    inset -1px 0 mix(shade($lightdm_bg_color, 0.7), $lightdm_fg_color, 0.21),
+                    inset 0 1px mix(shade($lightdm_bg_color, 0.7), $lightdm_fg_color, 0.21),
+                    inset 0 -1px mix(shade($lightdm_bg_color, 0.7), $lightdm_fg_color, 0.21);
+
+        .button {
+            padding: 3px 15px;
+            border-width: 1px;
+            border-radius: $roundness;
+            border-style: solid;
+            border-color: shade($lightdm_bg_color, 0.8);
+            background-color: shade($lightdm_bg_color, 1.08);
+            background-image: none;
+            color: $lightdm_fg_color;
+            transition: all 150ms ease-out;
+
+            &.default, &:focus, &:active:focus {
+                border-color: shade($selected_bg_color, 0.8);
+                background-color: shade($selected_bg_color, 1.08);
+                background-image: none;
+                color: $selected_fg_color;
+
+                &:hover {
+                    border-color: shade($selected_bg_color, 0.7);
+                    background-color: $selected_bg_color;
+                }
+            }
+        }
+    }
+
+
+    #login_window {
+        .menu { border-radius: 1px; }
+
+        GtkComboBox .button {
+            &, &:hover, &:active, &:active:hover,
+            &:focus, &:hover:focus, &:active:focus, &:active:hover:focus {
+                padding: 0;
+                background: none;
+                border-style: none;
+                box-shadow: none;
+            }
+        }
+
+        .entry {
+            padding: 3px 5px;
+            border-width: 1px;
+            border-style: solid;
+            border-color: shade($lightdm_bg_color, 0.8);
+            border-radius: $roundness;
+            background-color: shade($lightdm_bg_color, 0.9);
+            background-image: none;
+            color: $lightdm_fg_color;
+            box-shadow: none;
+            transition: all 150ms ease-out;
+
+            &:focus, &:hover {
+                border-color: shade($lightdm_bg_color, 0.7);
+
+                box-shadow: inset 1px 0 alpha($dark_shadow, 0.10),
+                            inset 0 1px alpha($dark_shadow, 0.12),
+                            inset -1px 0 alpha($dark_shadow, 0.10),
+                            inset 0 -1px alpha($dark_shadow, 0.05);
+            }
+        }
+    }
+
+    #user_combobox {
+        color: $lightdm_fg_color;
+        font: 18px;
+
+        .menu { font: normal; }
+
+        .arrow { olor: mix($lightdm_fg_color, $lightdm_bg_color, 0.5); }
+    }
+
+    #user_image {
+        padding: 3px;
+        border-radius: $roundness;
+
+        /* draw border using box-shadow */
+        box-shadow: inset 1px 0 shade($lightdm_bg_color, 0.7),
+                    inset -1px 0 shade($lightdm_bg_color, 0.7),
+                    inset 0 1px shade($lightdm_bg_color, 0.7),
+                    inset 0 -1px shade($lightdm_bg_color, 0.7);
+    }
+
+    #user_image_border {
+        border-radius: $roundness;
+        background-color: shade($lightdm_bg_color, 0.9);
+        background-image: none;
+        box-shadow: inset 1px 0 alpha($dark_shadow, 0.07),
+                    inset 0 1px alpha($dark_shadow, 0.08),
+                    inset -1px 0 alpha($dark_shadow, 0.07),
+                    inset 0 -1px alpha($dark_shadow, 0.05);
+    }
+
+    #buttonbox_frame {
+        padding-top: 10px;
+        padding-bottom: 0;
+        border-style: none;
+        border-bottom-left-radius: $roundness;
+        border-bottom-right-radius: $roundness;
+        background-color: transparent;
+        background-image: none;
+        box-shadow: none;
+    }
+
+
+
+    /* shutdown button */
+    #shutdown_button {
+        border-color: shade($error_bg_color, 0.8);
+        background-color: shade($error_bg_color, 1.08);
+        background-image: none;
+        color: $error_fg_color;
+
+        &:hover, &:active, &:active:hover {
+            border-color: shade($error_bg_color, 0.7);
+            background-color: $error_bg_color;
+        }
+    }
+
+    /* restart button */
+    #restart_button {
+        border-color: shade($warning_bg_color, 0.8);
+        background-color: shade($warning_bg_color, 1.08);
+        background-image: none;
+        color: $warning_fg_color;
+
+        &:hover, &:active, &:active:hover {
+            border-color: shade($warning_bg_color, 0.7);
+            background-color: $warning_bg_color;
+        }
+    }
+
+     /* password warning */
+    #greeter_infobar { font: bold; }
+}

gtk-3.0/scss/apps/_panel.scss

@@ -9,18 +9,7 @@
         color: $panel_fg_color;
     }
 
-    PanelWidget, PanelApplet, PanelToplevel {
+    %panelbutton {
-        @extend %panel;
-
-        padding: 0;
-    }
-
-    PanelApplet {
-        border: none;
-
-        .button {
-            -GtkButton-inner-border: 2;
-
         border-width: 0 1px;
         border-radius: 0;
         border-color: transparent;
@@ -48,6 +37,21 @@
             }
         }
     }
+
+    PanelWidget, PanelApplet, PanelToplevel {
+        @extend %panel;
+
+        padding: 0;
+    }
+
+    PanelApplet {
+        border: none;
+
+        .button {
+            @extend %panelbutton;
+
+            -GtkButton-inner-border: 2;
+        }
     }
 
     PanelSeparator {

gtk-3.0/scss/apps/_unity.scss

@@ -0,0 +1,70 @@
+@import "panel";
+
+/****************
+ ! Unity styles *
+*****************/
+
+@include exports("unity") {
+    UnityDecoration {
+        -UnityDecoration-extents: 28px 1px 1px 1px;
+        -UnityDecoration-input-extents: 10px;
+
+        -UnityDecoration-shadow-offset-x: 1px;
+        -UnityDecoration-shadow-offset-y: 1px;
+        -UnityDecoration-active-shadow-color: rgba(0,0,0,0.7);
+        -UnityDecoration-active-shadow-radius: 8px;
+        -UnityDecoration-inactive-shadow-color: rgba(0,0,0,0.5);
+        -UnityDecoration-inactive-shadow-radius: 5px;
+
+        -UnityDecoration-glow-size: 10px;
+        -UnityDecoration-glow-color: $selected_bg_color;
+
+        -UnityDecoration-title-indent: 10px;
+        -UnityDecoration-title-fade: 35px;
+        -UnityDecoration-title-alignment: 0.0;
+
+
+        &.top {
+            border: 1px solid $wm_border_focused;
+            border-bottom: none;
+            border-radius: 2px 2px 0 0;
+            padding: 1px ($spacing * 2) 0 ($spacing * 2);
+            background-color: $titlebar_bg_color;
+            color: mix($titlebar_fg_color, $titlebar_bg_color, 0.1);
+            text-shadow: none;
+
+            &:backdrop {
+                border: 1px solid $wm_border_unfocused;
+                color: mix($titlebar_fg_color, $titlebar_bg_color, 0.4);
+            }
+        }
+
+        &.left, &.right, &.bottom {
+            background-color: $wm_border_focused;
+
+            &:backdrop { background-color: $wm_border_unfocused; }
+        }
+    }
+
+    UnityPanelWidget, .unity-panel {
+        @extend %panel;
+
+        border: none;
+    }
+
+    .unity-panel {
+        &.menuitem, .menuitem {
+            border-width: 0 1px;
+            color: $panel_fg_color;
+
+            &:hover, *:hover {
+                border-color: mix($panel_bg_color, $panel_fg_color, 0.21);
+                background-color: mix($panel_bg_color, $panel_fg_color, 0.21);
+                background-image: none;
+                color: shade($panel_fg_color, 1.08);
+            }
+        }
+    }
+
+    SheetStyleDialog.unity-force-quit { background-color: $bg_color; }
+}

gtk-3.0/scss/apps/_xfce.scss

@@ -0,0 +1,26 @@
+@import "panel";
+
+/***************
+ ! Xfce styles *
+****************/
+
+@include exports("xfce") {
+    XfceHeading {
+        margin: 0;
+        padding: 0;
+        border: none;
+        background-image: none;
+        background-color: $base_color;
+        color: $text_color;
+    }
+
+    .xfce4-panel {
+        @extend %panel;
+
+        font: normal;
+
+        .button { @extend %panelbutton; }
+
+        .menu { -gtk-image-effect: none; }
+    }
+}

gtk-3.0/scss/gtk.scss

@@ -30,3 +30,6 @@
 @import "apps/nemo";
 @import "apps/panel";
 @import "apps/synaptic";
+@import "apps/xfce";
+@import "apps/unity";
+@import "apps/lightdm";

gtk-3.0/scss/widgets/_window.scss

@@ -3,27 +3,32 @@
 ***************/
 
 @include exports("window") {
-	.window-frame {
+	%window {
-		border: none;
-		border-radius: $roundness $roundness 0 0;
 		box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23),
-					0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.21);
+					0 0 0 1px $wm_border_focused;
-
-		/* this is used for the resize cursor area */
-		margin: $spacing * 3;
 
 		&:backdrop {
 			box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24),
-						0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.12);
+						0 0 0 1px $wm_border_unfocused;
 		}
+	}
+
+	.window-frame {
+		@extend %window;
+
+		border: none;
+		border-radius: $roundness $roundness 0 0;
+
+		/* this is used for the resize cursor area */
+		margin: $spacing * 3;
 
 		&.tiled { border-radius: 0; }
 
 		&.csd {
 			&.popup {
+				@extend %window;
+
 				border-radius: 0;
-				box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23),
-							0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.21);
 			}
 
 			&.tooltip {
@@ -32,9 +37,9 @@
 			}
 
 			&.message-dialog {
+				@extend %window;
+
 				border-radius: $roundness;
-				box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23),
-							0 0 0 1px mix(shade($titlebar_bg_color, 0.7), $titlebar_fg_color, 0.21);
 			}
 		}
 	}