Gtk+-3.20 Submarine themes: enable outlines and some focus fixes

3 files changed, 191 insertions, 22 deletions

diff --git a/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css b/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css
index 7349b485..9a184a57 100644
--- a/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css
+++ b/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css
@@ -23,8 +23,8 @@
     /* Highlight drag-drop destination */

     outline-color: alpha(@theme_selected_bg_color, 0.3);

     outline-style: dashed;

-    outline-offset: -3px; /* 2px */

-    outline-width: 0px; /* disable ugly focus-line */

+    outline-offset: -3px;

+    outline-width: 1px;

     -gtk-outline-radius: 2px;

     -gtk-icon-style: regular; /* no symbolic icons */

 }

@@ -974,6 +974,7 @@ button {
 /* box-shadow: [ inset ] horizontal_offset vertical_offset [ blur_radius ] [ spread ] color */

     color:             @theme_fg_color;

     text-shadow: none;

+    outline-style: none;

 }

 

 button.default {

@@ -1041,10 +1042,10 @@ button:checked:hover:active {
 button:focus,

 button.default {

     border-color: transparent;

-    box-shadow: inset  0px  1px shade(@selected_bg_color, 1.05),

-                inset  1px  0px shade(@selected_bg_color, 0.97),

-                inset -1px  0px shade(@selected_bg_color, 0.93),

-                inset  0px -1px shade(@selected_bg_color, 0.93);

+    box-shadow: inset  0px  1px shade(rgb(0,204,133), 1.00),

+                inset  1px  0px shade(rgb(0,204,133), 1.00),

+                inset -1px  0px shade(rgb(0,204,133), 1.00),

+                inset  0px -1px shade(rgb(0,204,133), 1.00);

 }

 

 button:hover:active,

@@ -2148,6 +2149,14 @@ combobox button.combo:hover {
     color: @theme_text_color;

 }

 

+combobox button.combo:focus,

+combobox .linked button.combo:focus {

+    box-shadow: inset  0px  1px shade(rgb(0,204,133), 1.00),

+                inset  1px  0px shade(rgb(0,204,133), 1.00),

+                inset -1px  0px shade(rgb(0,204,133), 1.00),

+                inset  0px -1px shade(rgb(0,204,133), 1.00);

+}

+

 toolbar combobox cellview {

     /* color combobox read-only */

     color: shade(@toolbar_fg_color, 0.94);

@@ -2568,6 +2577,7 @@ toolbar toolbutton button.flat.toggle.popup:focus {
 

 }

 

+toolbar toolitem combobox button.combo:focus,

 toolbar toolbutton button.flat.text-button:focus:hover,

 toolbar toolbutton button.flat.toggle.popup:focus:hover,

 toolbar toolitem combobox button.combo:hover {

@@ -2581,10 +2591,6 @@ toolbar toolitem combobox button.combo:hover {
                 inset  0px -1px shade(@selected_bg_color, 0.93);

 }

 

-toolbar toolbutton button.flat.text-button:focus {

-    box-shadow: none;

-}

-

 /********************

  * Menubar Toolbars *

  ********************/

@@ -2674,10 +2680,6 @@ toolbar.primary-toolbar button {
     text-shadow: none;

 }

 

-toolbar.primary-toolbar .linked button:focus {

-   box-shadow: none;

-}

-

 toolbar button:disabled,

 toolbar.primary-toolbar button:disabled {

     background-image: none;

@@ -2695,6 +2697,7 @@ toolbar.primary-toolbar button:disabled {
     text-shadow: none;

 }

 

+toolbar button:focus,

 toolbar button:hover,

 toolbar button:hover:active,

 toolbar button:focus:hover:active,

@@ -2716,6 +2719,7 @@ toolbar button:checked:hover:active {
                 inset  0px -1px shade(@selected_bg_color, 0.93);

 }

 

+toolbar.primary-toolbar button:focus,

 toolbar.primary-toolbar button:hover,

 toolbar.primary-toolbar button:hover:active,

 toolbar.primary-toolbar button:checked,

@@ -2763,6 +2767,11 @@ toolbar.primary-toolbar button:checked:disabled {
     text-shadow: none;

 }

 

+/* ie. atril */

+.primary-toolbar toolbar toolitem combobox .linked button.combo {

+    padding: 8px 4px;

+}

+

 toolbar label {

     color: shade(@theme_fg_color, 1.10);

     text-shadow: none;

@@ -3105,6 +3114,97 @@ toolbar.inline-toolbar button:checked {
     -gtk-icon-shadow: 1px 1px @theme_selected_shadow_color;

 }

 

+notebook toolbar.horizontal.inline-toolbar {

+    border-width: 0 1px 1px 1px;

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button label {

+    color:       @theme_fg_color;

+    text-shadow: none;

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button:disabled label {

+    color: @insensitive_fg_color;

+    text-shadow: none;

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button {

+    background-image: -gtk-gradient (linear,

+                                     left top, left bottom,

+                                     from (@button_gradient1),

+                                     color-stop (0.50, @button_gradient3),

+                                     to   (@button_gradient4));

+    border-width: 1px;

+    border-radius: 4px;

+    border-style: solid;

+    border-top-color:    transparent;

+    border-left-color:   alpha (#000, 0.01);

+    border-right-color:  alpha (#000, 0.01);

+    border-bottom-color: alpha (#000, 0.03);

+    box-shadow: inset  0px  1px alpha(shade(@button_border, 1.00), 0.70),

+                inset  1px  0px alpha(shade(@button_border, 0.94), 0.80),

+                inset -1px  0px alpha(shade(@button_border, 0.94), 0.80),

+                inset  0px -1px alpha(shade(@button_border, 0.88), 0.90);

+    color:             @theme_fg_color;

+    text-shadow: none;

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button:hover {

+    background-image: -gtk-gradient (linear,

+                                     left top, left bottom,

+                                     from (shade(@button_gradient1, 1.03)),

+                                     color-stop (0.50, shade(@button_gradient3, 1.03)),

+                                     to   (shade(@button_gradient4, 1.01)));

+    box-shadow: inset  0px  1px shade(@selected_bg_color, 1.05),

+                inset  1px  0px shade(@selected_bg_color, 0.97),

+                inset -1px  0px shade(@selected_bg_color, 0.93),

+                inset  0px -1px shade(@selected_bg_color, 0.93);

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button:disabled {

+    border-width: 1px;

+    border-radius: 4px;

+    border-style: solid;

+    background-image: none;

+    background-color: @insensitive_bg_color;

+    border-color: alpha (#000, 0.00);

+    border-bottom-color: alpha (#000, 0.00);

+    border-image: none;

+    box-shadow: inset  0px  1px @insensitive_border_color,

+                inset  1px  0px @insensitive_border_color,

+                inset -1px  0px @insensitive_border_color,

+                inset  0px -1px @insensitive_border_color;

+    color: @insensitive_fg_color;

+    text-shadow: none;

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button,

+notebook toolbar.inline-toolbar toolitem button.text-button:focus,

+notebook toolbar.inline-toolbar toolitem button.text-button:hover {

+    padding: 2px 6px;

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button:focus {

+    box-shadow: inset  0px  1px shade(rgb(0,204,133), 1.00),

+                inset  1px  0px shade(rgb(0,204,133), 1.00),

+                inset -1px  0px shade(rgb(0,204,133), 1.00),

+                inset  0px -1px shade(rgb(0,204,133), 1.00);

+}

+

+notebook toolbar.inline-toolbar toolitem button.text-button:focus:hover:active {

+    background-image: -gtk-gradient (linear,

+                                     left top, left bottom,

+                                     from (shade (@theme_bg_color, 1.20)),

+                                     color-stop (0.50, shade (@theme_bg_color, 1.00)),

+                                     color-stop (0.50, shade (@theme_bg_color, 0.99)),

+                                     to (shade (@theme_bg_color, 0.80)));

+    border-radius: 4px;

+    box-shadow: inset  0px  1px shade(@selected_bg_color, 1.05),

+                inset  1px  0px shade(@selected_bg_color, 0.97),

+                inset -1px  0px shade(@selected_bg_color, 0.93),

+                inset  0px -1px shade(@selected_bg_color, 0.93);

+}

+

 /******************

  * Stack switcher *

  ******************/

@@ -3311,11 +3411,10 @@ spinbutton.vertical > button:active:last-child {
 

 spinbutton.horizontal > entry:focus,

 spinbutton.vertical > entry:focus {

-    border-color: alpha(@borders, 0.1);

-    box-shadow: inset  0px  1px shade(@selected_bg_color, 1.05),

-                inset  1px  0px shade(@selected_bg_color, 0.97),

-                inset -1px  0px shade(@selected_bg_color, 0.93),

-                inset  0px -1px shade(@selected_bg_color, 0.93);

+    box-shadow: inset  0px  1px @button_default_box_shadow_color,

+                inset  1px  0px @button_default_box_shadow_color,

+                inset -1px  0px @button_default_box_shadow_color,

+                inset  0px -1px @button_default_box_shadow_color;

 }

 

 /* volume button */

@@ -3705,6 +3804,39 @@ notebook tab.reorderable-page:checked {
     border-style: solid;

 }

 

+/* outlines */

+notebook header tab:checked {

+    outline-color: @button_default_border_color;

+}

+

+notebook header.top tab:checked {

+    -gtk-outline-top-left-radius: 4px;

+    -gtk-outline-top-right-radius: 4px;

+    -gtk-outline-bottom-left-radius: 0px;

+    -gtk-outline-bottom-right-radius: 0px;

+}

+

+notebook header.bottom tab:checked {

+    -gtk-outline-top-left-radius: 0px;

+    -gtk-outline-top-right-radius: 0px;

+    -gtk-outline-bottom-left-radius: 4px;

+    -gtk-outline-bottom-right-radius: 4px;

+}

+

+notebook header.left tab:checked {

+    -gtk-outline-top-left-radius: 4px;

+    -gtk-outline-top-right-radius: 0px;

+    -gtk-outline-bottom-left-radius: 0px;

+    -gtk-outline-bottom-right-radius: 4px;

+}

+

+notebook header.right tab:checked {

+    -gtk-outline-top-left-radius: 0px;

+    -gtk-outline-top-right-radius: 4px;

+    -gtk-outline-bottom-left-radius: 4px;

+    -gtk-outline-bottom-right-radius: 0px;

+}

+

 /* close button styling */

 notebook > header button.flat,

 notebook > header button.flat.small-button {

@@ -3831,8 +3963,9 @@ checkbutton:checked:focus:hover:active {
 

 checkbutton.text-button,

 radiobutton.text-button {

-  padding: 1px;

-  outline-offset: 0;

+    padding: 1px;

+    outline-offset: 0;

+    outline-color: @button_default_border_color;

 }

 

 /****************

@@ -4055,6 +4188,12 @@ iconview.view.cell:hover:focus {
     border-radius: 4px;

 }

 

+iconview.view.cell:selected:focus {

+    border-color: alpha(@theme_text_color, 0.6);

+    border-width: 1px;

+    border-style: dashed;

+}

+

 view,

 .view, 

 view text,

@@ -4121,6 +4260,7 @@ label selection:backdrop:disabled {
 treeview,

 treeview.view {

     padding: 1px 4px;

+	outline-color: alpha(currentColor, 0.6);

 }

 

 treeview.dnd {

diff --git a/desktop-themes/Green-Submarine/gtk-3.0/gtk.css b/desktop-themes/Green-Submarine/gtk-3.0/gtk.css
index 9c20aeb6..0346099d 100644
--- a/desktop-themes/Green-Submarine/gtk-3.0/gtk.css
+++ b/desktop-themes/Green-Submarine/gtk-3.0/gtk.css
@@ -102,6 +102,9 @@
 @define-color button_border shade(@theme_bg_color, 0.70);
 @define-color button_border_active shade(@button_bg_active, 0.95);
 
+@define-color button_default_border_color shade(@selected_bg_color, 0.87);
+@define-color button_default_box_shadow_color shade(@selected_bg_color, 0.87);
+
 @define-color insensitive_bg_color shade(@bg_color, 0.93);
 @define-color insensitive_fg_color shade(@bg_color, 0.70);
 @define-color insensitive_border_color shade(@bg_color, 0.80);
diff --git a/desktop-themes/Green-Submarine/gtk-3.0/mate-applications.css b/desktop-themes/Green-Submarine/gtk-3.0/mate-applications.css
index 40774a4e..e7beaee6 100644
--- a/desktop-themes/Green-Submarine/gtk-3.0/mate-applications.css
+++ b/desktop-themes/Green-Submarine/gtk-3.0/mate-applications.css
@@ -168,6 +168,20 @@ paned.horizontal > box.vertical.caja-side-pane > notebook scrolledwindow.frame {
                 inset  0px -1px shade(@selected_bg_color, 0.93);
 }
 
+.caja-side-pane button.flat.toggle:focus:first-child {
+    box-shadow: inset  0px  1px shade(rgb(0,204,133), 1.00),
+                inset  1px  0px shade(rgb(0,204,133), 1.00),
+                inset -1px  0px rgba(255,255,255,0), 0 1px rgba(255,255,255,0),
+                inset  0px -1px shade(rgb(0,204,133), 1.00);
+}
+
+.caja-side-pane button.flat:focus:last-child {
+    box-shadow: inset  0px  1px shade(rgb(0,204,133), 1.00),
+                inset  1px  0px shade(rgb(0,204,133), 1.00),
+                inset -1px  0px shade(rgb(0,204,133), 1.00),
+                inset  0px -1px shade(rgb(0,204,133), 1.00);
+}
+
 /* pathpar toggle button */
 .caja-navigation-window button.toggle.image-button,
 .caja-navigation-window button.toggle.image-button:checked {
@@ -452,6 +466,16 @@ MatePanelAppletFrameDBus {
     text-shadow: 1px 1px alpha (#000000, 0.8);
 }
 
+/* outlines */
+window.background, /* selector where outlines are writen on GtkTrayIcon */
+.mate-panel-menu-bar menubar,
+.mate-panel-menu-bar button,
+.mate-panel-menu-bar PanelApplet {
+    outline-style: solid;
+    outline-offset: -2px;
+    outline-color: shade (@theme_selected_bg_color, 1.3);
+}
+
 /* menubar */
 .mate-panel-menu-bar menu > menuitem,
 .mate-panel-menu-bar menubar > menuitem {
@@ -639,6 +663,8 @@ PanelApplet.wnck-applet .wnck-pager {
     border-color: transparent;
     background-color: transparent;
     text-shadow: none;
+    outline-offset: -1px;
+    outline-color: shade (@theme_selected_bg_color, 1.3);
 }
 
 /* selected WnckPager */
@@ -656,7 +682,7 @@ PanelApplet.wnck-applet .wnck-pager:hover {
 }
 
 na-tray-applet {
-    -NaTrayApplet-icon-padding: 3px;
+    -NaTrayApplet-icon-padding: 1px; /*any more and outlines get cut off*/
     -NaTrayApplet-icon-size: 16;
 }