From 2161d20c9c8e7ace63352798c0750ffdb96088e9 Mon Sep 17 00:00:00 2001 From: raveit65 Date: Mon, 25 Apr 2016 21:49:23 +0200 Subject: GTK+-3.20 Submarine themes: several adjustments - simplify menu settings - fix firefox menus - some clean ups - increase progressbar trough height - reduce button size - remove text shadows - use cellview selector for combobox - adjust arrows - reduze height of treeview and treeview header button - adjust calendar border color - add GtkFlowbox support --- .../Blue-Submarine/gtk-3.0/gtk-widgets.css | 571 +++++++++++---------- .../Blue-Submarine/gtk-3.0/mate-applications.css | 22 +- desktop-themes/Blue-Submarine/gtk-3.0/menu.css | 559 ++++++++++---------- .../Green-Submarine/gtk-3.0/gtk-widgets.css | 571 +++++++++++---------- .../Green-Submarine/gtk-3.0/mate-applications.css | 22 +- desktop-themes/Green-Submarine/gtk-3.0/menu.css | 559 ++++++++++---------- 6 files changed, 1203 insertions(+), 1101 deletions(-) diff --git a/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css b/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css index 7856ebc7..f91dff53 100644 --- a/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css +++ b/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css @@ -1,8 +1,8 @@ -/*************************************************************** - * Blue-Submarine * - * Part of https://github.com/NiceandGently/mate-themes-extras * - * Author Wolfgang Ulbrich * - ***************************************************************/ +/******************************************************* + * Blue-Submarine * + * Part of https://github.com/mate-desktop/mate-themes * + * Author Wolfgang Ulbrich * + *******************************************************/ * { padding: 0; @@ -54,7 +54,7 @@ window { }*/ *:active { - background-color: alpha(shade(@theme_selected_bg_color, 1.90), 0.015); +/* background-color: alpha(shade(@theme_selected_bg_color, 1.90), 0.015);*/ } *:hover:active:disabled { @@ -64,7 +64,7 @@ window { } *:hover { - background-color: alpha(shade(@menu_bg_color, 1.05), 0.0); +/* background-color: alpha(shade(@menu_bg_color, 1.05), 0.0);*/ } *:hover:disabled { @@ -72,8 +72,8 @@ window { *:selected, *:selected:focus { - background-color: shade(@theme_selected_bg_color, 1.0); - color: @theme_selected_fg_color; +/* background-color: shade(@theme_selected_bg_color, 1.0); + color: @theme_selected_fg_color;*/ } *:disabled { @@ -341,22 +341,22 @@ progressbar { font-size: smaller; } -progressbar.horizontal { - min-height: 16px; -} - -progressbar.vertical { - min-width: 16px; +/* progress component */ +progressbar.horizontal trough { + min-height: 18px; + border-radius: 3px; } -/* progress component */ -progressbar.horizontal trough, progressbar.horizontal progress { min-height: 16px; border-radius: 3px; } -progressbar.vertical trough, +progressbar.vertical trough { + min-width: 18px; + border-radius: 3px; +} + progressbar.vertical progress { min-width: 16px; border-radius: 3px; @@ -825,13 +825,9 @@ scrolledwindow.frame { * Buttons * ***********/ -button menuitem menubar { - padding: 4px 8px; -} - button, button.raised { - padding: 6px; + padding: 5px; min-height: 20px; min-width: 20px; } @@ -848,7 +844,6 @@ button label { button { transition: all 400ms ease-out; - -GtkArrow-arrow-scaling: 0.5; background-image: -gtk-gradient (linear, left top, left bottom, from (@button_gradient1), @@ -870,7 +865,7 @@ button { /* box-shadow Syntax */ /* box-shadow: [ inset ] horizontal_offset vertical_offset [ blur_radius ] [ spread ] color */ color: @theme_fg_color; - text-shadow: 0px 1px @theme_shadow_color; + text-shadow: none; } button.default { @@ -894,7 +889,7 @@ button.flat { /* ie. caja location drop down button */ button.flat.toggle { - padding: 6px; + padding: 5px; } /* ie. controls gnome-mplayer, virtual-manager */ @@ -902,7 +897,7 @@ button.flat.image-button, button.flat.image-button:focus, button.flat.image-button:hover, button.flat.scale { - padding: 4px; + padding: 5px; } button:hover { @@ -949,7 +944,7 @@ button:hover:active, button:checked, button:checked:hover, button:checked:hover:active { - text-shadow: 1px 1px @theme_selected_shadow_color; + text-shadow: none; } button:disabled { @@ -976,18 +971,15 @@ toolbar.vertical > button.image-button.flat { button.text-button, button.text-button:focus, button.text-button:hover, -button.file { - padding: 6px; -} - +button.file, combobox > button.combo, combobox > button.combo:hover { - padding: 4px; + padding: 5px; } button.font, button.color { - padding: 6px 4px; + padding: 5px 4px; } .path-bar > button, @@ -997,7 +989,7 @@ button.color { .linked.path-bar > button:checked, .linked.path-bar > button:checked:hover, .linked.path-bar > button:checked:hover:active { - padding: 7px; + padding: 5px; border-color: transparent; } @@ -1005,13 +997,13 @@ button.color { .linked.path-bar > button.slider-button:first-child { border-width: 1px 0px 1px 1px; border-radius: 4px 0px 0px 4px; - padding: 7px 1px; + padding: 5px 1px; } .linked.path-bar > button.slider-button:last-child { border-width: 1px 1px 1px 0px; border-radius: 0px 4px 4px 0px; - padding: 7px 1px; + padding: 5px 1px; } .titlebar .path-bar > button.slider-button:disabled { @@ -1995,10 +1987,10 @@ combobox { padding: 0px; } -combobox .cell { +combobox cellview { /* color combobox read-only */ color: @theme_fg_color; - text-shadow: 0 1px @theme_shadow_color; + text-shadow: none; } combobox separator { @@ -2047,18 +2039,23 @@ combobox button.combo:hover { color: @theme_text_color; } -toolbar combobox .cell { +toolbar combobox cellview { /* color combobox read-only */ color: shade(@toolbar_fg_color, 0.94); - text-shadow: 0 1px @toolbar_shadow_color; + text-shadow: none; } -toolbar.primary-toolbar combobox .cell { +toolbar.primary-toolbar combobox cellview { /* color combobox read-only */ color: shade(@theme_fg_dark_color, 0.94); - text-shadow: 0 1px @theme_shadow_dark_color; + text-shadow: none; +} + +toolbar.primary-toolbar combobox cellview:hover { + color: shade (@theme_selected_bg_color, 1.6); } + toolbar combobox entry.combo, toolbar combobox entry.combo:focus { border-width: 1px 0px 1px 1px; /* remove rightr */ @@ -2373,12 +2370,16 @@ combobox button.combo:hover { toolbar combobox button.combo:checked, toolbar combobox button.combo:hover, -toolbar.primary-toolbar combobox button.combo *:checked, -toolbar.primary-toolbar combobox button.combo *:hover { - color: @theme_text_dark_color; +toolbar.primary-toolbar combobox button.combo:checked, +toolbar.primary-toolbar combobox button.combo:hover { + color: shade (@theme_selected_bg_color, 1.6); + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); } -combobox arrow { +combobox button.combo arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); color: @theme_fg_color; min-height: 16px; @@ -2386,6 +2387,14 @@ combobox arrow { padding: 0px 2px; } +toolbar combobox button.combo arrow { + color: @menu_fg_dark_color; +} + +toolbar combobox button.combo:hover arrow { + color: shade (@theme_selected_bg_color, 1.6); +} + /************ * Toolbars * ************/ @@ -2511,34 +2520,25 @@ toolbar.primary-toolbar button:focus { toolbar button { color: shade(@toolbar_fg_color, 1.00); - text-shadow: 0px 1px @toolbar_shadow_color; + text-shadow: none; } -toolbar combobox button.combo { - /* color combobox read-only */ - color: shade(@toolbar_fg_color, 1.00); - text-shadow: 0px 1px @toolbar_shadow_color; - background-image: -gtk-gradient (linear, - left top, left bottom, - from (alpha(#fff, 0.04)), - to (alpha(#000, 0.06))); - border-top-color: alpha (#000, 0.15); - border-left-color: alpha (#000, 0.20); - border-right-color: alpha (#000, 0.20); - border-bottom-color: alpha (#000, 0.25); - 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); +toolbar.primary-toolbar > button.toggle #gtk-toolbar-arrow:disabled, +toolbar.primary-toolbar > toolbutton button.toggle.popup > image:disabled { + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4); } -toolbar combobox button.combo:hover { - border-radius: 5px +toolbar.primary-toolbar > button.toggle:hover #gtk-toolbar-arrow, +toolbar.primary-toolbar > toolbutton button.toggle.popup:hover > image { + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); } toolbar.primary-toolbar button { color: @theme_fg_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar.primary-toolbar .linked button:focus { @@ -2606,7 +2606,7 @@ toolbar button:checked, toolbar button:hover label, toolbar button:checked label { color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @toolbar_shadow_color; + text-shadow: none; transition: all 400ms ease-out; } @@ -2616,7 +2616,7 @@ toolbar.primary-toolbar button:hover:active, toolbar.primary-toolbar button:checked, toolbar.primary-toolbar button:checked:hover { color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar button:checked:disabled, @@ -2630,14 +2630,14 @@ toolbar.primary-toolbar button:checked:disabled { toolbar label { color: shade(@theme_fg_color, 1.10); - text-shadow: 0px 1px @theme_shadow_color; + text-shadow: none; } toolbar toolitem label, toolbar menubar label, toolbar.primary-toolbar label { color: @theme_fg_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar toolitem separator, @@ -2752,7 +2752,7 @@ toolbar button.raised:checked { toolbar .raised button label, toolbar button.raised label { color: @theme_fg_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar .raised button, @@ -2771,7 +2771,7 @@ toolbar button.raised:checked, toolbar .raised button:checked:hover, toolbar button.raised:checked:hover { color: @theme_text_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar menubar button:disabled, @@ -2913,7 +2913,7 @@ toolbar.inline-toolbar button { border-style: none; box-shadow: none; color: @theme_fg_color; - text-shadow: 0 1px @theme_shadow_color; + text-shadow: none; -gtk-icon-shadow: 1px 1px @theme_shadow_color; } @@ -2960,13 +2960,13 @@ toolbar.inline-toolbar button:disabled { toolbar.inline-toolbar button:hover { color: @theme_text_color; - text-shadow: 0 1px @theme_shadow_color; + text-shadow: none; -gtk-icon-shadow: 1px 1px @theme_shadow_color; } toolbar.inline-toolbar button:checked { color: @theme_selected_fg_color; - text-shadow: 0 1px @theme_selected_shadow_color; + text-shadow: none; -gtk-icon-shadow: 1px 1px @theme_selected_shadow_color; } @@ -3045,7 +3045,7 @@ actionbar revealer .horizontal.linked.stack-switcher button.image-button.radio:l } actionbar revealer .horizontal button.image-button.popup.toggle { - padding: 8px; + padding: 6px; } /***************** @@ -3510,8 +3510,8 @@ notebook tab.reorderable-page:checked { /* close button styling */ -notebook button.flat, -notebook button.flat.small-button { +notebook > header button.flat, +notebook > header button.flat.small-button { border-image: none; background-image: none; background-color: transparent; @@ -3520,6 +3520,12 @@ notebook button.flat.small-button { border-color: transparent; border-width: 1px; -gtk-icon-shadow: none; + box-shadow: none; +} + +notebook > header button.flat:hover, +notebook > header button.flat.small-button:hover { + -gtk-icon-effect: highlight; } notebook tab.prelight-page button.flat.small-button, @@ -3869,7 +3875,7 @@ switch:backdrop { 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); - text-shadow: 0 1px rgba(0, 0, 0, 0.1); + text-shadow: none; } switch:checked, @@ -4032,8 +4038,7 @@ iconview.view.cell:selected:focus { inset 1px 0px alpha(#fff, 0.07), inset -1px 0px alpha(#fff, 0.07), inset 0px -1px alpha(#fff, 0.06); -/* -GtkWidget-focus-line-width: 0; */ - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } iconview.view.cell:hover, @@ -4051,7 +4056,7 @@ iconview text, textview text { background-color: @theme_base_color; color: @theme_fg_color; - text-shadow: 0px 1px @theme_shadow_color; + text-shadow: none; } view, @@ -4069,7 +4074,6 @@ view text selection:focus, from (shade(@theme_selected_bg_color, 1.0)), to (shade(@theme_selected_bg_color, 1.1))); color: @theme_selected_fg_color; - text-shadow: 0px 1px @theme_selected_shadow_color; text-shadow: none; } @@ -4080,7 +4084,7 @@ view text selection:focus, .view text selection:focus, .view:selected:focus { - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } /* for firefox and probably other apps */ @@ -4109,7 +4113,7 @@ label selection:backdrop:disabled { treeview, treeview.view { - padding: 4px + padding: 1px 4px; } treeview.dnd { @@ -4119,11 +4123,8 @@ treeview.dnd { border-style: solid; } -treeview:selected:hover, -/*does not work in recent GTK versions -treeview row:nth-child(odd):selected:hover, -treeview row:nth-child(even):selected:hover,*/ -notebook container treeview:selected { +treeview.view:selected:hover, +notebook container treeview.view:selected { background-image: -gtk-gradient (linear, left top, left bottom, @@ -4139,12 +4140,8 @@ treeview.view:focus { border-style: none; } -.view row:hover, -/*does not work in recent GTK versions -treeview row:nth-child(odd):hover, -treeview row:nth-child(even):hover,*/ -treeview:hover, -notebook container treeview:hover { +treeview.view:hover, +notebook container treeview.view:hover { background-image: -gtk-gradient (linear, left top, left bottom, @@ -4156,18 +4153,17 @@ notebook container treeview:hover { } /*Keep treeviews from jumping, separators drawn at 0 by default until hovered*/ -treeview.view.separator { - min-height: 2px; -} - -treeview header { - padding: 0px 2px; +treeview.view.separator, +treeview.view.separator:hover { + min-height: 2px; + color: shade(@theme_bg_color, 0.87); + background-color: shade(@theme_bg_color, 0.87); } -treeview header button, -treeview header button:focus { - padding: 0px 4px 1px; -/* -GtkWidget-focus-line-width: 0; */ +treeview.view > header > button, +treeview.view > header > button:focus { + min-height: 18px; + padding: 0px 4px; background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@button_base, 1.00)), @@ -4188,7 +4184,7 @@ treeview header button:focus { inset 0px -1px alpha(#fff, 0.05); } -treeview header button:hover { +treeview.view > header > button:hover { background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@button_gradient1, 1.03)), @@ -4208,7 +4204,7 @@ treeview header button:hover { inset 0px -1px shade (@theme_selected_bg_color, 1.3); } -treeview header button:focus:hover:active { +treeview.view > header > button:focus:hover:active { background-image: -gtk-gradient (linear, left top, left bottom, from (shade (@theme_bg_color, 1.20)), @@ -4219,7 +4215,7 @@ treeview header button:focus:hover:active { box-shadow: none; } -treeview header button:disabled { +treeview.view > header > button:disabled { background-image: none; background-color: @insensitive_bg_color; border-color: @insensitive_border_color; @@ -4227,35 +4223,18 @@ treeview header button:disabled { box-shadow: none; } -treeview header button arrow { - color: @internal_element_color; -} - -treeview header:nth-child(last) button { - border-width: 0px 0px 1px 0px; -} - -row { - min-height: 22px; -} - -row:disabled { - border-width: 0px; +treeview.view > header > button label, +treeview.view > header > button label:focus, +treeview.view > header > button label:backdrop { + padding: 0px; } -row:selected, -row:selected:focus { - border-width: 1px 0 1px 0; - border-style: solid; - box-shadow: none; +treeview.view > header > button arrow { + color: @internal_element_color; } -row:selected:backdrop, -row:selected:focus:backdrop { - border-width: 1px 0 1px 0; - border-style: solid; - text-shadow: none; - box-shadow: none; +treeview.view > header > button:nth-child(last) { + border-width: 0px 0px 1px 0px; } .cell { @@ -4270,128 +4249,6 @@ row:selected:focus:backdrop { background-color: alpha(@theme_base_color, 0.0); } -/********************* - * App Notifications * - *********************/ - -.app-notification, -.app-notification.frame { - color: @theme_dark_fg_color; - padding: 10px; - border: none; - border-radius: 0 0 4px 4px; - background-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(0, 0, 0, 0.2), - transparent 2px); - background-clip: padding-box; -} - -.app-notification:backdrop, -.app-notification.frame:backdrop { - background-image: none; -} - -.app-notification button, -.app-notification headerbar button.titlebutton, -headerbar .app-notification button.titlebutton, -.app-notification .titlebar button.titlebutton, -.titlebar .app-notification button.titlebutton, -.app-notification calendar.header button.titlebutton, -calendar.header .app-notification button.titlebutton, -.app-notification.frame button { - color: @theme_dark_fg_color; - border-color: rgba(37, 88, 128, 0.7); - background-image: linear-gradient(to bottom, - rgba(0, 0, 0, 0.7)); - background-clip: padding-box; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - text-shadow: none; - -gtk-icon-shadow: 0 1px black; - outline-color: rgba(238, 238, 236, 0.3); - border-radius: 3px; - padding: 0 0px 2px 0px; -} - -.app-notification button.flat, -.app-notification headerbar button.titlebutton, -headerbar .app-notification button.titlebutton, -.app-notification .titlebar button.titlebutton, -.titlebar .app-notification button.titlebutton, -.app-notification calendar.header button.titlebutton, -calendar.header .app-notification button.titlebutton, -.app-notification.frame button.flat, -.app-notification.frame headerbar button.titlebutton, -headerbar .app-notification.frame button.titlebutton, -.app-notification.frame .titlebar button.titlebutton, -.titlebar .app-notification.frame button.titlebutton, -.app-notification.frame calendar.header button.titlebutton, -calendar.header .app-notification.frame button.titlebutton { - -gtk-icon-shadow: 0 1px black; - text-shadow: 0 1px black; -} - -.app-notification button:hover, -.app-notification.frame button:hover { - color: black; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(203, 213, 217, 0.7)); - background-clip: padding-box; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - text-shadow: none; - -gtk-icon-shadow: 0 1px black; - outline-color: rgba(238, 238, 236, 0.3); - border-radius: 3px; - padding: 0 0px 2px 0px; -} - -.app-notification button:checked, -.app-notification button:backdrop:checked, -.app-notification.frame button:checked, -.app-notification.frame button:backdrop:active { - color: white; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(37, 88, 128, 0.7)); - background-clip: padding-box; - box-shadow: none; - text-shadow: none; - -gtk-icon-shadow: none; - outline-color: rgba(238, 238, 236, 0.3); - border-radius: 3px; -} - -.app-notification button:disabled, -.app-notification button:backdrop:disabled, -.app-notification.frame button:disabled, -.app-notification.frame button:backdrop:disabled { - color: #878989; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(52, 57, 57, 0.5)); - background-clip: padding-box; - box-shadow: none; - text-shadow: none; - -gtk-icon-shadow: none; - border-radius: 3px; - padding: 0px; -} - -.app-notification button:backdrop, -.app-notification.frame button:backdrop { - color: #eeeeec; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(172, 205, 138, 0.7)); - background-clip: padding-box; - box-shadow: none; - text-shadow: none; - -gtk-icon-shadow: none; - border-radius: 3px; - padding: 0px; -} - /************* * Expanders * *************/ @@ -4488,6 +4345,29 @@ list .separator.horizontal { border-width: 0px; } +row { + min-height: 22px; +} + +row:disabled { + border-width: 0px; +} + +row:selected, +row:selected:focus { + border-width: 1px 0 1px 0; + border-style: solid; + box-shadow: none; +} + +row:selected:backdrop, +row:selected:focus:backdrop { + border-width: 1px 0 1px 0; + border-style: solid; + text-shadow: none; + box-shadow: none; +} + list row, list row.activatable { padding: 2px; @@ -4548,13 +4428,135 @@ list row.activatable:selected:backdrop:hover { box-shadow: none; } +/********************* + * App Notifications * + *********************/ + +.app-notification, +.app-notification.frame { + color: @theme_dark_fg_color; + padding: 10px; + border: none; + border-radius: 0 0 4px 4px; + background-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(0, 0, 0, 0.2), + transparent 2px); + background-clip: padding-box; +} + +.app-notification:backdrop, +.app-notification.frame:backdrop { + background-image: none; +} + +.app-notification button, +.app-notification headerbar button.titlebutton, +headerbar .app-notification button.titlebutton, +.app-notification .titlebar button.titlebutton, +.titlebar .app-notification button.titlebutton, +.app-notification calendar.header button.titlebutton, +calendar.header .app-notification button.titlebutton, +.app-notification.frame button { + color: @theme_dark_fg_color; + border-color: rgba(37, 88, 128, 0.7); + background-image: linear-gradient(to bottom, + rgba(0, 0, 0, 0.7)); + background-clip: padding-box; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + text-shadow: none; + -gtk-icon-shadow: 0 1px black; + outline-color: rgba(238, 238, 236, 0.3); + border-radius: 3px; + padding: 0 0px 2px 0px; +} + +.app-notification button.flat, +.app-notification headerbar button.titlebutton, +headerbar .app-notification button.titlebutton, +.app-notification .titlebar button.titlebutton, +.titlebar .app-notification button.titlebutton, +.app-notification calendar.header button.titlebutton, +calendar.header .app-notification button.titlebutton, +.app-notification.frame button.flat, +.app-notification.frame headerbar button.titlebutton, +headerbar .app-notification.frame button.titlebutton, +.app-notification.frame .titlebar button.titlebutton, +.titlebar .app-notification.frame button.titlebutton, +.app-notification.frame calendar.header button.titlebutton, +calendar.header .app-notification.frame button.titlebutton { + -gtk-icon-shadow: 0 1px black; + text-shadow: none; +} + +.app-notification button:hover, +.app-notification.frame button:hover { + color: black; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(203, 213, 217, 0.7)); + background-clip: padding-box; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + text-shadow: none; + -gtk-icon-shadow: 0 1px black; + outline-color: rgba(238, 238, 236, 0.3); + border-radius: 3px; + padding: 0 0px 2px 0px; +} + +.app-notification button:checked, +.app-notification button:backdrop:checked, +.app-notification.frame button:checked, +.app-notification.frame button:backdrop:active { + color: white; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(37, 88, 128, 0.7)); + background-clip: padding-box; + box-shadow: none; + text-shadow: none; + -gtk-icon-shadow: none; + outline-color: rgba(238, 238, 236, 0.3); + border-radius: 3px; +} + +.app-notification button:disabled, +.app-notification button:backdrop:disabled, +.app-notification.frame button:disabled, +.app-notification.frame button:backdrop:disabled { + color: #878989; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(52, 57, 57, 0.5)); + background-clip: padding-box; + box-shadow: none; + text-shadow: none; + -gtk-icon-shadow: none; + border-radius: 3px; + padding: 0px; +} + +.app-notification button:backdrop, +.app-notification.frame button:backdrop { + color: #eeeeec; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(172, 205, 138, 0.7)); + background-clip: padding-box; + box-shadow: none; + text-shadow: none; + -gtk-icon-shadow: none; + border-radius: 3px; + padding: 0px; +} + /************** * Calendar * **************/ calendar { border-radius: 3px; - border-color: shade (@theme_fg_color, 0.8); + border-color: @notebook_border; padding: 1px 1px 3px 1px; } @@ -4776,7 +4778,7 @@ dialog scrolledwindow.frame viewport .vertical expander .vertical { .dialog-action-area.linked > button.text-button:disabled { border-width: 1px 1px 1px 0px; border-radius: 0; - padding: 8px 6px; + padding: 6px 6px; margin: 0px 0px 0px -2px; min-height: 16px; min-width: 16px; @@ -4909,7 +4911,7 @@ dialog scrolledwindow.frame viewport .vertical expander .vertical { .background.osd { color: @osd_fg; - text-shadow: 0 1px @osd_text_shadow; + text-shadow: none; border-style: solid; border-width: 1px; border-color: shade (@theme_selected_bg_color, 0.8); @@ -4992,7 +4994,7 @@ button.osd:focus { @osd_button_bg_b 68%, @osd_button_bg_c); color: @osd_button_fg; - text-shadow: 0 -1px @osd_button_shadow; + text-shadow: none; -gtk-icon-shadow: 0 -1px @osd_button_shadow; } @@ -5023,7 +5025,7 @@ button.osd.menu-button:checked { @osd_button_bg_active_b 68%, @osd_button_bg_active_c); color: @osd_button_fg_active; - text-shadow: 0 -1px @osd_button_shadow; + text-shadow: none; } .osd button.menu-button:checked { @@ -5079,7 +5081,7 @@ button.osd.menu-button:checked { toolbar.osd { color: @osd_fg; - text-shadow: 0 1px @osd_text_shadow; + text-shadow: none; padding: 10px; border-style: solid; border-width: 1px; @@ -5363,7 +5365,7 @@ popover.osd toolbar { } popover.osd button { - text-shadow: 0 -1px @osd_text_shadow; + text-shadow: none; -gtk-icon-shadow: 0 -1px @osd_text_shadow; } @@ -5460,7 +5462,8 @@ popover button.image-button:disabled { modelbutton.flat, .linked button.image-button.model { - min-height: 24px; + min-height: 24px; + padding: 4px; } modelbutton.flat arrow.left { @@ -6601,7 +6604,7 @@ colorchooser box.horizontal box.horizontal grid.horizontal{ background-color: @theme_bg_color; border-color: shade(@theme_bg_color, 0.85); color: @theme_text_color; - text-shadow: 0 1px @theme_shadow_color; + text-shadow: none; border-radius: 3px; border-width: 1px; border-style: solid; @@ -6641,3 +6644,39 @@ colorchooser box.horizontal box.horizontal grid.horizontal{ box-shadow: inset -1px 1px alpha(#fff, 0.07); } +/*********** + * FlowBox * + ***********/ + +flowbox { + background-color: shade (@theme_bg_color, 1.1); + -gtk-icon-style: regular; + border-style: solid; + border-color: alpha(@frame_color, 0.6); + border-width: 1px 1px 1px 1px; + border-radius: 3px; + padding: 8px; +} + +flowbox > flowboxchild, +flowbox > flowboxchild:focus, +flowbox > flowboxchild:backdrop { + border-style: solid; + border-width: 2px; + border-radius: 3px; + border-color: transparent; + color: @theme_text_color; + +} + +flowbox > flowboxchild:selected, +flowbox > flowboxchild:selected:focus, +flowbox > flowboxchild:selected:hover, +flowbox > flowboxchild:selected:focus:hover { + border-style: solid; + border-width: 2px; + border-radius: 3px; + border-color: alpha(@theme_selected_bg_color, 0.75); + color: @theme_text_color; +} + diff --git a/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css b/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css index a4d64c7c..83d2066b 100644 --- a/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css +++ b/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css @@ -292,10 +292,6 @@ paned.horizontal > box.vertical.caja-side-pane > notebook scrolledwindow.frame { to (shade(@menu_bg_dark_color, 1.17))); } -.caja-navigation-window toolbar.primary-toolbar combobox > .linked > button.combo arrow { - color: @theme_selected_fg_color -} - /* navigation buttons */ .caja-navigation-window toolbar.primary-toolbar #Back button.image-button, .caja-navigation-window toolbar.primary-toolbar #Forward button.image-button { @@ -432,11 +428,11 @@ PanelToplevel > widget > button:hover:active { PanelSeparator { border-width: 0; - background-image: -gtk-gradient (linear, left top, left bottom, - from (shade (@theme_bg_dark_color, 1.03)), - to (shade (@theme_bg_dark_color, 0.95))); - color: shade (@theme_fg_dark_color, 0.45); - text-shadow: none; + color: transparent; + background-image: -gtk-scaled(url("assets/panel-grid.svg")); + background-color: transparent; + background-repeat: no-repeat; + background-position: center; } /* the grid left from wnckpager and wncktasklist */ @@ -512,8 +508,9 @@ MatePanelAppletFrameDBus { padding: 4px 2px; } +.mate-panel-menu-bar menu > menuitem, .mate-panel-menu-bar menubar > menuitem { - padding: 5px 5px; + padding: 5px; } #clock-applet-button.flat.toggle > box.horizontal > label { @@ -568,6 +565,11 @@ na-tray-applet { -NaTrayApplet-icon-size: 16; } +/* control icon size as previous setting don't work */ +na-tray-applet > widget > box { + margin: 4px -16px 4px 0px; +} + /* system-monitor-applet */ #PanelApplet > box.horizontal > box.vertical > frame { box-shadow: inset 0px 1px shade (@menu_bg_dark_color, 1.5), diff --git a/desktop-themes/Blue-Submarine/gtk-3.0/menu.css b/desktop-themes/Blue-Submarine/gtk-3.0/menu.css index b1c31965..b0ac4c6e 100644 --- a/desktop-themes/Blue-Submarine/gtk-3.0/menu.css +++ b/desktop-themes/Blue-Submarine/gtk-3.0/menu.css @@ -1,11 +1,14 @@ -/************************* - * menu - * - *************************/ - -toolbar .raised menu, -menu { - /* menu contextual */ +/********* + * Menus * + *********/ + +.context-menu { + font: initial; + text-shadow: none; +} + +menu, +.menu { background-color: @menu_bg_dark_color; background-image: -gtk-gradient (linear, left top, left bottom, @@ -18,25 +21,19 @@ menu { border-image: none; } -menu:selected { - background-color: @theme_selected_bg_color; -} - -menuitem, -menuitem:disabled { - background-color: @menu_bg_dark_color; +menu button, +.menu button { + padding: 0px; + background-image: none; + background-color: shade (@menu_bg_dark_color, 0.95); + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.3); + box-shadow: none; + border-image: none; + border-style: none; } -menubar menu button:hover, -menubar menu button:active, -menubar menu button:active:disabled, -menubar menu button:disabled, -menubar menu button, -toolbar.primary-toolbar menu button:hover, -toolbar.primary-toolbar menu button:active, -toolbar.primary-toolbar menu button:active:disabled, -toolbar.primary-toolbar menu button:disabled, -toolbar.primary-toolbar menu button { +menu button:hover, +.menu button:hover { background-color: shade (@menu_bg_dark_color, 1.07); background-image: -gtk-gradient (linear, left top, left bottom, @@ -48,25 +45,18 @@ toolbar.primary-toolbar menu button { border-image: none; } -menu button { - padding: 0px; - background-image: none; - background-color: shade (@menu_bg_dark_color, 0.95); - color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.3); - box-shadow: none; - border-image: none; - border-style: none; -} - -menu button arrow { - color: @menu_fg_dark_color; +menu button:disabled, +.menu button:disabled { + background-color: transparent; + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6); + border-image: none; + border-style: none; + text-shadow: none; } - -/*********** - * menubar * - ***********/ -menubar { +/* this controls the general appearance of the menubar */ +menubar, +.menubar { -GtkWidget-window-dragging: true; /* line 3D (dark) */ box-shadow: inset 0px -1px @menu_line_dark_color; @@ -78,25 +68,24 @@ menubar { border-bottom-color: shade(@theme_bg_dark_color, 1.60); background-color: shade (@theme_bg_dark_color, 1.00); color: @menu_fg_dark_color; - min-height: 20px; + min-height: 18px; } -/*************** - * menubaritem * - ***************/ -menubar > menuitem { +menubar > menuitem, +.menubar > menuitem { padding: 5px 5px; transition: all 300ms ease-out; border-radius: 0px; border-width: 0px; - min-height: 16px; + min-height: 18px; } -menubar > menuitem:hover { +menubar > menuitem:hover, +.menubar > menuitem:hover { background-color: shade (@theme_bg_dark_color, 1.2); border-radius: 6px; color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@menu_bg_dark_color, 2.03)), @@ -107,105 +96,42 @@ menubar > menuitem:hover { inset 0px -1px shade (@theme_selected_bg_color, 1.3); } -/************ - * menuitem * - ************/ - -toolbar .raised button menuitem, -toolbar menubar button menuitem, -toolbar menuitem, -toolbar.primary-toolbar menuitem, -toolbar.primary-toolbar button menuitem, -window.background.popup menu menuitem, -window.background.popup menuitem { -/* Fix height change in nautilus menu item view options */ - padding: 0px; - border-width: 0px; -} - -toolbar .raised button menuitem, -toolbar menubar button menuitem, -toolbar menubar .linked button menuitem, -toolbar menuitem, -toolbar.primary-toolbar menuitem, -toolbar.primary-toolbar button menuitem, -window.background.popup menu menuitem, -window.background.popup menuitem { -/* transition: all 300ms ease-out; FIXME this caused items jumpings*/ -/* -GtkMenuItem-arrow-scaling: 0.7; */ +menu > menuitem, +.menu > menuitem { + background-color: @menu_bg_dark_color; transition: all 300ms ease-out; border-radius: 0px; color: @menu_fg_dark_color; - text-shadow: 1px 1px @menu_shadow_dark_color; + text-shadow: none; padding: 5px 5px; - min-height: 22px; -} - -toolbar menuitem label, -toolbar.primary-toolbar menuitem label, -toolbar .raised button menuitem label, -toolbar menubar button menuitem label, -toolbar.primary-toolbar button menuitem label { - color: @menu_fg_dark_color; - text-shadow: 1px 1px @menu_shadow_dark_color; -} - -treemenu menu { - background-color: @menu_bg_dark_color; -} - -treemenu menuitem { - border-style: none; - border-width: 0px; -} - -toolbar combobox menuitem, -combobox menuitem { - transition: all 300ms ease-out; - color: @menu_fg_dark_color; - text-shadow: 0px 1px @menu_shadow_dark_color; + min-height: 18px; } -/* needed for .menuitem with gtk+-3.20 !!! */ -combobox menuitem .cell { +/* fixes for firefox menus */ +.menuitem { + transition: none; color: @menu_fg_dark_color; - text-shadow: 0px 1px @menu_shadow_dark_color; -} - -/* needed for .menuitem with gtk+-3.18 */ -treemenu menu menuitem .cell { - background-image: none; - background-color: transparent; - color: @menu_fg_dark_color; - text-shadow: 0px 1px @menu_shadow_dark_color; -} - -treemenu menu menuitem:hover, -combobox menuitem:hover { - background-image: -gtk-gradient (linear, - left top, left bottom, - from (shade(@menu_bg_dark_color, 2.03)), - to (shade(@menu_bg_dark_color, 1.17))); - color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } -treemenu menu menuitem:hover .cell, -combobox menuitem:hover .cell { +/* fixes for firefox menus */ +menuitem:hover, +menuitem label:hover { color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } -window.background.popup menuitem:hover, -window.background.popup menu menuitem:hover { - /* contextual menu item-selected */ +menu > menuitem:active, +menu > menuitem:hover, +.menu > menuitem:active, +.menu > menuitem:hover { background-color: shade (@theme_bg_dark_color, 1.2); background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@menu_bg_dark_color, 2.03)), to (shade(@menu_bg_dark_color, 1.17))); color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; border-radius: 6px; border-width: 1px; border-image: none; @@ -216,186 +142,188 @@ window.background.popup menu menuitem:hover { inset 0px -1px shade (@theme_selected_bg_color, 1.3); } -toolbar menuitem *:hover, -toolbar.primary-toolbar button menuitem *:hover, -toolbar .raised button menuitem *:hover, /* menuitem opciones visualizacion nautilus */ -toolbar menubar button menuitem *:hover, -combobox menuitem *:hover, -treemenu menuitem *:active, -treemenu menuitem *:hover, -window.background.popup menuitem *:active, -window.background.popup menuitem *:hover, -window.background.popup menuitem:hover, -window.background.popup menu menuitem:hover { - color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; -} - -toolbar.primary-toolbar menuitem *:disabled, -toolbar .raised button menuitem *:disabled, -toolbar.menubar button menuitem *:disabled, -toolbar.primary-toolbar button menuitem *:disabled, -toolbar menuitem *:disabled, -window.background.popup menuitem:disabled, -window.background.popup menuitem *:disabled { - /* contextual menu disabled */ +menu > menuitem:disabled, +.menu > menuitem:disabled { + background-color: @menu_bg_dark_color; color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4); text-shadow: none; } -window.background.popup menuitem check, -window.background.popup menuitem radio, -window.background.popup menuitem check:hover, -window.background.popup menuitem radio:hover, -window.background.popup menuitem check:disabled, -window.background.popup menuitem radio:disabled, -window.background.popup menuitem check:active:disabled, -window.background.popup menuitem radio:active:disabled, -window.background.popup menuitem check:checked:disabled, -window.background.popup menuitem radio:checked:disabled, -window.background.popup menuitem check:indeterminate:disabled, -window.background.popup menuitem radio:indeterminate:disabled { - border-width: 0px; - border-style: none; - background-image: none; - min-height: 12px; - min-width: 12px; - background-position: center center; +menu > menuitem accelerator:disabled, +.menu > menuitem accelerator:disabled { + color: alpha (mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4), 0.8); + text-shadow: none; } -toolbar .raised button menuitem check:indeterminate, -toolbar .raised button menuitem radio:indeterminate, -window.background.popup menuitem check:indeterminate, -window.background.popup menuitem radio:indeterminate, -toolbar .raised button menuitem check:active, -toolbar .raised button menuitem radio:active, -window.background.popup menuitem check:active, -window.background.popup menuitem radio:active, -toolbar .raised button menuitem check:checked, -toolbar .raised button menuitem radio:checked, -window.background.popup menuitem check:checked, -window.background.popup menuitem radio:checked { - border-width: 0px; - border-style: none; - background-image: none; - background-color: @menu_bg_dark_color; - /* contextual menu check */ +/* combobox menus */ +combobox #gtk-combobox-popup-menu menuitem cellview { + text-shadow: none; color: @menu_fg_dark_color; } -toolbar .raised button menuitem check:indeterminate:hover, -toolbar .raised button menuitem radio:indeterminate:hover, -window.background.popup menuitem check:indeterminate:hover, -window.background.popup menuitem radio:indeterminate:hover, -toolbar .raised button menuitem check:active:hover, -toolbar .raised button menuitem radio:active:hover, -window.background.popup menuitem check:active:hover, -window.background.popup menuitem radio:active:hover, -toolbar .raised button menuitem check:checked:hover, -toolbar .raised button menuitem radio:checked:hover, -window.background.popup menuitem check:checked:hover, -window.background.popup menuitem radio:checked:hover { - border-color: @theme_selected_fg_color; - color: @theme_selected_fg_color; +combobox #gtk-combobox-popup-menu menuitem:hover cellview { + text-shadow: none; + color: shade (@theme_selected_bg_color, 1.6); +} + +menuitem accelerator { + color: alpha (@menu_fg_dark_color, 0.8); } -window.background.popup menuitem arrow { +menuitem accelerator:hover, +menuitem accelerator:active { + color: alpha (@theme_selected_fg_color, 0.8); +} + +menuitem > arrow { min-height: 16px; min-width: 16px; margin-left: 10px; color: @menu_fg_color; } -window.background.popup menu menuitem arrow:dir(ltr) { +menu > menuitem > arrow:dir(ltr), +.menu > menuitem > arrow:dir(ltr) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); } -window.background.popup menu menuitem arrow:dir(rtl) { +menu > menuitem > arrow:dir(rtl), +.menu > menuitem > arrow:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); } -window.background.popup menu arrow.top { +menu > arrow.top, +.menu > arrow.top { -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } -window.background.popup menu arrow.bottom { +menu > arrow.bottom, +.menu > arrow.bottom { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } -window.background.popup menu arrow:hover { - border-color: @theme_selected_fg_color; - color: shade (@theme_selected_bg_color, 1.6); -} - -window.background.popup menuitem check:disabled, -window.background.popup menuitem radio:disabled, -window.background.popup menuitem check:active:disabled, -window.background.popup menuitem radio:active:disabled, -window.background.popup menuitem check:checked:disabled, -window.background.popup menuitem radio:checked:disabled, -window.background.popup menuitem check:indeterminate:disabled, -window.background.popup menuitem radio:indeterminate:disabled { - color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6); - text-shadow: none; +/* settings for 4 menu level, this is needed to override the menuitem:hover + state from previous menu level, as GtkArrow itself don't support states very well. + thanks gtk+ devs for this madness */ +menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left, +.menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left { + color: @menu_fg_dark_color; } -menubar menuitem calendar, -menubar menuitem calendar.button, -menubar menuitem calendar.header, -menubar menuitem calendar.view, -toolbar.primary-toolbar menuitem calendar, -toolbar.primary-toolbar menuitem calendar.button, -toolbar.primary-toolbar menuitem calendar.header, -toolbar.primary-toolbar menuitem calendar.view { +menu > menuitem:hover > arrow.right, +menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover > arrow.left, +menu > menuitem:hover menu > menuitem:hover arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left, +.menu > menuitem:hover > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left { + color: shade (@theme_selected_bg_color, 1.2); + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); +} + +menu > menuitem:disabled > arrow, +.menu > menuitem:disabled > arrow { background-color: @menu_bg_dark_color; - background-image: none; - border-radius: 0; - border-style: solid; - border-width: 0; - padding: 0; - color: @menu_fg_dark_color; + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4); + -gtk-icon-shadow: none; } -menubar menuitem calendar, -toolbar.primary-toolbar menuitem calendar { - background-color: shade (@menu_bg_dark_color, 1.3); +/* scroll arrows */ +menu > arrow, +.menu > arrow { + border-color: transparent; + background-color: transparent; background-image: none; + min-height: 16px; + min-width: 16px; + padding: 4px; + color: @menu_fg_dark_color; } -menubar menuitem scale trough { - background-image: -gtk-gradient (linear, - left top, - left bottom, - from (shade(@menu_bg_dark_color, 0.80)), - color-stop (0.20, shade(@menu_bg_dark_color, 0.85)), - to (shade(@menu_bg_dark_color, 0.96))); - border-style: none; - border-width: 0px; - border-radius: 8px; - box-shadow: inset 1px 1px alpha(#000, 0.08), - inset -1px -1px alpha(#000, 0.08); +menu > arrow.top, +.menu > arrow.top { + margin-top: -2px; + margin-left: -1px; + margin-right: -1px; } -menubar menuitem accelerator, -toolbar.primary-toolbar menuitem accelerator { - color: alpha (@menu_fg_dark_color, 0.8); +menu > arrow.bottom, +.menu > arrow.bottom { + margin-bottom: -2px; + margin-left: -1px; + margin-right: -1px; } -menubar menuitem accelerator:hover, -toolbar.primary-toolbar menuitem accelerator:hover { - color: alpha (@theme_selected_fg_color, 0.8); +menu > arrow:hover, +.menu > arrow:hover { + color: shade (@theme_selected_bg_color, 1.2); + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); + background-color: shade (@theme_bg_dark_color, 1.2); + background-image: -gtk-gradient (linear, + left top, left bottom, + from (shade(@menu_bg_dark_color, 2.03)), + to (shade(@menu_bg_dark_color, 1.17))); + text-shadow: none; + border-radius: 0px; + border-width: 1px; + border-image: none; + padding: 5px 5px; + box-shadow: inset 0px 1px shade (@theme_selected_bg_color, 1.3), + inset 1px 0px shade (@theme_selected_bg_color, 1.3), + inset -1px 0px shade (@theme_selected_bg_color, 1.3), + inset 0px -1px shade (@theme_selected_bg_color, 1.3); } -menubar menuitem accelerator:disabled, -toolbar.primary-toolbar menuitem accelerator:disabled { - color: alpha (mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4), 0.8); - text-shadow: none; +menu > arrow:disabled, +.menu > arrow:disabled { + color: mix (@menu_fg_color, @menu_bg_color, 0.6); + -gtk-icon-shadow: none; + background-color: transparent; + border-color: transparent; } -window.background.popup menu separator { -/* -GtkMenuItem-horizontal-padding: 0; deprecated */ -/* -GtkWidget-separator-height: 1; */ +menu separator, +.menu separator, +menuitem separator { min-height: 1px; + background-color: shade(@menu_fg_dark_color, 0.3); border-image: -gtk-gradient (linear, left top, right top, from (alpha (#000, 0.00)), @@ -404,18 +332,99 @@ window.background.popup menu separator { to (alpha (#000, 0.00))) 1; } +/* fix for broken firefox */ +menu separator { + color: shade(@menu_fg_dark_color, 0.3); +} + +menuitem check, +menuitem radio, +menuitem check:hover, +menuitem radio:hover, +menuitem check:checked, +menuitem radio:checked, +menuitem check:disabled, +menuitem radio:disabled, +menuitem check:active:disabled, +menuitem radio:active:disabled, +menuitem check:checked:disabled, +menuitem radio:checked:disabled, +menuitem check:indeterminate:disabled, +menuitem radio:indeterminate:disabled { + border-width: 0px; + border-style: none; + background-image: none; + background-color: transparent; + min-height: 12px; + min-width: 12px; + background-position: center center; + color: @menu_fg_dark_color; +} + +menuitem check:disabled, +menuitem radio:disabled, +menuitem check:active:disabled, +menuitem radio:active:disabled, +menuitem check:checked:disabled, +menuitem radio:checked:disabled, +menuitem check:indeterminate:disabled, +menuitem radio:indeterminate:disabled { + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6); + text-shadow: none; +} + /*************** * Menu Button * ***************/ -button menuitem menubar:active, -button menuitem menubar *:active { - color: @menu_fg_dark_color; - background-image: none; - background-color: @menu_bg_dark_color; - border-radius: 5px 5px 0px 0px; - border-image: none; - border-width: 1px 1px 0px 1px; - border-color: shade(@button_border, 1.30); - border-style: solid; +toolbar button.popup:selected, +toolbar .raised button.popup:selected, +button.popup:selected, +.linked button.popup:selected, +toolbar .linked.raised button.popup:selected { +/* background-image: none; + background-color: @menu_bg_color; + border-image: none; + border-color: @menu_bg_color; + border-radius: 4px 4px 0 0; + color: @theme_text_color;*/ +} + +button.popup:selected, +.linked button.popup:selected, +toolbar .linked.raised button.popup:selected { + text-shadow: none; + -gtk-icon-shadow: none; + box-shadow: none; +} + +.linked button.popup:selected:last-child, +toolbar .linked.raised button.popup:selected:last-child { + border-top-left-radius: 0; +} + +.linked button.popup:selected:first-child, +toolbar .linked.raised button.popup:selected:first-child { + border-top-right-radius: 0; +} + +menubar button.popup:selected { + background-image: none; + background-color: @menu_bg_color; + border-radius: 4px 4px 0 0; + border-image: none; + border-width: 1px 1px 0 1px; + border-color: @menu_bg_color; + border-style: solid; } + +menubar button.popup:selected, +button.popup:selected, +toolbar button.popup:selected { + color: @theme_text_color; +} + +menu button.popup { + text-shadow: none; +} + 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 ecd6a194..96c2d53b 100644 --- a/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css +++ b/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css @@ -1,8 +1,8 @@ -/*************************************************************** - * Green-Submarine * - * Part of https://github.com/NiceandGently/mate-themes-extras * - * Author Wolfgang Ulbrich * - ***************************************************************/ +/******************************************************** + * Green-Submarine * + * Part of https://github.com/mate-desktop/mate-themes * + * Author Wolfgang Ulbrich * + ********************************************************/ * { padding: 0; @@ -54,7 +54,8 @@ window { }*/ *:active { - background-color: alpha(shade(@theme_selected_bg_color, 1.90), 0.015); +/* background-color: alpha(shade(@theme_selected_bg_color, 1.90), 0.015);*/ + } *:hover:active:disabled { @@ -64,7 +65,8 @@ window { } *:hover { - background-color: alpha(shade(@menu_bg_color, 1.05), 0.0); +/* background-color: alpha(shade(@menu_bg_color, 1.05), 0.0);*/ + } *:hover:disabled { @@ -72,8 +74,9 @@ window { *:selected, *:selected:focus { - background-color: shade(@theme_selected_bg_color, 1.0); - color: @theme_selected_fg_color; +/* background-color: shade(@theme_selected_bg_color, 1.0); + color: @theme_selected_fg_color;*/ + } *:disabled { @@ -341,22 +344,22 @@ progressbar { font-size: smaller; } -progressbar.horizontal { - min-height: 16px; -} - -progressbar.vertical { - min-width: 16px; +/* progress component */ +progressbar.horizontal trough { + min-height: 18px; + border-radius: 3px; } -/* progress component */ -progressbar.horizontal trough, progressbar.horizontal progress { min-height: 16px; border-radius: 3px; } -progressbar.vertical trough, +progressbar.vertical trough { + min-width: 18px; + border-radius: 3px; +} + progressbar.vertical progress { min-width: 16px; border-radius: 3px; @@ -825,13 +828,9 @@ scrolledwindow.frame { * Buttons * ***********/ -button menuitem menubar { - padding: 4px 8px; -} - button, button.raised { - padding: 6px; + padding: 5px; min-height: 20px; min-width: 20px; } @@ -848,7 +847,6 @@ button label { button { transition: all 400ms ease-out; - -GtkArrow-arrow-scaling: 0.5; background-image: -gtk-gradient (linear, left top, left bottom, from (@button_gradient1), @@ -870,7 +868,7 @@ button { /* box-shadow Syntax */ /* box-shadow: [ inset ] horizontal_offset vertical_offset [ blur_radius ] [ spread ] color */ color: @theme_fg_color; - text-shadow: 0px 1px @theme_shadow_color; + text-shadow: none; } button.default { @@ -894,7 +892,7 @@ button.flat { /* ie. caja location drop down button */ button.flat.toggle { - padding: 6px; + padding: 5px; } /* ie. controls gnome-mplayer, virtual-manager */ @@ -902,7 +900,7 @@ button.flat.image-button, button.flat.image-button:focus, button.flat.image-button:hover, button.flat.scale { - padding: 4px; + padding: 5px; } button:hover { @@ -949,7 +947,7 @@ button:hover:active, button:checked, button:checked:hover, button:checked:hover:active { - text-shadow: 1px 1px @theme_selected_shadow_color; + text-shadow: none; } button:disabled { @@ -976,18 +974,15 @@ toolbar.vertical > button.image-button.flat { button.text-button, button.text-button:focus, button.text-button:hover, -button.file { - padding: 6px; -} - +button.file, combobox > button.combo, combobox > button.combo:hover { - padding: 4px; + padding: 5px; } button.font, button.color { - padding: 6px 4px; + padding: 5px 4px; } .path-bar > button, @@ -997,7 +992,7 @@ button.color { .linked.path-bar > button:checked, .linked.path-bar > button:checked:hover, .linked.path-bar > button:checked:hover:active { - padding: 7px; + padding: 5px; border-color: transparent; } @@ -1005,13 +1000,13 @@ button.color { .linked.path-bar > button.slider-button:first-child { border-width: 1px 0px 1px 1px; border-radius: 4px 0px 0px 4px; - padding: 7px 1px; + padding: 5px 1px; } .linked.path-bar > button.slider-button:last-child { border-width: 1px 1px 1px 0px; border-radius: 0px 4px 4px 0px; - padding: 7px 1px; + padding: 5px 1px; } .titlebar .path-bar > button.slider-button:disabled { @@ -1995,7 +1990,7 @@ combobox { padding: 0px; } -combobox .cell { +combobox cellview { /* color combobox read-only */ color: @theme_fg_color; text-shadow: 0 1px @theme_shadow_color; @@ -2047,16 +2042,20 @@ combobox button.combo:hover { color: @theme_text_color; } -toolbar combobox .cell { +toolbar combobox cellview { /* color combobox read-only */ color: shade(@toolbar_fg_color, 0.94); - text-shadow: 0 1px @toolbar_shadow_color; + text-shadow: none; } -toolbar.primary-toolbar combobox .cell { +toolbar.primary-toolbar combobox cellview { /* color combobox read-only */ color: shade(@theme_fg_dark_color, 0.94); - text-shadow: 0 1px @theme_shadow_dark_color; + text-shadow: none; +} + +toolbar.primary-toolbar combobox cellview:hover { + color: shade (@theme_selected_bg_color, 1.6); } toolbar combobox entry.combo, @@ -2371,12 +2370,16 @@ combobox button.combo:hover { toolbar combobox button.combo:checked, toolbar combobox button.combo:hover, -toolbar.primary-toolbar combobox button.combo *:checked, -toolbar.primary-toolbar combobox button.combo *:hover { - color: @theme_text_dark_color; +toolbar.primary-toolbar combobox button.combo:checked, +toolbar.primary-toolbar combobox button.combo:hover { + color: shade (@theme_selected_bg_color, 1.6); + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); } -combobox arrow { +combobox button.combo arrow { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); color: @theme_fg_color; min-height: 16px; @@ -2384,6 +2387,14 @@ combobox arrow { padding: 0px 2px; } +toolbar combobox button.combo arrow { + color: @menu_fg_dark_color; +} + +toolbar combobox button.combo:hover arrow { + color: shade (@theme_selected_bg_color, 1.6); +} + /************ * Toolbars * ************/ @@ -2509,34 +2520,25 @@ toolbar.primary-toolbar button:focus { toolbar button { color: shade(@toolbar_fg_color, 1.00); - text-shadow: 0px 1px @toolbar_shadow_color; + text-shadow: none; } -toolbar combobox button.combo { - /* color combobox read-only */ - color: shade(@toolbar_fg_color, 1.00); - text-shadow: 0px 1px @toolbar_shadow_color; - background-image: -gtk-gradient (linear, - left top, left bottom, - from (alpha(#fff, 0.04)), - to (alpha(#000, 0.06))); - border-top-color: alpha (#000, 0.15); - border-left-color: alpha (#000, 0.20); - border-right-color: alpha (#000, 0.20); - border-bottom-color: alpha (#000, 0.25); - 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); +toolbar.primary-toolbar > button.toggle #gtk-toolbar-arrow:disabled, +toolbar.primary-toolbar > toolbutton button.toggle.popup > image:disabled { + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4); } -toolbar combobox button.combo:hover { - border-radius: 5px +toolbar.primary-toolbar > button.toggle:hover #gtk-toolbar-arrow, +toolbar.primary-toolbar > toolbutton button.toggle.popup:hover > image { + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); } toolbar.primary-toolbar button { color: @theme_fg_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar.primary-toolbar .linked button:focus { @@ -2605,7 +2607,7 @@ toolbar button:checked, toolbar button:hover label, toolbar button:checked label { color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @toolbar_shadow_color; + text-shadow: none; transition: all 400ms ease-out; } @@ -2616,7 +2618,7 @@ toolbar.primary-toolbar button:hover:active, toolbar.primary-toolbar button:checked, toolbar.primary-toolbar button:checked:hover { color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar button:checked:disabled, @@ -2630,14 +2632,14 @@ toolbar.primary-toolbar button:checked:disabled { toolbar label { color: shade(@theme_fg_color, 1.10); - text-shadow: 0px 1px @theme_shadow_color; + text-shadow: none; } toolbar toolitem label, toolbar menubar label, toolbar.primary-toolbar label { color: @theme_fg_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar toolitem separator, @@ -2752,7 +2754,7 @@ toolbar button.raised:checked { toolbar .raised button label, toolbar button.raised label { color: @theme_fg_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar .raised button, @@ -2771,7 +2773,7 @@ toolbar button.raised:checked, toolbar .raised button:checked:hover, toolbar button.raised:checked:hover { color: @theme_text_dark_color; - text-shadow: 0px 1px @theme_shadow_dark_color; + text-shadow: none; } toolbar menubar button:disabled, @@ -2913,7 +2915,7 @@ toolbar.inline-toolbar button { border-style: none; box-shadow: none; color: @theme_fg_color; - text-shadow: 0 1px @theme_shadow_color; + text-shadow: none; -gtk-icon-shadow: 1px 1px @theme_shadow_color; } @@ -2960,13 +2962,13 @@ toolbar.inline-toolbar button *:disabled { toolbar.inline-toolbar button:hover { color: @theme_text_color; - text-shadow: 0 1px @theme_shadow_color; + text-shadow: none; -gtk-icon-shadow: 1px 1px @theme_shadow_color; } toolbar.inline-toolbar button:checked { color: @theme_selected_fg_color; - text-shadow: 0 1px @theme_selected_shadow_color; + text-shadow: none; -gtk-icon-shadow: 1px 1px @theme_selected_shadow_color; } @@ -3045,7 +3047,7 @@ actionbar revealer .horizontal.linked.stack-switcher button.image-button.radio:l } actionbar revealer .horizontal button.image-button.popup.toggle { - padding: 8px; + padding: 6px; } /***************** @@ -3509,8 +3511,8 @@ notebook tab.reorderable-page:checked { } /* close button styling */ -notebook button.flat, -notebook button.flat.small-button { +notebook > header button.flat, +notebook > header button.flat.small-button { border-image: none; background-image: none; background-color: transparent; @@ -3519,6 +3521,12 @@ notebook button.flat.small-button { border-color: transparent; border-width: 1px; -gtk-icon-shadow: none; + box-shadow: none; +} + +notebook > header button.flat:hover, +notebook > header button.flat.small-button:hover { + -gtk-icon-effect: highlight; } notebook tab.prelight-page button.flat.small-button, @@ -3868,7 +3876,7 @@ switch:backdrop { 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); - text-shadow: 0 1px rgba(0, 0, 0, 0.1); + text-shadow: none; } switch:checked, @@ -4031,8 +4039,7 @@ iconview.view.cell:selected:focus { inset 1px 0px alpha(#fff, 0.07), inset -1px 0px alpha(#fff, 0.07), inset 0px -1px alpha(#fff, 0.06); -/* -GtkWidget-focus-line-width: 0; */ - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } iconview.view.cell:hover, @@ -4050,7 +4057,7 @@ iconview text, textview text { background-color: @theme_base_color; color: @theme_fg_color; - text-shadow: 0px 1px @theme_shadow_color; + text-shadow: none; } view, @@ -4068,7 +4075,6 @@ view text selection:focus, from (shade(@theme_selected_bg_color, 1.0)), to (shade(@theme_selected_bg_color, 1.1))); color: @theme_selected_fg_color; - text-shadow: 0px 1px @theme_selected_shadow_color; text-shadow: none; } @@ -4079,7 +4085,7 @@ view text selection:focus, .view text selection:focus, .view:selected:focus { - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } /* for firefox and probably other apps */ @@ -4108,7 +4114,7 @@ label selection:backdrop:disabled { treeview, treeview.view { - padding: 4px + padding: 1px 4px; } treeview.dnd { @@ -4118,11 +4124,8 @@ treeview.dnd { border-style: solid; } -treeview:selected:hover, -/*does not work in recent GTK versions -treeview row:nth-child(odd):selected:hover, -treeview row:nth-child(even):selected:hover,*/ -notebook container treeview:selected { +treeview.view:selected:hover, +notebook container treeview.view:selected { background-image: -gtk-gradient (linear, left top, left bottom, @@ -4138,12 +4141,8 @@ treeview.view:focus { border-style: none; } -.view row:hover, -/*does not work in recent GTK versions -treeview row:nth-child(odd):hover, -treeview row:nth-child(even):hover,*/ -treeview:hover, -notebook container treeview:hover { +treeview.view:hover, +notebook container treeview.view:hover { background-image: -gtk-gradient (linear, left top, left bottom, @@ -4155,18 +4154,17 @@ notebook container treeview:hover { } /*Keep treeviews from jumping, separators drawn at 0 by default until hovered*/ -treeview.view.separator { - min-height: 2px; -} - -treeview header { - padding: 0px 2px; +treeview.view.separator, +treeview.view.separator:hover { + min-height: 2px; + color: shade(@theme_bg_color, 0.87); + background-color: shade(@theme_bg_color, 0.87); } -treeview header button, -treeview header button:focus { - padding: 0px 4px 1px; -/* -GtkWidget-focus-line-width: 0; */ +treeview.view > header > button, +treeview.view > header > button:focus { + min-height: 18px; + padding: 0px 4px; background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@button_base, 1.00)), @@ -4187,7 +4185,7 @@ treeview header button:focus { inset 0px -1px alpha(#fff, 0.05); } -treeview header button:hover { +treeview.view > header > button:hover { background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@button_gradient1, 1.03)), @@ -4207,7 +4205,7 @@ treeview header button:hover { inset 0px -1px shade(@selected_bg_color, 0.93); } -treeview header button:focus:hover:active { +treeview.view > header > button:focus:hover:active { background-image: -gtk-gradient (linear, left top, left bottom, from (shade (@theme_bg_color, 1.20)), @@ -4218,7 +4216,7 @@ treeview header button:focus:hover:active { box-shadow: none; } -treeview header button:disabled { +treeview.view > header > button:disabled { background-image: none; background-color: @insensitive_bg_color; border-color: @insensitive_border_color; @@ -4226,35 +4224,18 @@ treeview header button:disabled { box-shadow: none; } -treeview header button arrow { - color: @internal_element_color; -} - -treeview header:nth-child(last) button { - border-width: 0px 0px 1px 0px; -} - -row { - min-height: 22px; -} - -row:disabled { - border-width: 0px; +treeview.view > header > button label, +treeview.view > header > button label:focus, +treeview.view > header > button label:backdrop { + padding: 0px; } -row:selected, -row:selected:focus { - border-width: 1px 0 1px 0; - border-style: solid; - box-shadow: none; +treeview.view > header > button arrow { + color: @internal_element_color; } -row:selected:backdrop, -row:selected:focus:backdrop { - border-width: 1px 0 1px 0; - border-style: solid; - text-shadow: none; - box-shadow: none; +treeview.view > header > button:nth-child(last) { + border-width: 0px 0px 1px 0px; } .cell { @@ -4269,128 +4250,6 @@ row:selected:focus:backdrop { background-color: alpha(@theme_base_color, 0.0); } -/********************* - * App Notifications * - *********************/ - -.app-notification, -.app-notification.frame { - color: @theme_dark_fg_color; - padding: 10px; - border: none; - border-radius: 0 0 4px 4px; - background-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(0, 0, 0, 0.2), - transparent 2px); - background-clip: padding-box; -} - -.app-notification:backdrop, -.app-notification.frame:backdrop { - background-image: none; -} - -.app-notification button, -.app-notification headerbar button.titlebutton, -headerbar .app-notification button.titlebutton, -.app-notification .titlebar button.titlebutton, -.titlebar .app-notification button.titlebutton, -.app-notification calendar.header button.titlebutton, -calendar.header .app-notification button.titlebutton, -.app-notification.frame button { - color: @theme_dark_fg_color; - border-color: rgba(114, 180, 157, 0.7); - background-image: linear-gradient(to bottom, - rgba(0, 0, 0, 0.7)); - background-clip: padding-box; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - text-shadow: none; - -gtk-icon-shadow: 0 1px black; - outline-color: rgba(238, 238, 236, 0.3); - border-radius: 3px; - padding: 0 0px 2px 0px; -} - -.app-notification button.flat, -.app-notification headerbar button.titlebutton, -headerbar .app-notification button.titlebutton, -.app-notification .titlebar button.titlebutton, -.titlebar .app-notification button.titlebutton, -.app-notification calendar.header button.titlebutton, -calendar.header .app-notification button.titlebutton, -.app-notification.frame button.flat, -.app-notification.frame headerbar button.titlebutton, -headerbar .app-notification.frame button.titlebutton, -.app-notification.frame .titlebar button.titlebutton, -.titlebar .app-notification.frame button.titlebutton, -.app-notification.frame calendar.header button.titlebutton, -calendar.header .app-notification.frame button.titlebutton { - -gtk-icon-shadow: 0 1px black; - text-shadow: 0 1px black; -} - -.app-notification button:hover, -.app-notification.frame button:hover { - color: black; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(203, 217, 212, 0.7)); - background-clip: padding-box; - box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); - text-shadow: none; - -gtk-icon-shadow: 0 1px black; - outline-color: rgba(238, 238, 236, 0.3); - border-radius: 3px; - padding: 0 0px 2px 0px; -} - -.app-notification button:checked, -.app-notification button:backdrop:checked, -.app-notification.frame button:checked, -.app-notification.frame button:backdrop:active { - color: white; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(114, 180, 157, 0.7)); - background-clip: padding-box; - box-shadow: none; - text-shadow: none; - -gtk-icon-shadow: none; - outline-color: rgba(238, 238, 236, 0.3); - border-radius: 3px; -} - -.app-notification button:disabled, -.app-notification button:backdrop:disabled, -.app-notification.frame button:disabled, -.app-notification.frame button:backdrop:disabled { - color: #878989; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(52, 57, 57, 0.5)); - background-clip: padding-box; - box-shadow: none; - text-shadow: none; - -gtk-icon-shadow: none; - border-radius: 3px; - padding: 0px; -} - -.app-notification button:backdrop, -.app-notification.frame button:backdrop { - color: #eeeeec; - border-color: rgba(0, 0, 0, 0.7); - background-image: linear-gradient(to bottom, - rgba(172, 205, 138, 0.7)); - background-clip: padding-box; - box-shadow: none; - text-shadow: none; - -gtk-icon-shadow: none; - border-radius: 3px; - padding: 0px; -} - /************* * Expanders * *************/ @@ -4487,6 +4346,29 @@ list .separator.horizontal { border-width: 0px; } +row { + min-height: 22px; +} + +row:disabled { + border-width: 0px; +} + +row:selected, +row:selected:focus { + border-width: 1px 0 1px 0; + border-style: solid; + box-shadow: none; +} + +row:selected:backdrop, +row:selected:focus:backdrop { + border-width: 1px 0 1px 0; + border-style: solid; + text-shadow: none; + box-shadow: none; +} + list row, list row.activatable { padding: 2px; @@ -4547,13 +4429,135 @@ list row.activatable:selected:backdrop:hover { box-shadow: none; } +/********************* + * App Notifications * + *********************/ + +.app-notification, +.app-notification.frame { + color: @theme_dark_fg_color; + padding: 10px; + border: none; + border-radius: 0 0 4px 4px; + background-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(0, 0, 0, 0.2), + transparent 2px); + background-clip: padding-box; +} + +.app-notification:backdrop, +.app-notification.frame:backdrop { + background-image: none; +} + +.app-notification button, +.app-notification headerbar button.titlebutton, +headerbar .app-notification button.titlebutton, +.app-notification .titlebar button.titlebutton, +.titlebar .app-notification button.titlebutton, +.app-notification calendar.header button.titlebutton, +calendar.header .app-notification button.titlebutton, +.app-notification.frame button { + color: @theme_dark_fg_color; + border-color: rgba(114, 180, 157, 0.7); + background-image: linear-gradient(to bottom, + rgba(0, 0, 0, 0.7)); + background-clip: padding-box; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + text-shadow: none; + -gtk-icon-shadow: 0 1px black; + outline-color: rgba(238, 238, 236, 0.3); + border-radius: 3px; + padding: 0 0px 2px 0px; +} + +.app-notification button.flat, +.app-notification headerbar button.titlebutton, +headerbar .app-notification button.titlebutton, +.app-notification .titlebar button.titlebutton, +.titlebar .app-notification button.titlebutton, +.app-notification calendar.header button.titlebutton, +calendar.header .app-notification button.titlebutton, +.app-notification.frame button.flat, +.app-notification.frame headerbar button.titlebutton, +headerbar .app-notification.frame button.titlebutton, +.app-notification.frame .titlebar button.titlebutton, +.titlebar .app-notification.frame button.titlebutton, +.app-notification.frame calendar.header button.titlebutton, +calendar.header .app-notification.frame button.titlebutton { + -gtk-icon-shadow: 0 1px black; + text-shadow: 0 1px black; +} + +.app-notification button:hover, +.app-notification.frame button:hover { + color: black; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(203, 217, 212, 0.7)); + background-clip: padding-box; + box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); + text-shadow: none; + -gtk-icon-shadow: 0 1px black; + outline-color: rgba(238, 238, 236, 0.3); + border-radius: 3px; + padding: 0 0px 2px 0px; +} + +.app-notification button:checked, +.app-notification button:backdrop:checked, +.app-notification.frame button:checked, +.app-notification.frame button:backdrop:active { + color: white; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(114, 180, 157, 0.7)); + background-clip: padding-box; + box-shadow: none; + text-shadow: none; + -gtk-icon-shadow: none; + outline-color: rgba(238, 238, 236, 0.3); + border-radius: 3px; +} + +.app-notification button:disabled, +.app-notification button:backdrop:disabled, +.app-notification.frame button:disabled, +.app-notification.frame button:backdrop:disabled { + color: #878989; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(52, 57, 57, 0.5)); + background-clip: padding-box; + box-shadow: none; + text-shadow: none; + -gtk-icon-shadow: none; + border-radius: 3px; + padding: 0px; +} + +.app-notification button:backdrop, +.app-notification.frame button:backdrop { + color: #eeeeec; + border-color: rgba(0, 0, 0, 0.7); + background-image: linear-gradient(to bottom, + rgba(172, 205, 138, 0.7)); + background-clip: padding-box; + box-shadow: none; + text-shadow: none; + -gtk-icon-shadow: none; + border-radius: 3px; + padding: 0px; +} + /************** * Calendar * **************/ calendar { border-radius: 3px; - border-color: shade (@theme_fg_color, 0.8); + border-color: @notebook_border; padding: 1px 1px 3px 1px; } @@ -4775,7 +4779,7 @@ dialog scrolledwindow.frame viewport .vertical expander .vertical { .dialog-action-area.linked > button.text-button:disabled { border-width: 1px 1px 1px 0px; border-radius: 0; - padding: 8px 6px; + padding: 6px 6px; margin: 0px 0px 0px -2px; min-height: 16px; min-width: 16px; @@ -4908,7 +4912,7 @@ dialog scrolledwindow.frame viewport .vertical expander .vertical { .background.osd { color: @osd_fg; - text-shadow: 0 1px @osd_text_shadow; + text-shadow: none; border-style: solid; border-width: 1px; border-color: shade (@theme_selected_bg_color, 0.8); @@ -4991,7 +4995,7 @@ button.osd:focus { @osd_button_bg_b 68%, @osd_button_bg_c); color: @osd_button_fg; - text-shadow: 0 -1px @osd_button_shadow; + text-shadow: none; -gtk-icon-shadow: 0 -1px @osd_button_shadow; } @@ -5022,7 +5026,7 @@ button.osd.menu-button:checked { @osd_button_bg_active_b 68%, @osd_button_bg_active_c); color: @osd_button_fg_active; - text-shadow: 0 -1px @osd_button_shadow; + text-shadow: none; } .osd button.menu-button:checked { @@ -5078,7 +5082,7 @@ button.osd.menu-button:checked { toolbar.osd { color: @osd_fg; - text-shadow: 0 1px @osd_text_shadow; + text-shadow: none; padding: 10px; border-style: solid; border-width: 1px; @@ -5356,7 +5360,7 @@ popover.osd toolbar { } popover.osd button { - text-shadow: 0 -1px @osd_text_shadow; + text-shadow: none; -gtk-icon-shadow: 0 -1px @osd_text_shadow; } @@ -5453,7 +5457,8 @@ popover button.image-button:disabled { modelbutton.flat, .linked button.image-button.model { - min-height: 24px; + min-height: 24px; + padding: 4px; } modelbutton.flat arrow.left { @@ -6595,7 +6600,7 @@ colorchooser box.horizontal box.horizontal grid.horizontal{ background-color: @theme_bg_color; border-color: shade(@theme_bg_color, 0.85); color: @theme_text_color; - text-shadow: 0 1px @theme_shadow_color; + text-shadow: none; border-radius: 3px; border-width: 1px; border-style: solid; @@ -6634,3 +6639,39 @@ colorchooser box.horizontal box.horizontal grid.horizontal{ box-shadow: inset -1px 1px alpha(#fff, 0.07); } +/*********** + * FlowBox * + ***********/ + +flowbox { + background-color: shade (@theme_bg_color, 1.1); + -gtk-icon-style: regular; + border-style: solid; + border-color: alpha(@frame_color, 0.6); + border-width: 1px 1px 1px 1px; + border-radius: 3px; + padding: 8px; +} + +flowbox > flowboxchild, +flowbox > flowboxchild:focus, +flowbox > flowboxchild:backdrop { + border-style: solid; + border-width: 2px; + border-radius: 3px; + border-color: transparent; + color: @theme_text_color; + +} + +flowbox > flowboxchild:selected, +flowbox > flowboxchild:selected:focus, +flowbox > flowboxchild:selected:hover, +flowbox > flowboxchild:selected:focus:hover { + border-style: solid; + border-width: 2px; + border-radius: 3px; + border-color: alpha(@theme_selected_bg_color, 0.75); + color: @theme_text_color; +} + 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 c6ac0e22..316c388e 100644 --- a/desktop-themes/Green-Submarine/gtk-3.0/mate-applications.css +++ b/desktop-themes/Green-Submarine/gtk-3.0/mate-applications.css @@ -292,10 +292,6 @@ paned.horizontal > box.vertical.caja-side-pane > notebook scrolledwindow.frame { to (shade(@menu_bg_dark_color, 1.17))); } -.caja-navigation-window toolbar.primary-toolbar combobox > .linked > button.combo arrow { - color: @theme_selected_fg_color -} - /* navigation buttons */ .caja-navigation-window toolbar.primary-toolbar #Back button.image-button, .caja-navigation-window toolbar.primary-toolbar #Forward button.image-button { @@ -430,11 +426,11 @@ PanelToplevel > widget > button:hover:active { PanelSeparator { border-width: 0; - background-image: -gtk-gradient (linear, left top, left bottom, - from (shade (@theme_bg_dark_color, 1.03)), - to (shade (@theme_bg_dark_color, 0.95))); - color: shade (@theme_fg_dark_color, 0.45); - text-shadow: none; + color: transparent; + background-image: -gtk-scaled(url("assets/panel-grid.svg")); + background-color: transparent; + background-repeat: no-repeat; + background-position: center; } /* the grid left from wnckpager and wncktasklist */ @@ -510,8 +506,9 @@ MatePanelAppletFrameDBus { padding: 4px 2px; } +.mate-panel-menu-bar menu > menuitem, .mate-panel-menu-bar menubar > menuitem { - padding: 5px 5px; + padding: 5px; } #clock-applet-button.flat.toggle > box.horizontal > label { @@ -566,6 +563,11 @@ na-tray-applet { -NaTrayApplet-icon-size: 16; } +/* control icon size as previous setting don't work */ +na-tray-applet > widget > box { + margin: 4px -16px 4px 0px; +} + /* system-monitor-applet */ #PanelApplet > box.horizontal > box.vertical > frame { box-shadow: inset 0px 1px shade (@menu_bg_dark_color, 1.5), diff --git a/desktop-themes/Green-Submarine/gtk-3.0/menu.css b/desktop-themes/Green-Submarine/gtk-3.0/menu.css index 12de5c40..1d12a279 100644 --- a/desktop-themes/Green-Submarine/gtk-3.0/menu.css +++ b/desktop-themes/Green-Submarine/gtk-3.0/menu.css @@ -1,11 +1,14 @@ -/************************* - * menu - * - *************************/ - -toolbar .raised menu, -menu { - /* menu contextual */ +/********* + * Menus * + *********/ + +.context-menu { + font: initial; + text-shadow: none; +} + +menu, +.menu { background-color: @menu_bg_dark_color; background-image: -gtk-gradient (linear, left top, left bottom, @@ -18,25 +21,19 @@ menu { border-image: none; } -menu:selected { - background-color: @theme_selected_bg_color; -} - -menuitem, -menuitem:disabled { - background-color: @menu_bg_dark_color; +menu button, +.menu button { + padding: 0px; + background-image: none; + background-color: shade (@menu_bg_dark_color, 0.95); + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.3); + box-shadow: none; + border-image: none; + border-style: none; } -menubar menu button:hover, -menubar menu button:active, -menubar menu button:active:disabled, -menubar menu button:disabled, -menubar menu button, -toolbar.primary-toolbar menu button:hover, -toolbar.primary-toolbar menu button:active, -toolbar.primary-toolbar menu button:active:disabled, -toolbar.primary-toolbar menu button:disabled, -toolbar.primary-toolbar menu button { +menu button:hover, +.menu button:hover { background-color: shade (@menu_bg_dark_color, 1.07); background-image: -gtk-gradient (linear, left top, left bottom, @@ -48,25 +45,18 @@ toolbar.primary-toolbar menu button { border-image: none; } -menu button { - padding: 0px; - background-image: none; - background-color: shade (@menu_bg_dark_color, 0.95); - color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.3); - box-shadow: none; - border-image: none; - border-style: none; -} - -menu button arrow { - color: @menu_fg_dark_color; +menu button:disabled, +.menu button:disabled { + background-color: transparent; + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6); + border-image: none; + border-style: none; + text-shadow: none; } - -/*********** - * menubar * - ***********/ -menubar { +/* this controls the general appearance of the menubar */ +menubar, +.menubar { -GtkWidget-window-dragging: true; /* line 3D (dark) */ box-shadow: inset 0px -1px @menu_line_dark_color; @@ -78,25 +68,24 @@ menubar { border-bottom-color: shade(@theme_bg_dark_color, 1.60); background-color: shade (@theme_bg_dark_color, 1.00); color: @menu_fg_dark_color; - min-height: 20px; + min-height: 18px; } -/*************** - * menubaritem * - ***************/ -menubar > menuitem { +menubar > menuitem, +.menubar > menuitem { padding: 5px 5px; transition: all 300ms ease-out; border-radius: 0px; border-width: 0px; - min-height: 16px; + min-height: 18px; } -menubar > menuitem:hover { +menubar > menuitem:hover, +.menubar > menuitem:hover { background-color: shade (@theme_bg_dark_color, 1.2); border-radius: 6px; color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@menu_bg_dark_color, 2.03)), @@ -107,105 +96,42 @@ menubar > menuitem:hover { inset 0px -1px shade(@selected_bg_color, 0.93); } -/************ - * menuitem * - ************/ - -toolbar .raised button menuitem, -toolbar menubar button menuitem, -toolbar menuitem, -toolbar.primary-toolbar menuitem, -toolbar.primary-toolbar button menuitem, -window.background.popup menu menuitem, -window.background.popup menuitem { -/* Fix height change in nautilus menu item view options */ - padding: 0px; - border-width: 0px; -} - -toolbar .raised button menuitem, -toolbar menubar button menuitem, -toolbar menubar .linked button menuitem, -toolbar menuitem, -toolbar.primary-toolbar menuitem, -toolbar.primary-toolbar button menuitem, -window.background.popup menu menuitem, -window.background.popup menuitem { -/* transition: all 300ms ease-out; FIXME this caused items jumpings*/ -/* -GtkMenuItem-arrow-scaling: 0.7; */ +menu > menuitem, +.menu > menuitem { + background-color: @menu_bg_dark_color; transition: all 300ms ease-out; border-radius: 0px; color: @menu_fg_dark_color; - text-shadow: 1px 1px @menu_shadow_dark_color; + text-shadow: none; padding: 5px 5px; - min-height: 22px; -} - -toolbar menuitem label, -toolbar.primary-toolbar menuitem label, -toolbar .raised button menuitem label, -toolbar menubar button menuitem label, -toolbar.primary-toolbar button menuitem label { - color: @menu_fg_dark_color; - text-shadow: 1px 1px @menu_shadow_dark_color; -} - -treemenu menu { - background-color: @menu_bg_dark_color; -} - -treemenu menuitem { - border-style: none; - border-width: 0px; -} - -toolbar combobox menuitem, -combobox menuitem { - transition: all 300ms ease-out; - color: @menu_fg_dark_color; - text-shadow: 0px 1px @menu_shadow_dark_color; + min-height: 18px; } -/* needed for .menuitem with gtk+-3.20 !!! */ -combobox menuitem .cell { +/* fixes for firefox menus */ +.menuitem { + transition: none; color: @menu_fg_dark_color; - text-shadow: 0px 1px @menu_shadow_dark_color; -} - -/* needed for .menuitem with gtk+-3.18 */ -treemenu menu menuitem .cell { - background-image: none; - background-color: transparent; - color: @menu_fg_dark_color; - text-shadow: 0px 1px @menu_shadow_dark_color; -} - -treemenu menu menuitem:hover, -combobox menuitem:hover { - background-image: -gtk-gradient (linear, - left top, left bottom, - from (shade(@menu_bg_dark_color, 2.03)), - to (shade(@menu_bg_dark_color, 1.17))); - color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } -treemenu menu menuitem:hover .cell, -combobox menuitem:hover .cell { +/* fixes for firefox menus */ +menuitem:hover, +menuitem label:hover { color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; } -window.background.popup menuitem:hover, -window.background.popup menu menuitem:hover { - /* contextual menu item-selected */ +menu > menuitem:active, +menu > menuitem:hover, +.menu > menuitem:active, +.menu > menuitem:hover { background-color: shade (@theme_bg_dark_color, 1.2); background-image: -gtk-gradient (linear, left top, left bottom, from (shade(@menu_bg_dark_color, 2.03)), to (shade(@menu_bg_dark_color, 1.17))); color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; + text-shadow: none; border-radius: 6px; border-width: 1px; border-image: none; @@ -216,186 +142,188 @@ window.background.popup menu menuitem:hover { inset 0px -1px shade(@selected_bg_color, 0.93); } -toolbar menuitem *:hover, -toolbar.primary-toolbar button menuitem *:hover, -toolbar .raised button menuitem *:hover, /* menuitem opciones visualizacion nautilus */ -toolbar menubar button menuitem *:hover, -combobox menuitem *:hover, -treemenu menuitem *:active, -treemenu menuitem *:hover, -window.background.popup menuitem *:active, -window.background.popup menuitem *:hover, -window.background.popup menuitem:hover, -window.background.popup menu menuitem:hover { - color: shade (@theme_selected_bg_color, 1.6); - text-shadow: 0px 1px @theme_selected_shadow_color; -} - -toolbar.primary-toolbar menuitem *:disabled, -toolbar .raised button menuitem *:disabled, -toolbar.menubar button menuitem *:disabled, -toolbar.primary-toolbar button menuitem *:disabled, -toolbar menuitem *:disabled, -window.background.popup menuitem:disabled, -window.background.popup menuitem *:disabled { - /* contextual menu disabled */ +menu > menuitem:disabled, +.menu > menuitem:disabled { + background-color: @menu_bg_dark_color; color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4); text-shadow: none; } -window.background.popup menuitem check, -window.background.popup menuitem radio, -window.background.popup menuitem check:hover, -window.background.popup menuitem radio:hover, -window.background.popup menuitem check:disabled, -window.background.popup menuitem radio:disabled, -window.background.popup menuitem check:active:disabled, -window.background.popup menuitem radio:active:disabled, -window.background.popup menuitem check:checked:disabled, -window.background.popup menuitem radio:checked:disabled, -window.background.popup menuitem check:indeterminate:disabled, -window.background.popup menuitem radio:indeterminate:disabled { - border-width: 0px; - border-style: none; - background-image: none; - min-height: 12px; - min-width: 12px; - background-position: center center; +menu > menuitem accelerator:disabled, +.menu > menuitem accelerator:disabled { + color: alpha (mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4), 0.8); + text-shadow: none; } -toolbar .raised button menuitem check:indeterminate, -toolbar .raised button menuitem radio:indeterminate, -window.background.popup menuitem check:indeterminate, -window.background.popup menuitem radio:indeterminate, -toolbar .raised button menuitem check:active, -toolbar .raised button menuitem radio:active, -window.background.popup menuitem check:active, -window.background.popup menuitem radio:active, -toolbar .raised button menuitem check:checked, -toolbar .raised button menuitem radio:checked, -window.background.popup menuitem check:checked, -window.background.popup menuitem radio:checked { - border-width: 0px; - border-style: none; - background-image: none; - background-color: @menu_bg_dark_color; - /* contextual menu check */ +/* combobox menus */ +combobox #gtk-combobox-popup-menu menuitem cellview { + text-shadow: none; color: @menu_fg_dark_color; } -toolbar .raised button menuitem check:indeterminate:hover, -toolbar .raised button menuitem radio:indeterminate:hover, -window.background.popup menuitem check:indeterminate:hover, -window.background.popup menuitem radio:indeterminate:hover, -toolbar .raised button menuitem check:active:hover, -toolbar .raised button menuitem radio:active:hover, -window.background.popup menuitem check:active:hover, -window.background.popup menuitem radio:active:hover, -toolbar .raised button menuitem check:checked:hover, -toolbar .raised button menuitem radio:checked:hover, -window.background.popup menuitem check:checked:hover, -window.background.popup menuitem radio:checked:hover { - border-color: @theme_selected_fg_color; - color: @theme_selected_fg_color; +combobox #gtk-combobox-popup-menu menuitem:hover cellview { + text-shadow: none; + color: shade (@theme_selected_bg_color, 1.6); +} + +menuitem accelerator { + color: alpha (@menu_fg_dark_color, 0.8); } -window.background.popup menuitem arrow { +menuitem accelerator:hover, +menuitem accelerator:active { + color: alpha (@theme_selected_fg_color, 0.8); +} + +menuitem > arrow { min-height: 16px; min-width: 16px; margin-left: 10px; color: @menu_fg_color; } -window.background.popup menu menuitem arrow:dir(ltr) { +menu > menuitem > arrow:dir(ltr), +.menu > menuitem > arrow:dir(ltr) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic"); } -window.background.popup menu menuitem arrow:dir(rtl) { +menu > menuitem > arrow:dir(rtl), +.menu > menuitem > arrow:dir(rtl) { -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl"); } -window.background.popup menu arrow.top { +menu > arrow.top, +.menu > arrow.top { -gtk-icon-source: -gtk-icontheme("pan-up-symbolic"); } -window.background.popup menu arrow.bottom { +menu > arrow.bottom, +.menu > arrow.bottom { -gtk-icon-source: -gtk-icontheme("pan-down-symbolic"); } -window.background.popup menu arrow:hover { - border-color: @theme_selected_fg_color; - color: shade (@theme_selected_bg_color, 1.6); -} - -window.background.popup menuitem check:disabled, -window.background.popup menuitem radio:disabled, -window.background.popup menuitem check:active:disabled, -window.background.popup menuitem radio:active:disabled, -window.background.popup menuitem check:checked:disabled, -window.background.popup menuitem radio:checked:disabled, -window.background.popup menuitem check:indeterminate:disabled, -window.background.popup menuitem radio:indeterminate:disabled { - color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6); - text-shadow: none; +/* settings for 4 menu level, this is needed to override the menuitem:hover + state from previous menu level, as GtkArrow itself don't support states very well. + thanks gtk+ devs for this madness */ +menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right, +menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left, +.menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right, +.menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left { + color: @menu_fg_dark_color; } -menubar menuitem calendar, -menubar menuitem calendar.button, -menubar menuitem calendar.header, -menubar menuitem calendar.view, -toolbar.primary-toolbar menuitem calendar, -toolbar.primary-toolbar menuitem calendar.button, -toolbar.primary-toolbar menuitem calendar.header, -toolbar.primary-toolbar menuitem calendar.view { +menu > menuitem:hover > arrow.right, +menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right, +menu > menuitem:hover > arrow.left, +menu > menuitem:hover menu > menuitem:hover arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left, +menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left, +.menu > menuitem:hover > arrow.right, +.menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right, +.menu > menuitem:hover > arrow.left, +.menu > menuitem:hover .menu > menuitem:hover arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left, +.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left { + color: shade (@theme_selected_bg_color, 1.2); + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); +} + +menu > menuitem:disabled > arrow, +.menu > menuitem:disabled > arrow { background-color: @menu_bg_dark_color; - background-image: none; - border-radius: 0; - border-style: solid; - border-width: 0; - padding: 0; - color: @menu_fg_dark_color; + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4); + -gtk-icon-shadow: none; } -menubar menuitem calendar, -toolbar.primary-toolbar menuitem calendar { - background-color: shade (@menu_bg_dark_color, 1.3); +/* scroll arrows */ +menu > arrow, +.menu > arrow { + border-color: transparent; + background-color: transparent; background-image: none; + min-height: 16px; + min-width: 16px; + padding: 4px; + color: @menu_fg_dark_color; } -menubar menuitem scale trough { - background-image: -gtk-gradient (linear, - left top, - left bottom, - from (shade(@menu_bg_dark_color, 0.80)), - color-stop (0.20, shade(@menu_bg_dark_color, 0.85)), - to (shade(@menu_bg_dark_color, 0.96))); - border-style: none; - border-width: 0px; - border-radius: 8px; - box-shadow: inset 1px 1px alpha(#000, 0.08), - inset -1px -1px alpha(#000, 0.08); +menu > arrow.top, +.menu > arrow.top { + margin-top: -2px; + margin-left: -1px; + margin-right: -1px; } -menubar menuitem accelerator, -toolbar.primary-toolbar menuitem accelerator { - color: alpha (@menu_fg_dark_color, 0.8); +menu > arrow.bottom, +.menu > arrow.bottom { + margin-bottom: -2px; + margin-left: -1px; + margin-right: -1px; } -menubar menuitem accelerator:hover, -toolbar.primary-toolbar menuitem accelerator:hover { - color: alpha (@theme_selected_fg_color, 0.8); +menu > arrow:hover, +.menu > arrow:hover { + color: shade (@theme_selected_bg_color, 1.2); + -gtk-icon-shadow: 0px 1px shade (@menu_fg_dark_color, 1.0), + 1px 0px shade (@menu_fg_dark_color, 1.0), + -1px 0px shade (@menu_fg_dark_color, 1.0), + 0px -1px shade (@menu_fg_dark_color, 1.0); + background-color: shade (@theme_bg_dark_color, 1.2); + background-image: -gtk-gradient (linear, + left top, left bottom, + from (shade(@menu_bg_dark_color, 2.03)), + to (shade(@menu_bg_dark_color, 1.17))); + text-shadow: none; + border-radius: 0px; + border-width: 1px; + border-image: none; + padding: 5px 5px; + 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); } -menubar menuitem accelerator:disabled, -toolbar.primary-toolbar menuitem accelerator:disabled { - color: alpha (mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4), 0.8); - text-shadow: none; +menu > arrow:disabled, +.menu > arrow:disabled { + color: mix (@menu_fg_color, @menu_bg_color, 0.6); + -gtk-icon-shadow: none; + background-color: transparent; + border-color: transparent; } -window.background.popup menu separator { -/* -GtkMenuItem-horizontal-padding: 0; deprecated */ -/* -GtkWidget-separator-height: 1; */ +menu separator, +.menu separator, +menuitem separator { min-height: 1px; + background-color: shade(@menu_fg_dark_color, 0.3); border-image: -gtk-gradient (linear, left top, right top, from (alpha (#000, 0.00)), @@ -404,18 +332,99 @@ window.background.popup menu separator { to (alpha (#000, 0.00))) 1; } +/* fix for broken firefox */ +menu separator { + color: shade(@menu_fg_dark_color, 0.3); +} + +menuitem check, +menuitem radio, +menuitem check:hover, +menuitem radio:hover, +menuitem check:checked, +menuitem radio:checked, +menuitem check:disabled, +menuitem radio:disabled, +menuitem check:active:disabled, +menuitem radio:active:disabled, +menuitem check:checked:disabled, +menuitem radio:checked:disabled, +menuitem check:indeterminate:disabled, +menuitem radio:indeterminate:disabled { + border-width: 0px; + border-style: none; + background-image: none; + background-color: transparent; + min-height: 12px; + min-width: 12px; + background-position: center center; + color: @menu_fg_dark_color; +} + +menuitem check:disabled, +menuitem radio:disabled, +menuitem check:active:disabled, +menuitem radio:active:disabled, +menuitem check:checked:disabled, +menuitem radio:checked:disabled, +menuitem check:indeterminate:disabled, +menuitem radio:indeterminate:disabled { + color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6); + text-shadow: none; +} + /*************** * Menu Button * ***************/ -button menuitem menubar:active, -button menuitem menubar *:active { - color: @menu_fg_dark_color; - background-image: none; - background-color: @menu_bg_dark_color; - border-radius: 5px 5px 0px 0px; - border-image: none; - border-width: 1px 1px 0px 1px; - border-color: shade(@button_border, 1.30); - border-style: solid; +toolbar button.popup:selected, +toolbar .raised button.popup:selected, +button.popup:selected, +.linked button.popup:selected, +toolbar .linked.raised button.popup:selected { +/* background-image: none; + background-color: @menu_bg_color; + border-image: none; + border-color: @menu_bg_color; + border-radius: 4px 4px 0 0; + color: @theme_text_color;*/ +} + +button.popup:selected, +.linked button.popup:selected, +toolbar .linked.raised button.popup:selected { + text-shadow: none; + -gtk-icon-shadow: none; + box-shadow: none; +} + +.linked button.popup:selected:last-child, +toolbar .linked.raised button.popup:selected:last-child { + border-top-left-radius: 0; +} + +.linked button.popup:selected:first-child, +toolbar .linked.raised button.popup:selected:first-child { + border-top-right-radius: 0; +} + +menubar button.popup:selected { + background-image: none; + background-color: @menu_bg_color; + border-radius: 4px 4px 0 0; + border-image: none; + border-width: 1px 1px 0 1px; + border-color: @menu_bg_color; + border-style: solid; } + +menubar button.popup:selected, +button.popup:selected, +toolbar button.popup:selected { + color: @theme_text_color; +} + +menu button.popup { + text-shadow: none; +} + -- cgit v1.2.1