From be2ad0d89a0a50fc2693722d1c03bbb0dbd780b2 Mon Sep 17 00:00:00 2001 From: Wolfgang Ulbrich Date: Sun, 31 Jan 2016 18:32:29 +0100 Subject: Gtk+-3.20 BlueMenta: port spinbuttons, use simple and clear settings --- .../BlueMenta/gtk-3.0/gtk-widgets-backgrounds.css | 30 +-- .../BlueMenta/gtk-3.0/gtk-widgets-borders.css | 45 +---- desktop-themes/BlueMenta/gtk-3.0/gtk-widgets.css | 208 ++++++++------------- 3 files changed, 86 insertions(+), 197 deletions(-) (limited to 'desktop-themes/BlueMenta/gtk-3.0') diff --git a/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-backgrounds.css b/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-backgrounds.css index e832ba40..ee6f92a5 100644 --- a/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-backgrounds.css +++ b/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-backgrounds.css @@ -3,14 +3,12 @@ button, toolbar button.raised, toolbar .raised button, toolbar combobox button, -spinbutton.vertical button, toolbar.primary-toolbar .linked button, toolbar.primary-toolbar .raised button, .button, .toolbar .button.raised, .toolbar .raised .button, -.toolbar GtkComboBox .button, -.spinbutton.vertical .button { +.toolbar GtkComboBox .button { background-image: linear-gradient(to bottom, @button_gradient_color_a, @button_gradient_color_b); @@ -21,10 +19,6 @@ toolbar.primary-toolbar .raised button, button:checked, button:active, button:active:hover, -spinbutton.vertical button:checked, -spinbutton.vertical button:checked:hover, -spinbutton.vertical button:active, -spinbutton.vertical button:active:hover, toolbar button:active, toolbar button:active:hover, toolbar button.raised:active, @@ -40,10 +34,6 @@ toolbar .raised button:checked:hover, .button:checked, .button:active, .button:active:hover, -.spinbutton.vertical .button:checked, -.spinbutton.vertical .button:checked:hover, -.spinbutton.vertical .button:active, -.spinbutton.vertical .button:active:hover, .toolbar .button:active, .toolbar .button:active:hover, .toolbar .button.raised:active, @@ -76,7 +66,6 @@ row trough, button:checked:hover, button:active:hover, -spinbutton.vertical button:active:hover, toolbar button:active:hover, toolbar button.raised:active:hover, toolbar .raised button:active:hover, @@ -86,7 +75,6 @@ toolbar .raised button:checked:hover, row trough:hover, .button:checked:hover, .button:active:hover, -.spinbutton.vertical .button:active:hover, .toolbar .button:active:hover, .toolbar .button.raised:active:hover, .toolbar .raised .button:active:hover, @@ -135,13 +123,11 @@ toolbar button:hover, toolbar button.raised:hover, toolbar .raised button:hover, toolbar combobox button:hover, -spinbutton.vertical button:hover, .button:hover, .toolbar .button:hover, .toolbar .button.raised:hover, .toolbar .raised .button:hover, -.toolbar GtkComboBox .button:hover, -.spinbutton.vertical .button:hover { +.toolbar GtkComboBox .button:hover { background-color: transparent; background-image: linear-gradient(to bottom, @button_hover_gradient_color_a, @@ -159,12 +145,10 @@ toolbar.primary-toolbar button:hover, /* Insensitive button background */ button:disabled, -spinbutton.vertical button:disabled, toolbar combobox button:disabled, toolbar button.raised:disabled, toolbar .raised button:disabled, .button:disabled, -.spinbutton.vertical button:disabled, .toolbar GtkComboBox button:disabled, .toolbar .button.raised:disabled, .toolbar .raised .button:disabled { @@ -216,20 +200,12 @@ GtkComboBox.combobox-entry .button:hover, toolbar.primary-toolbar combobox entry button:active, toolbar.primary-toolbar combobox entry button:checked, combobox entry button:active, -spinbutton button:active, -spinbutton button:active:hover, combobox entry button:checked, -spinbutton button:checked, -spinbutton button:checked:hover, .primary-toolbar GtkComboBox.combobox-entry .button:active, .primary-toolbar GtkComboBox.combobox-entry .button:checked, /* .primary-toolbar GtkComboBox.combobox-entry .button:hover:active,*/ GtkComboBox.combobox-entry .button:active, -.spinbutton .button:active, -.spinbutton .button:active:hover, -GtkComboBox.combobox-entry .button:checked, -.spinbutton .button:checked, -.spinbutton .button:checked:hover { +GtkComboBox.combobox-entry .button:checked { background-image: linear-gradient(to bottom, shade(@entry_background_a, 0.9), @entry_background_b); diff --git a/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-borders.css b/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-borders.css index aa45d706..3dd1d3ac 100644 --- a/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-borders.css +++ b/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets-borders.css @@ -6,23 +6,15 @@ button:active, button:checked, combobox entry entry, combobox entry button, -spinbutton.vertical button:active, -spinbutton.vertical button:checked, toolbar.inline-toolbar.vertical button:active, toolbar.inline-toolbar.vertical button:checked, -stack box.linked.verticalspinbutton.horizontal.entry.spinbutton.vertical button:active, -stack box.linked.verticalspinbutton.horizontal.entry.spinbutton.vertical button:checked, .entry, .button:active, .button:checked, GtkComboBox.combobox-entry .entry, GtkComboBox.combobox-entry .button, -.spinbutton.vertical .button:active, -.spinbutton.vertical .button:checked, .inline-toolbar.toolbar.vertical .button:active, -.inline-toolbar.toolbar.vertical .button:checked, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton.vertical .button:active, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton.vertical .button:checked { +.inline-toolbar.toolbar.vertical .button:checked { border-image: url("borders/button-active.png") 3 4 4 4 / 3px 4px 4px 4px stretch; border-radius: 4px; border-width: 2px; @@ -39,20 +31,16 @@ trough highlight, entry:disabled, button:active:disabled, -spinbutton.vertical button:disabled, combobox entry entry:disabled, combobox entry button:disabled, toolbar.inline-toolbar.vertical button:disabled, toolbar.inline-toolbar.vertical button.default:disabled, -stack box.linked.vertical spinbutton.horizontal.entry.spinbutton.vertical button:disabled, .entry:disabled, .button:active:disabled, -.spinbutton.vertical .button:disabled, GtkComboBox.combobox-entry .entry:disabled, GtkComboBox.combobox-entry .button:disabled, .inline-toolbar.toolbar.vertical .button:disabled, -.inline-toolbar.toolbar.vertical .button.default:disabled, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton.vertical .button:disabled { +.inline-toolbar.toolbar.vertical .button.default:disabled { border-image: url("borders/button-active-ins.png") 3 4 4 4 / 3px 4px 4px 4px stretch; border-radius: 4px; border-width: 2px; @@ -62,20 +50,16 @@ GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton.vertical .bu button:disabled, button.default:disabled, -spinbutton.vertical button:disabled, toolbar.inline-toolbar button:disabled, toolbar.inline-toolbar button.default:disabled, toolbar.inline-toolbar.vertical button:disabled, toolbar.inline-toolbar.vertical button.default:disabled, -stack box.linked.vertical spinbutton.horizontal.entry.spinbutton.vertical button:disabled, .button:disabled, .button.default:disabled, -.spinbutton.vertical .button:disabled, .inline-toolbar.toolbar .button:disabled, .inline-toolbar.toolbar .button.default:disabled, .inline-toolbar.toolbar.vertical .button:disabled, -.inline-toolbar.toolbar.vertical .button.default:disabled, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton.vertical .button:disabled { +.inline-toolbar.toolbar.vertical .button.default:disabled { border-image: url("borders/button-ins.png") 3 4 4 4 / 3px 4px 4px 4px stretch; border-radius: 4px; border-width: 2px; @@ -99,32 +83,20 @@ button:checked:focus, button.default:active, button.default:checked, combobox entry button:focus, -spinbutton.vertical button:active:focus, -spinbutton.vertical button:checked:focus, toolbar.inline-toolbar.vertical button:active:focus, toolbar.inline-toolbar.vertical button:checked:focus toolbar.inline-toolbar.vertical button.default:active, toolbar.inline-toolbar.vertical button.default:checked, -stack box.linked.vertical spinbutton.horizontal.entry.spinbutton button:active, -stack box.linked.vertical spinbutton.horizontal.entry.spinbutton button:checked, -stack box.linked.vertical spinbutton.horizontal.entry.spinbutton button:active:focus, -stack box.linked.vertical spinbutton.horizontal.entry.spinbutton button:checked:focus, .entry:focus, .button:active:focus, .button:checked:focus, .button.default:active, .button.default:checked, GtkComboBox.combobox-entry .button:focus, -.spinbutton.vertical .button:active:focus, -.spinbutton.vertical .button:checked:focus, .inline-toolbar.toolbar.vertical .button:active:focus, .inline-toolbar.toolbar.vertical .button:checked:focus .inline-toolbar.toolbar.vertical .button.default:active, -.inline-toolbar.toolbar.vertical .button.default:checked, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton .button:active, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton .button:checked, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton .button:active:focus, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton .button:checked:focus { +.inline-toolbar.toolbar.vertical .button.default:checked { border-image: url("borders/button-active-focus.png") 3 4 4 4 / 3px 4px 4px 4px stretch; border-radius: 4px; border-width: 2px; @@ -149,8 +121,7 @@ GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton .button:chec button, .button -/*.spinbutton.vertical .button, -.inline-toolbar.toolbar.vertical .button*/ { +/*.inline-toolbar.toolbar.vertical .button*/ { border-image: url("borders/button.png") 3 4 4 4 / 3px 4px 4px 4px stretch; border-radius: 4px; border-width: 2px; @@ -158,12 +129,8 @@ button, border-color: transparent; } -spinbutton.vertical button, toolbar.inline-toolbar.vertical button, -stack box.linked.vertical spinbutton.horizontal.entry.spinbutton.vertical .button, -.spinbutton.vertical .button, -.inline-toolbar.toolbar.vertical .button, -GtkStack .linked.vertical GtkSpinButton.horizontal.entry.spinbutton.vertical .button { +.inline-toolbar.toolbar.vertical .button { border-image: url("borders/button.png") 3 3 4 3 / 3px 3px 4px 3px stretch; border-radius: 4px; border-width: 2px; diff --git a/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets.css b/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets.css index 404dc464..32bd2f50 100644 --- a/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets.css +++ b/desktop-themes/BlueMenta/gtk-3.0/gtk-widgets.css @@ -588,172 +588,118 @@ view image:selected:hover, * GtkSpinButton * *****************/ -spinbutton button, -.spinbutton .button { - background-color: transparent; - background-image: none; - color: @internal_element_color; - padding: 2px 6px; - border-width: 0; - border-radius: 0; - border-style: none; - border-image: none; - box-shadow: inset 1px 0 @inset_dark_color; +spinbutton, +spinbutton:focus { + background-image: linear-gradient(to bottom, + @entry_background_a, + @entry_background_b); + border-color: @borders; + border-width: 1px; + border-style: solid; + border-radius: 3px; + /* weird padding is needed for entry, no style class with 3.20 */ + padding: 5px 5px 5px 2px; } -spinbutton button:disabled, -.spinbutton .button:disabled { - color: @internal_element_insensitive; +spinbutton:disabled { + background-color: @insensitive_bg_color; + background-image: none; + border-color: @borders; } +spinbutton button, +spinbutton button:focus, spinbutton button:active, -spinbutton button:hover, -.spinbutton .button:active, -.spinbutton .button:hover { - color: @internal_element_prelight; +spinbutton button:focus:active, +spinbutton button:disabled { + border-style: none; + border-image: none; + padding: 5px; + border-radius: 0px; + box-shadow: inset 1px 0 @inset_dark_color; } -spinbutton button:first-child, -.spinbutton .button:first-child { - border-radius: 3px 0 0 3px; - box-shadow: none; +spinbutton button, +spinbutton button:focus { + background-image: linear-gradient(to bottom, + @button_gradient_color_a, + @button_gradient_color_b); + background-color: transparent; + color: @internal_element_color; } -spinbutton button:last-child, -.spinbutton .button:last-child { - border-radius: 0 3px 3px 0; +spinbutton button:hover { + background-color: transparent; + background-image: linear-gradient(to bottom, + @button_hover_gradient_color_a, + @button_hover_gradient_color_b); + color: @internal_element_prelight; } -spinbutton button:dir(rtl), -.spinbutton .button:dir(rtl) { - box-shadow: inset -1px 0 @inset_dark_color; +spinbutton button:active, +spinbutton button:active:hover { + background-image: linear-gradient(to bottom, + @button_active_gradient_color_a, + @button_active_gradient_color_b); + background-color: transparent; + color: @internal_element_prelight; } -/* Add back the glowy effect from the entry covered by the pushed button background*/ -spinbutton button:active, -spinbutton button:active:focus, -.spinbutton .button:active, -.spinbutton .button:active:focus { - padding: 2px 4px; - box-shadow: inset 1px 0 @inset_dark_color, - inset 0 1px alpha(@theme_selected_bg_color, 0.2), - inset 0 -1px alpha(@theme_selected_bg_color, 0.2); +spinbutton button:disabled { + color: @internal_element_insensitive; } -spinbutton button:first-child:active, -spinbutton button:first-child:active:focus, -.spinbutton .button:first-child:active, -.spinbutton .button:first-child:active:focus { - padding: 2px 4px; - box-shadow: inset 1px 1px alpha(@theme_selected_bg_color, 0.2), - inset 0 -1px alpha(@theme_selected_bg_color, 0.2); +spinbutton button:first-child { + border-radius: 0px; } -spinbutton button:last-child:active, -spinbutton button:last-child:active:focus, -.spinbutton .button:last-child:active, -.spinbutton .button:last-child:active:focus { - padding: 2px 4px; - box-shadow: inset 1px 0 @inset_dark_color, - inset 0 1px alpha(@theme_selected_bg_color, 0.2), - inset -1px -1px alpha(@theme_selected_bg_color, 0.2); +spinbutton button:last-child { + border-radius: 0 3px 3px 0; } -spinbutton.vertical button, -.spinbutton.vertical .button { - padding: 4px; - -gtk-icon-shadow: 0 1px @button_text_shadow; +spinbutton button:dir(rtl) { + box-shadow: inset -1px 0 @inset_dark_color; } spinbutton.vertical button, -spinbutton.vertical button:hover, -.spinbutton.vertical .button, -.spinbutton.vertical .button:hover { - padding: 4px; - color: @theme_fg_color; +spinbutton.vertical button:focus { + border-color: @borders; + border-width: 1px; + border-style: solid; + padding: 5px; + color: @theme_fg_color; } -spinbutton.vertical button:disabled, -.spinbutton.vertical .button:disabled { - color: @insensitive_fg_color; +spinbutton.vertical button:disabled { + color: @insensitive_fg_color; + -gtk-icon-shadow: none; } spinbutton.vertical button:active, -.spinbutton.vertical .button:active { - color: @button_active_text; - -gtk-icon-shadow: 0 1px @button_active_text_shadow; -} - -/* :disabled:disabled to override the dark overriden style for - normal spinbutton buttons, yeah we lack !important */ -spinbutton.vertical button:disabled:disabled, -.spinbutton.vertical .button:disabled:disabled { - -gtk-icon-shadow: none; -} - -spinbutton.vertical button, -spinbutton.vertical button:active:active, -.spinbutton.vertical .button, -/* :active:active to override the dark overriden style for - normal spinbutton buttons, yeah we lack !important */ -.spinbutton.vertical .button:active:active { - box-shadow: none; +spinbutton.vertical button:hover:active { + color: @button_active_text; + -gtk-icon-shadow: 0 1px @button_active_text_shadow; } spinbutton.vertical button:first-child, -spinbutton.vertical button:active:first-child, -.spinbutton.vertical .button:first-child, -.spinbutton.vertical .button:active:first-child { - border-image-width: 3px 3px 0 3px; - border-width: 2px 1px 0 1px; - border-bottom-left-radius: 0; - border-bottom-right-radius: 0; - padding: 4px; +spinbutton.vertical button:active:first-child { + border-radius: 3px 3px 0 0; } spinbutton.vertical button:last-child, -spinbutton.vertical button:active:last-child, -.spinbutton.vertical .button:last-child, -.spinbutton.vertical .button:active:last-child { - border-image-width: 0 3px 4px 3px; - border-width: 0 1px 2px 1px; - border-top-left-radius: 0; - border-top-right-radius: 0; - padding: 4px; +spinbutton.vertical button:active:last-child { + border-radius: 0 0 3px 3px; } -spinbutton.vertical entry, -.spinbutton.vertical.entry { - border-image: none; - border-color: alpha(@borders, 0.1); - border-width: 0 1px 0 1px; - border-style: solid; - border-radius: 0; - box-shadow: inset 1px 0 0 0 @borders, - inset -1px 0 0 0 @borders, - inset 0 1px 0 0 @borders, - inset 0 -1px 0 0 @borders; - - /* I'm using box-shadow as borders, so I need to compensate - with padding. Those two values need to be entry padding +1 */ - padding-top: 5px; - padding-bottom: 5px; -} - -spinbutton.vertical entry:disabled, -.spinbutton.vertical.entry:disabled { - border-color: alpha(@borders, 0.1); - box-shadow: inset 0 1px alpha(@borders, 0.4), - inset 0 -1px alpha(@borders, 0.4); -} - -spinbutton.vertical entry:focus, -.spinbutton.vertical.entry:focus { - border-color: alpha(@borders, 0.1); - box-shadow: inset 1px 0 0 0 @theme_selected_bg_color, - inset -1px 0 0 0 @theme_selected_bg_color, - inset 0 1px 0 0 @theme_selected_bg_color, - inset 0 -1px 0 0 @theme_selected_bg_color; +stack box.vertical.linked spinbutton.horizontal { + border-radius: 0px; +} + +stack box.vertical.linked spinbutton.horizontal button { + border-radius: 0px; + border-style: none; + padding: 5px; + box-shadow: inset 1px 0 @inset_dark_color; } /***************** -- cgit v1.2.1