Changed tabs to a buttonish look. Fixed checks and radios borders. Fixed scrollbar buttons on hovering and checking

This commit is contained in:
eudaimon 2021-10-21 18:17:50 +02:00
parent 7ddf4a46e0
commit c6bfdb0096
3 changed files with 112 additions and 57 deletions

View File

@ -2866,10 +2866,10 @@ notebook > header {
border-color: @borders;
border-width: 1px;
background-color: @theme_bg_color_breeze }
notebook > header:backdrop {
/*notebook > header:backdrop {
border-color: @unfocused_borders;
background-color: @theme_unfocused_bg_color_breeze; }
notebook > header tabs {
background-color: @theme_unfocused_bg_color_breeze; }*/
/*notebook > header tabs {
margin: 0px; }
notebook > header.top {
border-bottom-style: solid; }
@ -2910,7 +2910,10 @@ notebook > header {
notebook > header.right > tabs > tab:backdrop {
box-shadow: none; }
notebook > header.right > tabs > tab:checked {
box-shadow: inset 3px 0 @theme_selected_bg_color_breeze; }
box-shadow: inset 3px 0 @theme_selected_bg_color_breeze; }*/
notebook > header.top > tabs > arrow {
border-top-style: none; }
notebook > header.bottom > tabs > arrow {
@ -2954,17 +2957,35 @@ notebook > header {
box-shadow: inset 0 1px alpha(white, 0);
text-shadow: none;
-gtk-icon-shadow: none; }
notebook > header tab {
notebook > header tab {
min-height: 30px;
min-width: 30px;
padding: 3px 12px;
padding: 0 1em;
margin: 3px 4px;
outline-offset: -8px;
color: alpha (@theme_fg_color_breeze, 0.5);
color: alpha(@theme_fg_color_breeze, 0.5);
font-weight: bold;
border-width: 1px;
border-color: transparent; }
notebook > header tab:hover {
color: @theme_fg_color_breeze; }
border-color: transparent;
border-radius: 0.3em; }
notebook > header tab:hover {
background-color: alpha(@theme_selected_bg_color_breeze ,0.5);
}
notebook > header tab:checked {
background-color: @theme_selected_bg_color_breeze;
color: @theme_selected_fg_color_breeze;
border-color: black;
box-shadow: 0 2px 2px -1px black,
inset 0 1px 1px 0 alpha(white, 0.5),
inset 0 -1px 1px 0 alpha(black, 0.5); }
notebook > header tab:hover.reorderable-page {
border-color: alpha (@borders, 0.3);
background-color: alpha (@theme_bg_color_breeze, 0.2); }
@ -2973,8 +2994,7 @@ notebook > header {
notebook > header tab:backdrop.reorderable-page {
border-color: transparent;
background-color: transparent; }*/
notebook > header tab:checked {
color: @theme_fg_color_breeze; }
notebook > header tab:checked.reorderable-page {
border-color: alpha (@borders, 0.5);
background-color: alpha (@theme_bg_color_breeze, 0.5); }
@ -2982,9 +3002,9 @@ notebook > header {
background-color: alpha (@theme_bg_color_breeze, 0.7); }
/*notebook > header tab:backdrop:checked {
color: @wm_unfocused_title; }*/
notebook > header tab:backdrop:checked.reorderable-page {
/*notebook > header tab:backdrop:checked.reorderable-page {
border-color: @unfocused_borders;
background-color: @theme_bg_color_breeze; }
background-color: @theme_bg_color_breeze; }*/
notebook > header tab button.flat {
padding: 0;
margin-top: 4px;
@ -3001,7 +3021,7 @@ notebook > header {
notebook > header tab button.flat:first-child {
margin-left: -4px;
margin-right: 4px; }
notebook > header.top tabs, notebook > header.bottom tabs {
/* notebook > header.top tabs, notebook > header.bottom tabs {
padding-left: 0px;
padding-right: 0px; }
notebook > header.top tabs:not(:only-child), notebook > header.bottom tabs:not(:only-child) {
@ -3034,7 +3054,7 @@ notebook > header {
notebook > header.top tab {
padding-bottom: 4px; }
notebook > header.bottom tab {
padding-top: 4px; }
padding-top: 4px; }*/
notebook > stack:not(:only-child) {
background-color: @theme_base_color_breeze; }
@ -3151,7 +3171,7 @@ background-image:linear-gradient(to bottom, transparent, transparent 45%, red 48
text-shadow: none;
-gtk-icon-shadow: none;
color: @theme_fg_color_breeze; }
scrollbar button:hover {
/*scrollbar button:hover {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -3174,7 +3194,7 @@ background-image:linear-gradient(to bottom, transparent, transparent 45%, red 48
box-shadow: inset 0 1px alpha(white, 0);
text-shadow: none;
-gtk-icon-shadow: none;
color: alpha(@theme_fg_color_breeze, 0.5); }
color: alpha(@theme_fg_color_breeze, 0.5); }*/
/* scrollbar button:backdrop {
border-color: transparent;
background-color: transparent;
@ -3372,11 +3392,12 @@ check,
radio {
margin: 0 4px;
background: @theme_base_color_breeze;
box-shadow: inset 0px 0px 0px 1px alpha(black, 0.5), inset 0 3px 3px 0px alpha (black, 0.5);
box-shadow: inset 0 3px 3px 0px alpha (black, 0.5);
color: @theme_text_color_breeze;
min-height: 14px;
min-width: 14px;
padding: 1px;
border: 1px solid @theme_text_color_breeze;
-gtk-icon-source: none; }
check:only-child,
radio:only-child {
@ -3396,7 +3417,9 @@ radio {
/*box-shadow: none;*/ }
check:hover,
radio:hover {
box-shadow: inset 0px 0px 0px 1px alpha (@theme_selected_bg_color_breeze, 0.8), inset 0 3px 3px 0px alpha (black, 0.5);}
border-color: @theme_selected_bg_color_breeze;
}
check:active, check:checked,
radio:active,
radio:checked {
@ -3406,8 +3429,9 @@ radio {
check:disabled,
radio:disabled {
background: alpha (@theme_base_color_breeze, 0.7);
box-shadow: inset 0px 0px 0px 1px alpha(black, 0.1);
color: @theme_disabled_fg_color; }
box-shadow: none;
color: @theme_disabled_fg_color;
border-color: @theme_disabled_fg_color; }
check:disabled:active, check:disabled:checked,
radio:disabled:active,
radio:disabled:checked {
@ -4311,9 +4335,12 @@ row {
.app-notification.frame {
padding: 10px;
border-radius: 0 0 2px 2px;
background-color: rgba(28, 31, 32, 0.7);
background-color: alpha(@hint_bg,0.8);/*rgba(28, 31, 32, 0.7);*/
background-image: linear-gradient(to bottom, alpha(black, 0.2), transparent 2px);
background-clip: padding-box; }
background-clip: padding-box;
border-radius: 0.5em;
border: 1px solid @hint_fg;
}
.app-notification:backdrop,
.app-notification.frame:backdrop {
background-image: none;
@ -4321,7 +4348,7 @@ row {
.app-notification border,
.app-notification.frame border {
border: none; }
.app-notification label {color: @hint_fg;}
/*************
* Expanders *
*************/

View File

@ -2907,10 +2907,10 @@ notebook > header {
border-color: @borders;
border-width: 1px;
background-color: @theme_bg_color_breeze }
notebook > header:backdrop {
/*notebook > header:backdrop {
border-color: @unfocused_borders;
background-color: @theme_unfocused_bg_color_breeze; }
notebook > header tabs {
background-color: @theme_unfocused_bg_color_breeze; }*/
/*notebook > header tabs {
margin: 0px; }
notebook > header.top {
border-bottom-style: solid; }
@ -2951,7 +2951,10 @@ notebook > header {
notebook > header.right > tabs > tab:backdrop {
box-shadow: none; }
notebook > header.right > tabs > tab:checked {
box-shadow: inset 3px 0 @theme_selected_bg_color_breeze; }
box-shadow: inset 3px 0 @theme_selected_bg_color_breeze; }*/
notebook > header.top > tabs > arrow {
border-top-style: none; }
notebook > header.bottom > tabs > arrow {
@ -2995,37 +2998,54 @@ notebook > header {
box-shadow: inset 0 1px alpha(white, 0);
text-shadow: none;
-gtk-icon-shadow: none; }
notebook > header tab {
notebook > header tab {
min-height: 30px;
min-width: 30px;
padding: 3px 12px;
padding: 0 1em;
margin: 3px 4px;
outline-offset: -8px;
color: alpha(@theme_fg_color_breeze, 0.5);
font-weight: bold;
border-width: 1px;
border-color: transparent; }
notebook > header tab:hover {
color: @theme_fg_color_breeze; }
border-color: transparent;
border-radius: 0.3em; }
notebook > header tab:hover {
background-color: alpha(@theme_selected_bg_color_breeze ,0.5);
}
notebook > header tab:checked {
background-color: @theme_selected_bg_color_breeze;
color: @theme_selected_fg_color_breeze;
border-color: black;
box-shadow: 0 2px 2px -1px black,
inset 0 1px 1px 0 alpha(white, 0.5),
inset 0 -1px 1px 0 alpha(black, 0.5); }
notebook > header tab:hover.reorderable-page {
border-color: alpha(@borders, 0.3);
background-color: alpha(@theme_bg_color_breeze, 0.2); }
border-color: alpha (@borders, 0.3);
background-color: alpha (@theme_bg_color_breeze, 0.2); }
/*notebook > header tab:backdrop {
color: @theme_unfocused_bg_color_breeze; }
notebook > header tab:backdrop.reorderable-page {
border-color: transparent;
background-color: transparent; }*/
notebook > header tab:checked {
color: @theme_fg_color_breeze; }
notebook > header tab:checked.reorderable-page {
border-color: alpha(@borders, 0.5);
background-color: alpha(@theme_bg_color_breeze, 0.5); }
border-color: alpha (@borders, 0.5);
background-color: alpha (@theme_bg_color_breeze, 0.5); }
notebook > header tab:checked.reorderable-page:hover {
background-color: alpha(@theme_bg_color_breeze, 0.7); }
background-color: alpha (@theme_bg_color_breeze, 0.7); }
/*notebook > header tab:backdrop:checked {
color: @wm_unfocused_title; }*/
notebook > header tab:backdrop:checked.reorderable-page {
/*notebook > header tab:backdrop:checked.reorderable-page {
border-color: @unfocused_borders;
background-color: @theme_bg_color_breeze; }
background-color: @theme_bg_color_breeze; }*/
notebook > header tab button.flat {
padding: 0;
margin-top: 4px;
@ -3042,7 +3062,7 @@ notebook > header {
notebook > header tab button.flat:first-child {
margin-left: -4px;
margin-right: 4px; }
notebook > header.top tabs, notebook > header.bottom tabs {
/* notebook > header.top tabs, notebook > header.bottom tabs {
padding-left: 0px;
padding-right: 0px; }
notebook > header.top tabs:not(:only-child), notebook > header.bottom tabs:not(:only-child) {
@ -3075,7 +3095,7 @@ notebook > header {
notebook > header.top tab {
padding-bottom: 4px; }
notebook > header.bottom tab {
padding-top: 4px; }
padding-top: 4px; }*/
notebook > stack:not(:only-child) {
background-color: @theme_base_color_breeze; }
@ -3192,7 +3212,7 @@ background-image:linear-gradient(to bottom, transparent, transparent 45%, red 48
text-shadow: none;
-gtk-icon-shadow: none;
color: @theme_fg_color_breeze; }
scrollbar button:hover {
/*scrollbar button:hover {
border-color: transparent;
background-color: transparent;
background-image: none;
@ -3215,7 +3235,7 @@ background-image:linear-gradient(to bottom, transparent, transparent 45%, red 48
box-shadow: inset 0 1px alpha(white, 0);
text-shadow: none;
-gtk-icon-shadow: none;
color: alpha(@theme_fg_color_breeze, 0.5); }
color: alpha(@theme_fg_color_breeze, 0.5); }*/
/* scrollbar button:backdrop {
border-color: transparent;
background-color: transparent;
@ -3413,11 +3433,12 @@ check,
radio {
margin: 0 4px;
background: @theme_base_color_breeze;
box-shadow: inset 0px 0px 0px 1px alpha(black, 0.5), inset 0 3px 3px 0px alpha(black, 0.5);
box-shadow: inset 0 3px 3px 0px alpha (black, 0.5);
color: @theme_text_color_breeze;
min-height: 14px;
min-width: 14px;
padding: 1px;
border: 1px solid @theme_text_color_breeze;
-gtk-icon-source: none; }
check:only-child,
radio:only-child {
@ -3432,12 +3453,14 @@ radio {
margin-right: 0; }
check:indeterminate,
radio:indeterminate {
background: shade(mix(@warning_color_breeze,@theme_selected_bg_color_breeze,0.5), 1.025);
background: shade (mix(@warning_color_breeze,@theme_selected_bg_color_breeze,0.5), 1.025);
color: @theme_selected_fg_color_breeze;
/*box-shadow: none;*/ }
check:hover,
radio:hover {
box-shadow: inset 0px 0px 0px 1px alpha(@theme_selected_bg_color_breeze, 0.8), inset 0 3px 3px 0px alpha(black, 0.5);}
border-color: @theme_selected_bg_color_breeze;
}
check:active, check:checked,
radio:active,
radio:checked {
@ -3446,9 +3469,10 @@ radio {
/*box-shadow: none;*/ }
check:disabled,
radio:disabled {
background: alpha(@theme_base_color_breeze, 0.7);
box-shadow: inset 0px 0px 0px 1px alpha(black, 0.1);
color: @theme_disabled_fg_color; }
background: alpha (@theme_base_color_breeze, 0.7);
box-shadow: none;
color: @theme_disabled_fg_color;
border-color: @theme_disabled_fg_color; }
check:disabled:active, check:disabled:checked,
radio:disabled:active,
radio:disabled:checked {
@ -3458,7 +3482,7 @@ radio {
padding: 1px; }
check:disabled:indeterminate,
radio:disabled:indeterminate {
background: alpha(mix(@warning_color_breeze,@theme_selected_bg_color_breeze,0.5), 0.7);
background: alpha (mix(@warning_color_breeze,@theme_selected_bg_color_breeze,0.5), 0.7);
color: @theme_disabled_fg_color;
box-shadow: none; }
/*check:backdrop,
@ -4352,9 +4376,12 @@ row {
.app-notification.frame {
padding: 10px;
border-radius: 0 0 2px 2px;
background-color: rgba(28, 31, 32, 0.7);
background-color: alpha(@hint_bg,0.8);/*rgba(28, 31, 32, 0.7);*/
background-image: linear-gradient(to bottom, alpha(black, 0.2), transparent 2px);
background-clip: padding-box; }
background-clip: padding-box;
border-radius: 0.5em;
border: 1px solid @hint_fg;
}
.app-notification:backdrop,
.app-notification.frame:backdrop {
background-image: none;
@ -4362,6 +4389,7 @@ row {
.app-notification border,
.app-notification.frame border {
border: none; }
.app-notification label {color: @hint_fg;}
/*************
* Expanders *

View File

@ -11,7 +11,7 @@
@define-color disabled_bg #c19292;
@define-color selected_fg #000000;
@define-color selected_bg #5a6f3a;
@define-color selected_bg #7c9f47;
@define-color warning_color #f57900;
@define-color error_color #990000;