From 724f0bc90ffcb46e53a3c841fe8d280fb8f5797b Mon Sep 17 00:00:00 2001 From: raveit65 Date: Sat, 25 Apr 2015 22:36:33 +0200 Subject: ContrastHigh GTK3: adjust notebook style --- .../ContrastHigh/gtk-3.0/gtk-widgets.css | 290 +++++++++++++++++---- 1 file changed, 236 insertions(+), 54 deletions(-) (limited to 'desktop-themes/ContrastHigh') diff --git a/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css b/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css index 6824eb14..2ed0e060 100644 --- a/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css +++ b/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css @@ -1213,100 +1213,282 @@ GtkSwitch.trough:active:insensitive { * Notebook * ************/ .notebook { - padding: 0; - border-width: 1px; - border-color: @theme_notebook_border; + padding: 0; + background-clip: border-box; border-style: solid; - background-color: @theme_notebook_bg; - border-top-left-radius: 4px; - border-top-right-radius: 4px; - border-bottom-left-radius: 3px; - border-bottom-right-radius: 3px; + border-color: @theme_border_color; + border-width: 0px; + background-color: shade (@theme_bg_color, 1.1); + -GtkNotebook-initial-gap: 0; + -GtkNotebook-arrow-spacing: 5; + -GtkNotebook-tab-curvature: 0; + -GtkNotebook-tab-overlap: 0; + -GtkNotebook-has-tab-gap: false; + -GtkWidget-focus-padding: 0; + -GtkWidget-focus-line-width: 0; } -.notebook GtkScrolledWindow { - background-color: @theme_base_color; +.notebook :hover { + -gtk-image-effect: highlight; + color: @theme_fg_color; } -.notebook.frame { - border-width: 1px; +.notebook.frame.top { + border-width: 0px 1px 1px 1px; } -.notebook.header { - background-image: linear-gradient(to bottom, - shade(@theme_bg_color, 0.96), - shade(@theme_bg_color, 1.0)); - border-width: 0px; - box-shadow: inset 0 1px 0 0 alpha(@borders, 0.4), inset 0 -1px 0 0 alpha(@borders, 1.0); +.notebook.frame.bottom { + border-width: 1px 1px 0px 1px; } -.notebook.header.frame.top { - border-top: 1px solid @borders; - border-left: 1px solid @borders; - border-right: 1px solid @borders; +.notebook.frame.left { + border-width: 1px 1px 1px 0px; } -.notebook.header.frame.bottom { - border-bottom: 1px solid @borders; - border-left: 1px solid @borders; - border-right: 1px solid @borders; +.notebook.frame.right { + border-width: 1px 0px 1px 1px; } -.notebook.header.frame.left { - border-top: 1px solid @borders; - border-bottom: 1px solid @borders; - border-left: 1px solid @borders; +.notebook.header { + background-image: linear-gradient(to bottom, + shade(@theme_bg_color, 0.76), + shade(@theme_bg_color, 0.8)); + border-width: 0px; + } + +.notebook.header.top { + border-width: 1px; + border-radius: 4px 4px 0px 0px; +} + +.notebook.header.bottom { + border-width: 1px; + border-radius: 0px 0px 4px 4px; +} + +.notebook.header.left { + border-width: 1px; + border-radius: 4px 0px 0px 4px; } -.notebook.header.frame.right { - border-top: 1px solid @borders; - border-bottom: 1px solid @borders; - border-right: 1px solid @borders; +.notebook.header.right { + border-width: 1px; + border-radius: 0px 4px 4px 0px; } .notebook GtkViewport { - background-color: @theme_base_color; - border-width: 0px; + background-color: @theme_base_color; + border-width: 0px; } .notebook tab { - padding: 3px; - background-color: @theme_base_color; + border-color: transparent; + border-width: 0px; + background-image: none; + background-color: transparent; } .notebook tab GtkLabel { - color: @theme_fg_color; - font-weight: normal; + color: mix (@theme_fg_color, @theme_bg_color, 0.40); + font-weight: normal; } -.notebook tab:active { - background-color: @theme_notebook_bg; +.notebook .prelight-page, +.notebook .prelight-page GtkLabel { + color: mix (@theme_fg_color, @theme_bg_color, 0.15); +} + +.notebook .active-page, +.notebook tab .active-page GtkLabel { color: @theme_fg_color; } -.notebook tab.top { - border-image: linear-gradient(to bottom, - alpha(@theme_notebook_border, 0.00), - @theme_notebook_border) 1 / 0 1px; +/* horizontal tabs */ + +.notebook tab.top, +/* wtf, why this doesn't work? */ +.notebook tab.bottom { + padding: 6px 21px 4px; +} + +/* workaround for wtf */ +.notebook tab.bottom:active { + padding: 3px 21px 7px 21px; +} + +.notebook tab.top:active, +.notebook tab.top:active:hover { + background-image: linear-gradient(to bottom, + shade(@theme_bg_color, 1.18), + shade(@theme_bg_color, 1.1)); + border-radius: 4px 4px 0px 0px; + border-width: 1px 1px 0px 1px; + border-style: solid; + border-color: @borders; + box-shadow: none; +} + +.notebook tab.top:hover { + background-image: linear-gradient(to bottom, + alpha(@theme_active_color, 0.2), + alpha(@theme_active_color, 0.5)); + border-radius: 0px; + border-width: 0px 1px 0px 1px; + border-style: solid; + border-color: @borders; +} + +.notebook tab.bottom:active, +.notebook tab.bottom:active:hover { + background-image: linear-gradient(to top, + shade(@theme_bg_color, 1.18), + shade(@theme_bg_color, 1.1)); + border-radius: 0 0 4px 4px; + border-style: solid; + border-width: 0px 1px 1px 1px; + border-color: @borders; + box-shadow: none; +} + +.notebook tab.bottom:hover { + background-image: linear-gradient(to top, + alpha(@theme_active_color, 0.0), + alpha(@theme_active_color, 0.3)); + border-radius: 0px; + border-width: 0px 1px 0px 1px; + border-style: solid; + border-color: @borders; +} + +/* vertical tabs */ + +.notebook tab.left, +.notebook tab.right { + padding: 5px 20px; } -.notebook tab.top:active { - border-width: 1px 1px 0 1px; +.notebook tab.left:active, +.notebook tab.left:active:hover { + background-image: linear-gradient(to right, + shade(@theme_bg_color, 1.18), + shade(@theme_bg_color, 1.1)); + border-radius: 4px 0px 0px 4px; + border-width: 1px 0px 1px 1px; + border-color: @borders; +} + +.notebook tab.left:hover { + background-image: linear-gradient(to right, + alpha(@theme_active_color, 0.0), + alpha(@theme_active_color, 0.3)); + border-width: 1px 0px 1px 0px; + border-style: solid; + border-color: @borders; +} + +.notebook tab.right:active, +.notebook tab.right:active:hover { + background-image: linear-gradient(to left, + shade(@theme_bg_color, 1.18), + shade(@theme_bg_color, 1.1)); + border-radius: 0px 4px 4px 0px; + border-width: 1px 1px 1px 0px; + border-color: @borders; +} + +.notebook tab.right:hover { + background-image: linear-gradient(to left, + alpha(@theme_active_color, 0.0), + alpha(@theme_active_color, 0.3)); + border-width: 1px 0px 1px 0px; + border-style: solid; + border-color: @borders; +} + +.notebook tab.reorderable-page:hover { + background-image: linear-gradient(to bottom, + alpha(@theme_active_color, 0.0), + alpha(@theme_active_color, 0.3)); + border-radius: 0; + box-shadow: inset 1px 0 alpha(@borders, 0.6), inset -1px 0 alpha(@borders, 0.6); + border-style: none; +} + +.notebook tab.reorderable-page:active { + background-image: linear-gradient(to bottom, + shade(@theme_bg_color, 1.18), + shade(@theme_bg_color, 1.1)); border-radius: 4px 4px 0 0; + box-shadow: none; + border-style: solid; +} +/* close button styling */ +.notebook tab .button { + color: mix (@theme_fg_color, @theme_bg_color, 0.85); border-image: none; + background-image: none; + background-color: transparent; + border-radius: 3px; + border-style: solid; + border-color: transparent; + border-width: 1px; + padding: 1px; + icon-shadow: none; } -.notebook tab.bottom { - border-width: 0 1px 1px 1px; +.notebook .prelight-page .button, +.notebook tab.prelight-page .button, +.notebook .active-page .button, +.notebook tab.active-page .button { + color: mix(@theme_fg_color, @theme_active_color, 0.6); + icon-shadow: 0 1px @button_text_shadow; } -.notebook tab.left { - border-width: 1px 0 1px 1px; +.notebook tab .button:hover { + color: @theme_fg_color; + border-color: transparent; + border-image: none; + background-image: none; + background-color: transparent; } -.notebook tab.right { - border-width: 1px 1px 1px 0; +.notebook tab .button:active, +.notebook tab .button:active:hover { + color: @button_active_text; + background-color: alpha(black, 0.08); + box-shadow: inset 0 1px alpha(black, 0.05); + icon-shadow: 0 1px @button_active_text_shadow; + border-color: alpha(black, 0.27) + alpha(black, 0.13) + alpha(black, 0.13) + alpha(black, 0.13); +} + +.notebook.arrow { + /* FIXME, why this doesn't work? */ + -GtkNotebook-arrow-scaling: 0.5; + color: shade(@theme_fg_color, 2.6); +} + +.notebook.arrow:hover { + color: @theme_active_color; +} + +.notebook.arrow:active { + color: @theme_fg_color; +} + +.notebook.arrow:insensitive { + color: rgba(141, 144, 145, 0.3); +} + +.notebook.arrow:backdrop { + color: rgba(84, 89, 90, 0.4); +} + +.notebook.arrow:backdrop:insensitive { + color: #c7c7c7; } /******************************* -- cgit v1.2.1