2017-07-11 16:20:48 +00:00
* { padding : 0 ; - gtk-secondary-caret-color : #4a90d9 ; }
2018-01-01 19:53:43 +00:00
button : focus ( visible ) , checkbutton : focus ( visible ) , radiobutton : focus ( visible ) , switch : focus ( visible ) , scale : focus ( visible ) , label : focus ( visible ) , row : focus ( visible ) , flowboxchild : focus ( visible ) { outline-color : alpha ( currentColor , 0.3 ) ; outline-style : dashed ; outline-offset : -3 px ; outline-width : 1 px ; - gtk-outline-radius : 2 px ; }
2014-06-13 18:42:38 +00:00
2017-05-03 15:43:45 +00:00
/*************** Base States * */
. background { color : #2e3436 ; background-color : #e8e8e7 ; }
. background : backdrop { color : #8b8e8f ; background-color : #e8e8e7 ; text-shadow : none ; - gtk-icon-shadow : none ; }
2018-01-01 19:53:43 +00:00
. normal-icons { - gtk-icon-size : 16 px ; }
. large-icons { - gtk-icon-size : 32 px ; }
image . drag-icon { - gtk-icon-size : 32 px ; }
2017-05-03 15:43:45 +00:00
/* These wildcard seems unavoidable, need to investigate. Wildcards are bad and troublesome, use them with care, or better, just don't. Everytime a wildcard is used a kitten dies, painfully. */
* : disabled { - gtk-icon-filter : opacity ( 0.5 ) ; }
. gtkstyle-fallback { color : #2e3436 ; background-color : #e8e8e7 ; }
. gtkstyle-fallback : hover { color : #2e3436 ; background-color : white ; }
. gtkstyle-fallback : active { color : #2e3436 ; background-color : #cfcfcd ; }
. gtkstyle-fallback : disabled { color : #8b8e8f ; background-color : #f1f1f1 ; }
. gtkstyle-fallback : selected { color : #ffffff ; background-color : #4a90d9 ; }
. view , iconview , . view text , iconview text , textview text { color : black ; background-color : #ffffff ; }
. view : backdrop , iconview : backdrop , . view text : backdrop , iconview text : backdrop , textview text : backdrop { color : #323232 ; background-color : #fcfcfc ; }
. view : backdrop : disabled , iconview : backdrop : disabled , . view text : backdrop : disabled , iconview text : backdrop : disabled , textview text : backdrop : disabled { color : #c3c3c0 ; }
. view : disabled , iconview : disabled , . view text : disabled , iconview text : disabled , textview text : disabled { color : #8b8e8f ; background-color : #f1f1f1 ; }
. view : selected : focus , iconview : selected : focus , . view : selected , iconview : selected , . view text : selected : focus , iconview text : selected : focus , textview text : selected : focus , . view text : selected , iconview text : selected , textview text : selected { border-radius : 3 px ; }
2017-10-25 07:34:52 +00:00
. view , iconview , textview { outline : none ; }
2017-05-03 15:43:45 +00:00
textview border { background-color : #f4f4f3 ; }
. rubberband , rubberband , flowbox rubberband , treeview . view rubberband , . content-view rubberband , . content-view . rubberband { border : 1 px solid #2a76c6 ; background-color : rgba ( 42 , 118 , 198 , 0.2 ) ; }
flowbox flowboxchild { padding : 3 px ; }
flowbox flowboxchild : selected { outline-offset : -2 px ; }
. content-view . tile { margin : 2 px ; background-color : transparent ; border-radius : 0 ; padding : 0 ; }
. content-view . tile : backdrop { background-color : transparent ; }
. content-view . tile : active , . content-view . tile : selected { background-color : transparent ; }
. content-view . tile : disabled { background-color : transparent ; }
2018-01-01 19:53:43 +00:00
label { caret-color : currentColor ; }
2017-05-03 15:43:45 +00:00
label . separator { color : #2e3436 ; }
label . separator : backdrop { color : #8b8e8f ; }
label selection { background-color : #4a90d9 ; color : #ffffff ; }
label : disabled { color : #8b8e8f ; }
label : disabled : backdrop { color : #c3c3c0 ; }
label : backdrop { color : #8b8e8f ; }
. dim-label , label . separator , . titlebar : not ( headerbar ) . subtitle , headerbar . subtitle { opacity : 0.55 ; text-shadow : none ; }
assistant . sidebar { background-color : #ffffff ; border-top : 1 px solid #b6b6b3 ; }
assistant . sidebar : backdrop { background-color : #fcfcfc ; border-color : #c0c0bd ; }
assistant . csd . sidebar { border-top-style : none ; }
assistant . sidebar label { padding : 6 px 12 px ; }
assistant . sidebar label . highlight { background-color : #c3c4c4 ; }
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection , . csd popover > contents . background . magnifier , popover > contents . background . touch-selection , popover > contents . background . magnifier , . csd popover > contents . background . osd , popover > contents . background . osd , . app-notification , . app-notification . frame , . osd . scale-popup , . osd { color : #eeeeec ; border : none ; background-color : rgba ( 28 , 31 , 32 , 0.7 ) ; background-clip : padding-box ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection : backdrop , . csd popover > contents . background . magnifier : backdrop , popover > contents . background . touch-selection : backdrop , popover > contents . background . magnifier : backdrop , . csd popover > contents . background . osd : backdrop , popover > contents . background . osd : backdrop , . app-notification : backdrop , . osd . scale-popup : backdrop , . osd : backdrop { text-shadow : none ; - gtk-icon-shadow : none ; }
2017-05-03 15:43:45 +00:00
/********************* Spinner Animation * */
@ keyframes spin { to { - gtk-icon-transform : rotate ( 1 turn ) ; } }
spinner { background : none ; opacity : 0 ; - gtk-icon-source : - gtk-icontheme ( "process-working-symbolic" ) ; }
spinner : checked { opacity : 1 ; animation : spin 1 s linear infinite ; }
spinner : checked : disabled { opacity : 0.5 ; }
/**************** Text Entries * */
spinbutton : not ( . vertical ) , entry { min-height : 32 px ; padding-left : 8 px ; padding-right : 8 px ; border : 1 px solid ; border-radius : 3 px ; transition : all 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; color : black ; border-color : #b6b6b3 ; background-color : #ffffff ; box-shadow : inset 0 0 0 1 px rgba ( 74 , 144 , 217 , 0 ) ; }
spinbutton : not ( . vertical ) image . left , entry image . left { margin-right : 6 px ; }
spinbutton : not ( . vertical ) image . right , entry image . right { margin-left : 6 px ; }
spinbutton : not ( . vertical ) undershoot . left , entry undershoot . left { background-color : transparent ; background-image : linear-gradient ( to top , rgba ( 255 , 255 , 255 , 0.2 ) 50 % , rgba ( 0 , 0 , 0 , 0.2 ) 50 % ) ; padding-left : 1 px ; background-size : 1 px 10 px ; background-repeat : repeat-y ; background-origin : content-box ; background-position : left center ; border : none ; box-shadow : none ; }
spinbutton : not ( . vertical ) undershoot . right , entry undershoot . right { background-color : transparent ; background-image : linear-gradient ( to top , rgba ( 255 , 255 , 255 , 0.2 ) 50 % , rgba ( 0 , 0 , 0 , 0.2 ) 50 % ) ; padding-right : 1 px ; background-size : 1 px 10 px ; background-repeat : repeat-y ; background-origin : content-box ; background-position : right center ; border : none ; box-shadow : none ; }
2017-10-31 19:43:52 +00:00
spinbutton . flat : focus : not ( . vertical ) , spinbutton . flat : backdrop : not ( . vertical ) , spinbutton . flat : disabled : not ( . vertical ) , spinbutton . flat : backdrop : disabled : not ( . vertical ) , spinbutton . flat : not ( . vertical ) , entry . flat : focus , entry . flat : backdrop , entry . flat : disabled , entry . flat : backdrop : disabled , entry . flat { min-height : 0 ; padding : 2 px ; background-color : transparent ; border-color : transparent ; border-radius : 0 ; }
2017-05-03 15:43:45 +00:00
2017-10-25 07:34:52 +00:00
spinbutton : focus : not ( . vertical ) , entry : focus { box-shadow : inset 0 0 0 1 px #4a90d9 ; border-color : #4a90d9 ; outline : none ; }
2017-05-03 15:43:45 +00:00
spinbutton : disabled : not ( . vertical ) , entry : disabled { color : #8b8e8f ; border-color : #b6b6b3 ; background-color : #f1f1f1 ; box-shadow : none ; }
spinbutton : backdrop : not ( . vertical ) , entry : backdrop { color : #323232 ; border-color : #c0c0bd ; background-color : #fcfcfc ; box-shadow : none ; transition : 200 ms ease-out ; }
spinbutton : backdrop : disabled : not ( . vertical ) , entry : backdrop : disabled { color : #c3c3c0 ; border-color : #c0c0bd ; background-color : #f1f1f1 ; box-shadow : none ; }
spinbutton . error : not ( . vertical ) , entry . error { color : #cc0000 ; border-color : #cc0000 ; }
2017-10-25 07:34:52 +00:00
spinbutton . error : focus : not ( . vertical ) , entry . error : focus { box-shadow : inset 0 0 0 1 px #cc0000 ; border-color : #cc0000 ; outline : none ; }
2017-05-03 15:43:45 +00:00
spinbutton . error : not ( . vertical ) selection , entry . error selection { background-color : #cc0000 ; }
spinbutton . warning : not ( . vertical ) , entry . warning { color : #f57900 ; border-color : #f57900 ; }
2017-10-25 07:34:52 +00:00
spinbutton . warning : focus : not ( . vertical ) , entry . warning : focus { box-shadow : inset 0 0 0 1 px #f57900 ; border-color : #f57900 ; outline : none ; }
2017-05-03 15:43:45 +00:00
spinbutton . warning : not ( . vertical ) selection , entry . warning selection { background-color : #f57900 ; }
spinbutton : not ( . vertical ) image , entry image { color : #585d5e ; }
spinbutton : not ( . vertical ) image : hover , entry image : hover { color : #2e3436 ; }
spinbutton : not ( . vertical ) image : active , entry image : active { color : #4a90d9 ; }
spinbutton : not ( . vertical ) image : backdrop , entry image : backdrop { color : #a2a4a5 ; }
spinbutton : drop ( active ) : focus : not ( . vertical ) , spinbutton : drop ( active ) : not ( . vertical ) , entry : drop ( active ) : focus , entry : drop ( active ) { border-color : #4e9a06 ; box-shadow : inset 0 0 0 1 px #4e9a06 ; }
. osd spinbutton : not ( . vertical ) , . osd entry { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : rgba ( 0 , 0 , 0 , 0.5 ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; }
. osd spinbutton : focus : not ( . vertical ) , . osd entry : focus { color : white ; border-color : #4a90d9 ; background-color : rgba ( 0 , 0 , 0 , 0.5 ) ; background-clip : padding-box ; box-shadow : inset 0 0 0 1 px #4a90d9 ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; }
. osd spinbutton : backdrop : not ( . vertical ) , . osd entry : backdrop { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : rgba ( 0 , 0 , 0 , 0.5 ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
. osd spinbutton : disabled : not ( . vertical ) , . osd entry : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : rgba ( 49 , 52 , 52 , 0.5 ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
2017-06-28 05:25:34 +00:00
spinbutton : not ( . vertical ) progress , entry progress { margin-bottom : 2 px ; }
2017-05-03 15:43:45 +00:00
2017-06-28 05:25:34 +00:00
spinbutton : not ( . vertical ) progress > trough > progress , entry progress > trough > progress { background-color : transparent ; background-image : none ; border-radius : 0 ; border-width : 0 0 2 px ; border-color : #4a90d9 ; border-style : solid ; box-shadow : none ; }
spinbutton : not ( . vertical ) progress > trough > progress : backdrop , entry progress > trough > progress : backdrop { background-color : transparent ; }
2017-05-03 15:43:45 +00:00
. linked : not ( . vertical ) > spinbutton : focus : not ( . vertical ) + spinbutton : not ( . vertical ) , . linked : not ( . vertical ) > spinbutton : focus : not ( . vertical ) + button , . linked : not ( . vertical ) > spinbutton : focus : not ( . vertical ) + combobox > box > button . combo , . linked : not ( . vertical ) > entry : focus + spinbutton : not ( . vertical ) , . linked : not ( . vertical ) > entry : focus + button , . linked : not ( . vertical ) > entry : focus + combobox > box > button . combo , . linked : not ( . vertical ) > spinbutton : focus : not ( . vertical ) + entry , . linked : not ( . vertical ) > entry : focus + entry { border-left-color : #4a90d9 ; }
. linked : not ( . vertical ) > spinbutton : drop ( active ) : not ( . vertical ) + spinbutton : not ( . vertical ) , . linked : not ( . vertical ) > spinbutton : drop ( active ) : not ( . vertical ) + button , . linked : not ( . vertical ) > spinbutton : drop ( active ) : not ( . vertical ) + combobox > box > button . combo , . linked : not ( . vertical ) > entry : drop ( active ) + spinbutton : not ( . vertical ) , . linked : not ( . vertical ) > entry : drop ( active ) + button , . linked : not ( . vertical ) > entry : drop ( active ) + combobox > box > button . combo , . linked : not ( . vertical ) > spinbutton : drop ( active ) : not ( . vertical ) + entry , . linked : not ( . vertical ) > entry : drop ( active ) + entry { border-left-color : #4e9a06 ; }
. linked . vertical > spinbutton : not ( : disabled ) : not ( . vertical ) + entry : not ( : disabled ) , . linked . vertical > spinbutton : not ( : disabled ) : not ( . vertical ) + spinbutton : not ( : disabled ) : not ( . vertical ) , . linked . vertical > entry : not ( : disabled ) + entry : not ( : disabled ) , . linked . vertical > entry : not ( : disabled ) + spinbutton : not ( : disabled ) : not ( . vertical ) { border-top-color : #e9e9e8 ; }
. linked . vertical > spinbutton : not ( : disabled ) : not ( . vertical ) + entry : not ( : disabled ) : backdrop , . linked . vertical > spinbutton : not ( : disabled ) : not ( . vertical ) + spinbutton : not ( : disabled ) : backdrop : not ( . vertical ) , . linked . vertical > entry : not ( : disabled ) + entry : not ( : disabled ) : backdrop , . linked . vertical > entry : not ( : disabled ) + spinbutton : not ( : disabled ) : backdrop : not ( . vertical ) { border-top-color : #eaeae9 ; }
. linked . vertical > spinbutton : disabled : not ( . vertical ) + spinbutton : disabled : not ( . vertical ) , . linked . vertical > spinbutton : disabled : not ( . vertical ) + entry : disabled , . linked . vertical > entry : disabled + spinbutton : disabled : not ( . vertical ) , . linked . vertical > entry : disabled + entry : disabled { border-top-color : #e9e9e8 ; }
. linked . vertical > spinbutton : not ( . vertical ) + spinbutton : focus : not ( : only-child ) : not ( . vertical ) , . linked . vertical > spinbutton : not ( . vertical ) + entry : focus : not ( : only-child ) , . linked . vertical > entry + spinbutton : focus : not ( : only-child ) : not ( . vertical ) , . linked . vertical > entry + entry : focus : not ( : only-child ) { border-top-color : #4a90d9 ; }
. linked . vertical > spinbutton : not ( . vertical ) + spinbutton : drop ( active ) : not ( : only-child ) : not ( . vertical ) , . linked . vertical > spinbutton : not ( . vertical ) + entry : drop ( active ) : not ( : only-child ) , . linked . vertical > entry + spinbutton : drop ( active ) : not ( : only-child ) : not ( . vertical ) , . linked . vertical > entry + entry : drop ( active ) : not ( : only-child ) { border-top-color : #4e9a06 ; }
. linked . vertical > spinbutton : focus : not ( : only-child ) : not ( . vertical ) + spinbutton : not ( . vertical ) , . linked . vertical > spinbutton : focus : not ( : only-child ) : not ( . vertical ) + entry , . linked . vertical > spinbutton : focus : not ( : only-child ) : not ( . vertical ) + button , . linked . vertical > spinbutton : focus : not ( : only-child ) : not ( . vertical ) + combobox > box > button . combo , . linked . vertical > entry : focus : not ( : only-child ) + spinbutton : not ( . vertical ) , . linked . vertical > entry : focus : not ( : only-child ) + entry , . linked . vertical > entry : focus : not ( : only-child ) + button , . linked . vertical > entry : focus : not ( : only-child ) + combobox > box > button . combo { border-top-color : #4a90d9 ; }
. linked . vertical > spinbutton : drop ( active ) : not ( : only-child ) : not ( . vertical ) + spinbutton : not ( . vertical ) , . linked . vertical > spinbutton : drop ( active ) : not ( : only-child ) : not ( . vertical ) + entry , . linked . vertical > spinbutton : drop ( active ) : not ( : only-child ) : not ( . vertical ) + button , . linked . vertical > spinbutton : drop ( active ) : not ( : only-child ) : not ( . vertical ) + combobox > box > button . combo , . linked . vertical > entry : drop ( active ) : not ( : only-child ) + spinbutton : not ( . vertical ) , . linked . vertical > entry : drop ( active ) : not ( : only-child ) + entry , . linked . vertical > entry : drop ( active ) : not ( : only-child ) + button , . linked . vertical > entry : drop ( active ) : not ( : only-child ) + combobox > box > button . combo { border-top-color : #4e9a06 ; }
treeview entry : focus : dir ( rtl ) , treeview entry : focus : dir ( ltr ) { background-color : #ffffff ; transition-property : color , background ; }
treeview entry . flat , treeview entry { border-radius : 0 ; background-image : none ; background-color : #ffffff ; }
treeview entry . flat : focus , treeview entry : focus { border-color : #4a90d9 ; }
2017-05-26 10:13:43 +00:00
. entry-tag { padding : 5 px ; margin-top : 2 px ; margin-bottom : 2 px ; border-style : none ; color : #ffffff ; background-color : #4a90d9 ; }
2017-05-09 11:39:05 +00:00
2017-05-26 10:13:43 +00:00
: dir ( ltr ) . entry-tag { margin-left : 8 px ; margin-right : -5 px ; }
2017-05-09 11:39:05 +00:00
2017-05-26 10:13:43 +00:00
: dir ( rtl ) . entry-tag { margin-left : -5 px ; margin-right : 8 px ; }
. entry-tag : hover { background-color : #74aae2 ; }
: backdrop . entry-tag { color : #fcfcfc ; background-color : #4a90d9 ; }
. entry-tag . button { background-color : transparent ; color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
: not ( : backdrop ) . entry-tag . button : hover { border : 1 px solid #4a90d9 ; color : #ffffff ; }
: not ( : backdrop ) . entry-tag . button : active { background-color : #4a90d9 ; color : rgba ( 255 , 255 , 255 , 0.7 ) ; }
2017-05-09 11:39:05 +00:00
2017-05-03 15:43:45 +00:00
/*********** Buttons * */
@ keyframes needs_attention { from { background-image : radial-gradient ( farthest - side , #4a90d9 0 % , rgba ( 74 , 144 , 217 , 0 ) 0 % ) ; }
to { background-image : radial-gradient ( farthest - side , #4a90d9 95 % , rgba ( 74 , 144 , 217 , 0 ) ) ; } }
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow , button . titlebutton , button { min-height : 24 px ; min-width : 16 px ; padding : 4 px 8 px ; border : 1 px solid ; border-radius : 3 px ; transition : all 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; background-image : linear-gradient ( to bottom , #e8e8e7 , #dededd 60 % , #cfcfcd ) ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow , button . sidebar-button , button . titlebutton , button . flat { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; transition : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : hover , button . sidebar-button : hover , button . titlebutton : hover , button . flat : hover { transition : all 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; transition-duration : 500 ms ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : hover : active , button . sidebar-button : hover : active , button . titlebutton : hover : active , button . flat : hover : active { transition : all 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : hover , button . titlebutton : hover , button : hover { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px white ; background-image : linear-gradient ( to bottom , #f7f7f7 , #e8e8e7 60 % , #dededd ) ; - gtk-icon-filter : brightness ( 1.2 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : active , button . titlebutton : active , notebook box > header > tabs > arrow : checked , button . titlebutton : checked , button : active , button : checked { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; background-image : image ( #d9d9d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; transition-duration : 50 ms ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop , button . sidebar-button : backdrop , button . titlebutton : backdrop , notebook box > header > tabs > arrow : backdrop , button . titlebutton : backdrop , button : backdrop . flat , button : backdrop { border-color : #c0c0bd ; background-image : image ( #e8e8e7 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; transition : 200 ms ease-out ; - gtk-icon-filter : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop label , button . sidebar-button : backdrop label , button . titlebutton : backdrop label , notebook box > header > tabs > arrow : backdrop , button . sidebar-button : backdrop , button . titlebutton : backdrop , notebook box > header > tabs > arrow : backdrop label , button . titlebutton : backdrop label , notebook box > header > tabs > arrow : backdrop , button . titlebutton : backdrop , button : backdrop . flat label , button : backdrop . flat , button : backdrop label , button : backdrop { color : #8b8e8f ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop : active , button . sidebar-button : backdrop : active , button . titlebutton : backdrop : active , notebook box > header > tabs > arrow : backdrop : checked , button . sidebar-button : backdrop : checked , button . titlebutton : backdrop : checked , notebook box > header > tabs > arrow : backdrop : active , button . titlebutton : backdrop : active , notebook box > header > tabs > arrow : backdrop : checked , button . titlebutton : backdrop : checked , button : backdrop . flat : active , button : backdrop . flat : checked , button : backdrop : active , button : backdrop : checked { border-color : #c0c0bd ; background-image : image ( #d7d7d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop : active label , button . sidebar-button : backdrop : active label , button . titlebutton : backdrop : active label , notebook box > header > tabs > arrow : backdrop : active , button . sidebar-button : backdrop : active , button . titlebutton : backdrop : active , notebook box > header > tabs > arrow : backdrop : checked label , button . sidebar-button : backdrop : checked label , button . titlebutton : backdrop : checked label , notebook box > header > tabs > arrow : backdrop : checked , button . sidebar-button : backdrop : checked , button . titlebutton : backdrop : checked , notebook box > header > tabs > arrow : backdrop : active label , button . titlebutton : backdrop : active label , notebook box > header > tabs > arrow : backdrop : active , button . titlebutton : backdrop : active , notebook box > header > tabs > arrow : backdrop : checked label , button . titlebutton : backdrop : checked label , notebook box > header > tabs > arrow : backdrop : checked , button . titlebutton : backdrop : checked , button : backdrop . flat : active label , button : backdrop . flat : active , button : backdrop . flat : checked label , button : backdrop . flat : checked , button : backdrop : active label , button : backdrop : active , button : backdrop : checked label , button : backdrop : checked { color : #8b8e8f ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop : disabled , button . sidebar-button : backdrop : disabled , button . titlebutton : backdrop : disabled , notebook box > header > tabs > arrow : backdrop : disabled , button . titlebutton : backdrop : disabled , button : backdrop . flat : disabled , button : backdrop : disabled { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop : disabled label , button . sidebar-button : backdrop : disabled label , button . titlebutton : backdrop : disabled label , notebook box > header > tabs > arrow : backdrop : disabled , button . sidebar-button : backdrop : disabled , button . titlebutton : backdrop : disabled , notebook box > header > tabs > arrow : backdrop : disabled label , button . titlebutton : backdrop : disabled label , notebook box > header > tabs > arrow : backdrop : disabled , button . titlebutton : backdrop : disabled , button : backdrop . flat : disabled label , button : backdrop . flat : disabled , button : backdrop : disabled label , button : backdrop : disabled { color : #c3c3c0 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop : disabled : active , button . sidebar-button : backdrop : disabled : active , button . titlebutton : backdrop : disabled : active , notebook box > header > tabs > arrow : backdrop : disabled : checked , button . sidebar-button : backdrop : disabled : checked , button . titlebutton : backdrop : disabled : checked , notebook box > header > tabs > arrow : backdrop : disabled : active , button . titlebutton : backdrop : disabled : active , notebook box > header > tabs > arrow : backdrop : disabled : checked , button . titlebutton : backdrop : disabled : checked , button : backdrop . flat : disabled : active , button : backdrop . flat : disabled : checked , button : backdrop : disabled : active , button : backdrop : disabled : checked { border-color : #c0c0bd ; background-image : image ( #d7d7d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop : disabled : active label , button . sidebar-button : backdrop : disabled : active label , button . titlebutton : backdrop : disabled : active label , notebook box > header > tabs > arrow : backdrop : disabled : checked label , button . sidebar-button : backdrop : disabled : checked label , button . titlebutton : backdrop : disabled : checked label , notebook box > header > tabs > arrow : backdrop : disabled : active label , button . titlebutton : backdrop : disabled : active label , notebook box > header > tabs > arrow : backdrop : disabled : checked label , button . titlebutton : backdrop : disabled : checked label , button : backdrop . flat : disabled : active label , button : backdrop . flat : disabled : checked label , button : backdrop : disabled : active label , button : backdrop : disabled : checked label { color : #c3c3c0 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : backdrop , button . sidebar-button : backdrop , button . titlebutton : backdrop , notebook box > header > tabs > arrow : disabled , button . sidebar-button : disabled , button . titlebutton : disabled , notebook box > header > tabs > arrow : backdrop : disabled , button . sidebar-button : backdrop : disabled , button . titlebutton : backdrop : disabled , button . flat : backdrop , button . flat : disabled , button . flat : backdrop : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : disabled , button . titlebutton : disabled , button : disabled { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : disabled label , button . titlebutton : disabled label , notebook box > header > tabs > arrow : disabled , button . titlebutton : disabled , button : disabled label , button : disabled { color : #8b8e8f ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : disabled : active , button . titlebutton : disabled : active , notebook box > header > tabs > arrow : disabled : checked , button . titlebutton : disabled : checked , button : disabled : active , button : disabled : checked { border-color : #b6b6b3 ; background-image : image ( #d7d7d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : disabled : active label , button . titlebutton : disabled : active label , notebook box > header > tabs > arrow : disabled : active , button . titlebutton : disabled : active , notebook box > header > tabs > arrow : disabled : checked label , button . titlebutton : disabled : checked label , notebook box > header > tabs > arrow : disabled : checked , button . titlebutton : disabled : checked , button : disabled : active label , button : disabled : active , button : disabled : checked label , button : disabled : checked { color : #8b8e8f ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow . image-button , button . image-button . titlebutton , button . image-button { min-width : 24 px ; padding-left : 4 px ; padding-right : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow . text-button , button . text-button . titlebutton , button . text-button { padding-left : 16 px ; padding-right : 16 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow . text-button . image-button , button . text-button . image-button . titlebutton , button . text-button . image-button { padding-left : 8 px ; padding-right : 8 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow . text-button . image-button label , button . text-button . image-button . titlebutton label , button . text-button . image-button label { padding-left : 8 px ; padding-right : 8 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
combobox : drop ( active ) button . combo , notebook box > header > tabs > arrow : drop ( active ) , button . titlebutton : drop ( active ) , button : drop ( active ) { color : #4e9a06 ; border-color : #4e9a06 ; box-shadow : inset 0 0 0 1 px #4e9a06 ; }
2017-05-03 15:43:45 +00:00
row : selected button { border-color : #184472 ; }
row : selected button . sidebar-button : not ( : active ) : not ( : checked ) : not ( : hover ) : not ( disabled ) , row : selected button . flat : not ( : active ) : not ( : checked ) : not ( : hover ) : not ( disabled ) { color : #ffffff ; border-color : transparent ; }
row : selected button . sidebar-button : not ( : active ) : not ( : checked ) : not ( : hover ) : not ( disabled ) : backdrop , row : selected button . flat : not ( : active ) : not ( : checked ) : not ( : hover ) : not ( disabled ) : backdrop { color : #fcfcfc ; }
button . osd { min-width : 24 px ; min-height : 32 px ; color : #eeeeec ; border-radius : 5 px ; color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; border : none ; box-shadow : none ; }
button . osd . image-button { min-width : 32 px ; }
button . osd : hover { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 57 , 63 , 65 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; border : none ; box-shadow : none ; }
button . osd : active , button . osd : checked { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 0 , 0 , 0 , 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 : none ; box-shadow : none ; }
button . osd : disabled : backdrop , button . osd : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; border : none ; }
button . osd : backdrop { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; border : none ; }
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button , . csd popover > contents . background . magnifier button , popover > contents . background . touch-selection button , popover > contents . background . magnifier button , . app-notification button , . app-notification . frame button , . osd button { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button : hover , . csd popover > contents . background . magnifier button : hover , popover > contents . background . touch-selection button : hover , popover > contents . background . magnifier button : hover , . app-notification button : hover , . osd button : hover { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 57 , 63 , 65 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button : active : backdrop , . csd popover > contents . background . magnifier button : active : backdrop , popover > contents . background . touch-selection button : active : backdrop , popover > contents . background . magnifier button : active : backdrop , . app-notification button : active : backdrop , . csd popover > contents . background . touch-selection button : active , . csd popover > contents . background . magnifier button : active , popover > contents . background . touch-selection button : active , popover > contents . background . magnifier button : active , . app-notification button : active , . csd popover > contents . background . touch-selection button : checked : backdrop , . csd popover > contents . background . magnifier button : checked : backdrop , popover > contents . background . touch-selection button : checked : backdrop , popover > contents . background . magnifier button : checked : backdrop , . app-notification button : checked : backdrop , . csd popover > contents . background . touch-selection button : checked , . csd popover > contents . background . magnifier button : checked , popover > contents . background . touch-selection button : checked , popover > contents . background . magnifier button : checked , . app-notification button : checked , . osd button : active : backdrop , . osd button : active , . osd button : checked : backdrop , . osd button : checked { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 0 , 0 , 0 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button : disabled : backdrop , . csd popover > contents . background . magnifier button : disabled : backdrop , popover > contents . background . touch-selection button : disabled : backdrop , popover > contents . background . magnifier button : disabled : backdrop , . app-notification button : disabled : backdrop , . csd popover > contents . background . touch-selection button : disabled , . csd popover > contents . background . magnifier button : disabled , popover > contents . background . touch-selection button : disabled , popover > contents . background . magnifier button : disabled , . app-notification button : disabled , . osd button : disabled : backdrop , . osd button : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button : backdrop , . csd popover > contents . background . magnifier button : backdrop , popover > contents . background . touch-selection button : backdrop , popover > contents . background . magnifier button : backdrop , . app-notification button : backdrop , . osd button : backdrop { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button . flat , . csd popover > contents . background . magnifier button . flat , popover > contents . background . touch-selection button . flat , popover > contents . background . magnifier button . flat , . app-notification button . flat , . osd button . flat { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : none ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button . flat : hover , . csd popover > contents . background . magnifier button . flat : hover , popover > contents . background . touch-selection button . flat : hover , popover > contents . background . magnifier button . flat : hover , . app-notification button . flat : hover , . osd button . flat : hover { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 57 , 63 , 65 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button . flat : disabled , . csd popover > contents . background . magnifier button . flat : disabled , popover > contents . background . touch-selection button . flat : disabled , popover > contents . background . magnifier button . flat : disabled , . app-notification button . flat : disabled , . osd button . flat : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; background-image : none ; border-color : transparent ; box-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button . flat : backdrop , . csd popover > contents . background . magnifier button . flat : backdrop , popover > contents . background . touch-selection button . flat : backdrop , popover > contents . background . magnifier button . flat : backdrop , . app-notification button . flat : backdrop , . osd button . flat : backdrop { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection button . flat : active , . csd popover > contents . background . magnifier button . flat : active , popover > contents . background . touch-selection button . flat : active , popover > contents . background . magnifier button . flat : active , . app-notification button . flat : active , . csd popover > contents . background . touch-selection button . flat : checked , . csd popover > contents . background . magnifier button . flat : checked , popover > contents . background . touch-selection button . flat : checked , popover > contents . background . magnifier button . flat : checked , . app-notification button . flat : checked , . osd button . flat : active , . osd button . flat : checked { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 0 , 0 , 0 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
2017-05-03 15:43:45 +00:00
button . suggested-action { color : white ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; border-bottom-color : #184472 ; background-image : linear-gradient ( to bottom , #4a90d9 , #3986d5 60 % , #2a76c6 ) ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; }
. selection-mode button . titlebutton , button . suggested-action . flat { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #4a90d9 ; }
button . suggested-action : hover { color : white ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; border-bottom-color : #184472 ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.495529 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.495529 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; background-image : linear-gradient ( to bottom , #63a0de , #4a90d9 60 % , #3986d5 ) ; }
button . suggested-action : active , button . suggested-action : checked { color : white ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; background-image : image ( #3180d4 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
. selection-mode button . titlebutton : backdrop , button . suggested-action : backdrop , button . suggested-action . flat : backdrop { border-color : #4a90d9 ; background-image : image ( #4a90d9 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. selection-mode button . titlebutton : backdrop label , . selection-mode button . titlebutton : backdrop , button . suggested-action : backdrop label , button . suggested-action : backdrop , button . suggested-action . flat : backdrop label , button . suggested-action . flat : backdrop { color : #dbe9f7 ; }
. selection-mode button . titlebutton : backdrop : active , . selection-mode button . titlebutton : backdrop : checked , button . suggested-action : backdrop : active , button . suggested-action : backdrop : checked , button . suggested-action . flat : backdrop : active , button . suggested-action . flat : backdrop : checked { border-color : #438cd8 ; background-image : image ( #438cd8 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. selection-mode button . titlebutton : backdrop : active label , . selection-mode button . titlebutton : backdrop : active , . selection-mode button . titlebutton : backdrop : checked label , . selection-mode button . titlebutton : backdrop : checked , button . suggested-action : backdrop : active label , button . suggested-action : backdrop : active , button . suggested-action : backdrop : checked label , button . suggested-action : backdrop : checked , button . suggested-action . flat : backdrop : active label , button . suggested-action . flat : backdrop : active , button . suggested-action . flat : backdrop : checked label , button . suggested-action . flat : backdrop : checked { color : #d9e8f7 ; }
. selection-mode button . titlebutton : backdrop : disabled , button . suggested-action : backdrop : disabled , button . suggested-action . flat : backdrop : disabled { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. selection-mode button . titlebutton : backdrop : disabled label , . selection-mode button . titlebutton : backdrop : disabled , button . suggested-action : backdrop : disabled label , button . suggested-action : backdrop : disabled , button . suggested-action . flat : backdrop : disabled label , button . suggested-action . flat : backdrop : disabled { color : #c3c3c0 ; }
. selection-mode button . titlebutton : backdrop : disabled : active , . selection-mode button . titlebutton : backdrop : disabled : checked , button . suggested-action : backdrop : disabled : active , button . suggested-action : backdrop : disabled : checked , button . suggested-action . flat : backdrop : disabled : active , button . suggested-action . flat : backdrop : disabled : checked { border-color : #438cd8 ; background-image : image ( #438cd8 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. selection-mode button . titlebutton : backdrop : disabled : active label , . selection-mode button . titlebutton : backdrop : disabled : checked label , button . suggested-action : backdrop : disabled : active label , button . suggested-action : backdrop : disabled : checked label , button . suggested-action . flat : backdrop : disabled : active label , button . suggested-action . flat : backdrop : disabled : checked label { color : #85b4e6 ; }
. selection-mode button . titlebutton : backdrop , . selection-mode button . titlebutton : disabled , . selection-mode button . titlebutton : backdrop : disabled , button . suggested-action . flat : backdrop , button . suggested-action . flat : disabled , button . suggested-action . flat : backdrop : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : rgba ( 74 , 144 , 217 , 0.8 ) ; }
button . suggested-action : disabled { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . suggested-action : disabled label , button . suggested-action : disabled { color : #8b8e8f ; }
button . suggested-action : disabled : active , button . suggested-action : disabled : checked { border-color : #215d9c ; background-image : image ( #438cd8 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . suggested-action : disabled : active label , button . suggested-action : disabled : active , button . suggested-action : disabled : checked label , button . suggested-action : disabled : checked { color : #b4d1ef ; }
. osd button . suggested-action { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 74 , 144 , 217 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd button . suggested-action : hover { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 74 , 144 , 217 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd button . suggested-action : active : backdrop , . osd button . suggested-action : active , . osd button . suggested-action : checked : backdrop , . osd button . suggested-action : checked { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( #4a90d9 ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd button . suggested-action : disabled : backdrop , . osd button . suggested-action : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
. osd button . suggested-action : backdrop { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 74 , 144 , 217 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
button . destructive-action { color : white ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #a60c0c ; border-bottom-color : #760909 ; background-image : linear-gradient ( to bottom , #ef2929 , #ee1616 60 % , #d51010 ) ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.560784 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.560784 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; }
button . destructive-action . flat { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #ef2929 ; }
button . destructive-action : hover { color : white ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #a60c0c ; border-bottom-color : #760909 ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.512784 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.512784 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; background-image : linear-gradient ( to bottom , #f14545 , #ef2929 60 % , #ee1616 ) ; }
button . destructive-action : active , button . destructive-action : checked { color : white ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #a60c0c ; background-image : image ( #e81111 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
button . destructive-action : backdrop , button . destructive-action . flat : backdrop { border-color : #ef2929 ; background-image : image ( #ef2929 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . destructive-action : backdrop label , button . destructive-action : backdrop , button . destructive-action . flat : backdrop label , button . destructive-action . flat : backdrop { color : #fcd4d4 ; }
button . destructive-action : backdrop : active , button . destructive-action : backdrop : checked , button . destructive-action . flat : backdrop : active , button . destructive-action . flat : backdrop : checked { border-color : #ee2323 ; background-image : image ( #ee2323 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . destructive-action : backdrop : active label , button . destructive-action : backdrop : active , button . destructive-action : backdrop : checked label , button . destructive-action : backdrop : checked , button . destructive-action . flat : backdrop : active label , button . destructive-action . flat : backdrop : active , button . destructive-action . flat : backdrop : checked label , button . destructive-action . flat : backdrop : checked { color : #fcd3d3 ; }
button . destructive-action : backdrop : disabled , button . destructive-action . flat : backdrop : disabled { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . destructive-action : backdrop : disabled label , button . destructive-action : backdrop : disabled , button . destructive-action . flat : backdrop : disabled label , button . destructive-action . flat : backdrop : disabled { color : #c3c3c0 ; }
button . destructive-action : backdrop : disabled : active , button . destructive-action : backdrop : disabled : checked , button . destructive-action . flat : backdrop : disabled : active , button . destructive-action . flat : backdrop : disabled : checked { border-color : #ee2323 ; background-image : image ( #ee2323 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . destructive-action : backdrop : disabled : active label , button . destructive-action : backdrop : disabled : checked label , button . destructive-action . flat : backdrop : disabled : active label , button . destructive-action . flat : backdrop : disabled : checked label { color : #f47070 ; }
button . destructive-action . flat : backdrop , button . destructive-action . flat : disabled , button . destructive-action . flat : backdrop : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : rgba ( 239 , 41 , 41 , 0.8 ) ; }
button . destructive-action : disabled { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . destructive-action : disabled label , button . destructive-action : disabled { color : #8b8e8f ; }
button . destructive-action : disabled : active , button . destructive-action : disabled : checked { border-color : #a60c0c ; background-image : image ( #ee2323 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
button . destructive-action : disabled : active label , button . destructive-action : disabled : active , button . destructive-action : disabled : checked label , button . destructive-action : disabled : checked { color : #f8a7a7 ; }
. osd button . destructive-action { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 239 , 41 , 41 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd button . destructive-action : hover { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 239 , 41 , 41 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd button . destructive-action : active : backdrop , . osd button . destructive-action : active , . osd button . destructive-action : checked : backdrop , . osd button . destructive-action : checked { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( #ef2929 ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd button . destructive-action : disabled : backdrop , . osd button . destructive-action : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
. osd button . destructive-action : backdrop { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 239 , 41 , 41 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
. stack-switcher > button { outline-offset : -3 px ; }
. stack-switcher > button > label { padding-left : 6 px ; padding-right : 6 px ; }
. stack-switcher > button > image { padding-left : 6 px ; padding-right : 6 px ; padding-top : 3 px ; padding-bottom : 3 px ; }
. stack-switcher > button . text-button { padding-left : 10 px ; padding-right : 10 px ; }
. stack-switcher > button . image-button { padding-left : 2 px ; padding-right : 2 px ; }
. stack-switcher > button . needs-attention : active > label , . stack-switcher > button . needs-attention : active > image , . stack-switcher > button . needs-attention : checked > label , . stack-switcher > button . needs-attention : checked > image { animation : none ; background-image : none ; }
button . font separator , button . file separator { background-color : transparent ; }
button . font > box > box > label { font-weight : bold ; }
. inline-toolbar button , . inline-toolbar button : backdrop { border-radius : 2 px ; border-width : 1 px ; }
. primary-toolbar button { - gtk-icon-shadow : none ; }
button . circular { border-radius : 9999 px ; - gtk-outline-radius : 9999 px ; background-origin : padding-box , border-box ; background-clip : padding-box , border-box ; }
button . circular label { padding : 0 ; }
button . circular : not ( . flat ) : not ( : checked ) : not ( : active ) : not ( : disabled ) : not ( : backdrop ) { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; background-image : linear-gradient ( to bottom , #e8e8e7 , #dededd 60 % , #cfcfcd ) ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; background-image : linear-gradient ( to bottom , #e8e8e7 , #dededd 60 % , #cfcfcd ) , linear-gradient ( to top , #91918c 25 % , #b6b6b3 50 % ) ; border-color : transparent ; }
button . circular : hover : not ( : checked ) : not ( : active ) : not ( : disabled ) : not ( : backdrop ) { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px white ; background-image : linear-gradient ( to bottom , #f7f7f7 , #e8e8e7 60 % , #dededd ) ; background-image : linear-gradient ( to bottom , #f7f7f7 , #e8e8e7 60 % , #dededd ) , linear-gradient ( to top , #91918c 25 % , #b6b6b3 50 % ) ; border-color : transparent ; }
. stack-switcher > button . needs-attention > label , . stack-switcher > button . needs-attention > image , stacksidebar row . needs-attention > label { animation : needs_attention 150 ms ease-in ; background-image : radial-gradient ( farthest - side , #4a90d9 96 % , rgba ( 74 , 144 , 217 , 0 ) ) , radial-gradient ( farthest - side , rgba ( 255 , 255 , 255 , 0.769231 ) 95 % , rgba ( 255 , 255 , 255 , 0 ) ) ; background-size : 6 px 6 px , 6 px 6 px ; background-repeat : no-repeat ; background-position : right 3 px , right 4 px ; }
. stack-switcher > button . needs-attention > label : backdrop , . stack-switcher > button . needs-attention > image : backdrop , stacksidebar row . needs-attention > label : backdrop { background-size : 6 px 6 px , 0 0 ; }
. stack-switcher > button . needs-attention > label : dir ( rtl ) , . stack-switcher > button . needs-attention > image : dir ( rtl ) , stacksidebar row . needs-attention > label : dir ( rtl ) { background-position : left 3 px , left 4 px ; }
. inline-toolbar toolbutton > button { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; background-image : linear-gradient ( to bottom , #e8e8e7 , #dededd 60 % , #cfcfcd ) ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; }
. inline-toolbar toolbutton > button : hover { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px white ; background-image : linear-gradient ( to bottom , #f7f7f7 , #e8e8e7 60 % , #dededd ) ; }
. inline-toolbar toolbutton > button : active , . inline-toolbar toolbutton > button : checked { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; background-image : image ( #d9d9d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
. inline-toolbar toolbutton > button : disabled { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. inline-toolbar toolbutton > button : disabled label , . inline-toolbar toolbutton > button : disabled { color : #8b8e8f ; }
. inline-toolbar toolbutton > button : disabled : active , . inline-toolbar toolbutton > button : disabled : checked { border-color : #b6b6b3 ; background-image : image ( #d7d7d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. inline-toolbar toolbutton > button : disabled : active label , . inline-toolbar toolbutton > button : disabled : active , . inline-toolbar toolbutton > button : disabled : checked label , . inline-toolbar toolbutton > button : disabled : checked { color : #8b8e8f ; }
. inline-toolbar toolbutton > button : backdrop { border-color : #c0c0bd ; background-image : image ( #e8e8e7 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. inline-toolbar toolbutton > button : backdrop label , . inline-toolbar toolbutton > button : backdrop { color : #8b8e8f ; }
. inline-toolbar toolbutton > button : backdrop : active , . inline-toolbar toolbutton > button : backdrop : checked { border-color : #c0c0bd ; background-image : image ( #d7d7d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. inline-toolbar toolbutton > button : backdrop : active label , . inline-toolbar toolbutton > button : backdrop : active , . inline-toolbar toolbutton > button : backdrop : checked label , . inline-toolbar toolbutton > button : backdrop : checked { color : #8b8e8f ; }
. inline-toolbar toolbutton > button : backdrop : disabled { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. inline-toolbar toolbutton > button : backdrop : disabled label , . inline-toolbar toolbutton > button : backdrop : disabled { color : #c3c3c0 ; }
. inline-toolbar toolbutton > button : backdrop : disabled : active , . inline-toolbar toolbutton > button : backdrop : disabled : checked { border-color : #c0c0bd ; background-image : image ( #d7d7d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. inline-toolbar toolbutton > button : backdrop : disabled : active label , . inline-toolbar toolbutton > button : backdrop : disabled : checked label { color : #c3c3c0 ; }
themes: Fix swapped borders on RTL PathBar buttons
.linked assumes the container is a GtkBox, which is documented as never
flipping children in RTL, so :first-child is always the left child, etc.
GtkBox does that by reordering its CSS nodes when the direction changes.
But most widgets don’t do that, so :first|last-child are 1st/last ADDED
and swap sides in RTL. GtkPathBar is so, and ignoring that in our themes
meant that in RTL, its left/right buttons got each other’s borders. Yuk!
This patch adds the groundwork for supporting widgets like that, via the
%linked_flippable placeholder, and applies that to override buttons in
filechooser .path-bar.linked > button
so that the correct borders get applied to those buttons when using RTL.
Note that I select only PathBars within a FileChooser because we also
have NautilusPathBar, which also uses widget.path-bar – but *does* flip
its nodes for RTL already, so letting that get affected broke it again!
https://bugzilla.gnome.org/show_bug.cgi?id=772817
2018-04-22 20:45:18 +00:00
toolbar . inline-toolbar toolbutton > button . flat , toolbar . inline-toolbar toolbutton : backdrop > button . flat , . linked : not ( . vertical ) > spinbutton : not ( . vertical ) , . linked : not ( . vertical ) > entry , . inline-toolbar button , . inline-toolbar button : backdrop , . linked > button , . linked > button : hover , . linked > button : active , . linked > button : checked , . linked > button : backdrop , filechooser . path-bar . linked > button , . linked > combobox > box > button . combo : dir ( ltr ) , . linked > combobox > box > button . combo : dir ( rtl ) { border-radius : 0 ; border-right-style : none ; }
2017-05-03 15:43:45 +00:00
themes: Fix swapped borders on RTL PathBar buttons
.linked assumes the container is a GtkBox, which is documented as never
flipping children in RTL, so :first-child is always the left child, etc.
GtkBox does that by reordering its CSS nodes when the direction changes.
But most widgets don’t do that, so :first|last-child are 1st/last ADDED
and swap sides in RTL. GtkPathBar is so, and ignoring that in our themes
meant that in RTL, its left/right buttons got each other’s borders. Yuk!
This patch adds the groundwork for supporting widgets like that, via the
%linked_flippable placeholder, and applies that to override buttons in
filechooser .path-bar.linked > button
so that the correct borders get applied to those buttons when using RTL.
Note that I select only PathBars within a FileChooser because we also
have NautilusPathBar, which also uses widget.path-bar – but *does* flip
its nodes for RTL already, so letting that get affected broke it again!
https://bugzilla.gnome.org/show_bug.cgi?id=772817
2018-04-22 20:45:18 +00:00
. linked : not ( . vertical ) > spinbutton : first-child : not ( . vertical ) , . linked : not ( . vertical ) > entry : first-child , . inline-toolbar button : first-child , . linked > button : first-child , toolbar . inline-toolbar toolbutton : first-child > button . flat , toolbar . inline-toolbar toolbutton : backdrop : first-child > button . flat , combobox . linked button : nth-child ( 2 ) : dir ( rtl ) , . linked : not ( . vertical ) > combobox : first-child > box > button . combo , filechooser . path-bar . linked > button : dir ( ltr ) : first-child , filechooser . path-bar . linked > button : dir ( rtl ) : last-child { border-top-left-radius : 3 px ; border-bottom-left-radius : 3 px ; border-top-right-radius : 0 ; border-bottom-right-radius : 0 ; border-right-style : none ; }
2017-05-03 15:43:45 +00:00
themes: Fix swapped borders on RTL PathBar buttons
.linked assumes the container is a GtkBox, which is documented as never
flipping children in RTL, so :first-child is always the left child, etc.
GtkBox does that by reordering its CSS nodes when the direction changes.
But most widgets don’t do that, so :first|last-child are 1st/last ADDED
and swap sides in RTL. GtkPathBar is so, and ignoring that in our themes
meant that in RTL, its left/right buttons got each other’s borders. Yuk!
This patch adds the groundwork for supporting widgets like that, via the
%linked_flippable placeholder, and applies that to override buttons in
filechooser .path-bar.linked > button
so that the correct borders get applied to those buttons when using RTL.
Note that I select only PathBars within a FileChooser because we also
have NautilusPathBar, which also uses widget.path-bar – but *does* flip
its nodes for RTL already, so letting that get affected broke it again!
https://bugzilla.gnome.org/show_bug.cgi?id=772817
2018-04-22 20:45:18 +00:00
. linked : not ( . vertical ) > spinbutton : last-child : not ( . vertical ) , . linked : not ( . vertical ) > entry : last-child , . inline-toolbar button : last-child , . linked > button : last-child , toolbar . inline-toolbar toolbutton : last-child > button . flat , toolbar . inline-toolbar toolbutton : backdrop : last-child > button . flat , combobox . linked button : nth-child ( 2 ) : dir ( ltr ) , . linked : not ( . vertical ) > combobox : last-child > box > button . combo , filechooser . path-bar . linked > button : dir ( ltr ) : last-child , filechooser . path-bar . linked > button : dir ( rtl ) : first-child { border-top-left-radius : 0 ; border-bottom-left-radius : 0 ; border-top-right-radius : 3 px ; border-bottom-right-radius : 3 px ; border-right-style : solid ; }
2017-05-03 15:43:45 +00:00
. linked : not ( . vertical ) > spinbutton : only-child : not ( . vertical ) , . linked : not ( . vertical ) > entry : only-child , . inline-toolbar button : only-child , . linked > button : only-child , toolbar . inline-toolbar toolbutton : only-child > button . flat , toolbar . inline-toolbar toolbutton : backdrop : only-child > button . flat , . linked : not ( . vertical ) > combobox : only-child > box > button . combo { border-radius : 3 px ; border-style : solid ; }
themes: Fix swapped borders on RTL PathBar buttons
.linked assumes the container is a GtkBox, which is documented as never
flipping children in RTL, so :first-child is always the left child, etc.
GtkBox does that by reordering its CSS nodes when the direction changes.
But most widgets don’t do that, so :first|last-child are 1st/last ADDED
and swap sides in RTL. GtkPathBar is so, and ignoring that in our themes
meant that in RTL, its left/right buttons got each other’s borders. Yuk!
This patch adds the groundwork for supporting widgets like that, via the
%linked_flippable placeholder, and applies that to override buttons in
filechooser .path-bar.linked > button
so that the correct borders get applied to those buttons when using RTL.
Note that I select only PathBars within a FileChooser because we also
have NautilusPathBar, which also uses widget.path-bar – but *does* flip
its nodes for RTL already, so letting that get affected broke it again!
https://bugzilla.gnome.org/show_bug.cgi?id=772817
2018-04-22 20:45:18 +00:00
filechooser . path-bar . linked > button : only-child { border-radius : 3 px ; border-style : solid ; }
2017-05-03 15:43:45 +00:00
. linked . vertical > spinbutton : not ( . vertical ) , . linked . vertical > entry , . linked . vertical > button , . linked . vertical > button : hover , . linked . vertical > button : active , . linked . vertical > button : checked , . linked . vertical > button : backdrop , . linked . vertical > combobox > box > button . combo { border-style : solid solid none solid ; border-radius : 0 ; }
. linked . vertical > spinbutton : first-child : not ( . vertical ) , . linked . vertical > entry : first-child , . linked . vertical > button : first-child , . linked . vertical > combobox : first-child > box > button . combo { border-top-left-radius : 3 px ; border-top-right-radius : 3 px ; }
. linked . vertical > spinbutton : last-child : not ( . vertical ) , . linked . vertical > entry : last-child , . linked . vertical > button : last-child , . linked . vertical > combobox : last-child > box > button . combo { border-bottom-left-radius : 3 px ; border-bottom-right-radius : 3 px ; border-style : solid ; }
. linked . vertical > spinbutton : only-child : not ( . vertical ) , . linked . vertical > entry : only-child , . linked . vertical > button : only-child , . linked . vertical > combobox : only-child > box > button . combo { border-radius : 3 px ; border-style : solid ; }
modelbutton . flat , . menuitem . button . flat , modelbutton . flat : backdrop , modelbutton . flat : backdrop : hover , . menuitem . button . flat : backdrop , . menuitem . button . flat : backdrop : hover , button : link , button : visited , button : link : hover , button : link : active , button : link : checked , button : visited : hover , button : visited : active , button : visited : checked , calendar . button , . scale-popup button : hover , . scale-popup button : backdrop : hover , . scale-popup button : backdrop : disabled , . scale-popup button : backdrop { background-color : transparent ; background-image : none ; border-color : transparent ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) , 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
2014-06-13 18:42:38 +00:00
/* menu buttons */
2017-05-03 15:43:45 +00:00
modelbutton . flat , . menuitem . button . flat { min-height : 26 px ; padding-left : 5 px ; padding-right : 5 px ; border-radius : 3 px ; outline-offset : -2 px ; }
modelbutton . flat : hover , . menuitem . button . flat : hover { background-color : #f4f4f4 ; }
2017-07-14 08:30:32 +00:00
modelbutton . flat arrow { background : none ; min-width : 16 px ; min-height : 16 px ; }
2017-05-03 15:43:45 +00:00
modelbutton . flat arrow : hover { background : none ; }
modelbutton . flat arrow . left { - gtk-icon-source : - gtk-icontheme ( "pan-start-symbolic" ) ; }
modelbutton . flat arrow . right { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic" ) ; }
button . color { padding : 4 px ; }
button . color colorswatch : only-child { box-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; }
button . color colorswatch : only-child , button . color colorswatch : only-child overlay { border-radius : 0 ; }
. osd button . color colorswatch : only-child { box-shadow : none ; }
. osd button . color : disabled colorswatch : only-child , . osd button . color : backdrop colorswatch : only-child , . osd button . color : active colorswatch : only-child , . osd button . color : checked colorswatch : only-child , button . color : disabled colorswatch : only-child , button . color : backdrop colorswatch : only-child , button . color : active colorswatch : only-child , button . color : checked colorswatch : only-child { box-shadow : none ; }
/********* Links * */
button : link > label , button : visited > label , * : link , button : link , button : visited { color : #2a76c6 ; }
button : link > label : visited , button : visited > label : visited , * : link : visited , button : visited { color : #215d9c ; }
* : selected button : link > label : visited , * : selected button : visited > label : visited , * : selected * : link : visited , * : selected button : visited : link , * : selected button : visited { color : #b7d3f0 ; }
button : link > label : hover , button : visited > label : hover , * : link : hover , button : hover : link , button : hover : visited { color : #4a90d9 ; }
* : selected button : link > label : hover , * : selected button : visited > label : hover , * : selected * : link : hover , * : selected button : hover : link , * : selected button : hover : visited { color : #edf4fb ; }
button : link > label : active , button : visited > label : active , * : link : active , button : active : link , button : active : visited { color : #2a76c6 ; }
* : selected button : link > label : active , * : selected button : visited > label : active , * : selected * : link : active , * : selected button : active : link , * : selected button : active : visited { color : #dbe9f7 ; }
button : link > label : backdrop : backdrop : hover , button : visited > label : backdrop : backdrop : hover , button : link > label : backdrop : backdrop : hover : selected , button : visited > label : backdrop : backdrop : hover : selected , button : link > label : backdrop , button : visited > label : backdrop , * : link : backdrop : backdrop : hover , button : backdrop : backdrop : hover : link , button : backdrop : backdrop : hover : visited , * : link : backdrop : backdrop : hover : selected , button : backdrop : backdrop : hover : selected : link , button : backdrop : backdrop : hover : selected : visited , . selection-mode . titlebar : not ( headerbar ) . subtitle : backdrop : backdrop : hover : link , headerbar . selection-mode . subtitle : backdrop : backdrop : hover : link , * : link : backdrop , button : backdrop : link , button : backdrop : visited { color : #4a90d9 ; }
infobar . info * : link , infobar . info button : link , infobar . info button : visited , infobar . question * : link , infobar . question button : link , infobar . question button : visited , infobar . warning * : link , infobar . warning button : link , infobar . warning button : visited , infobar . error * : link , infobar . error button : link , infobar . error button : visited , button : link > label : selected , button : visited > label : selected , * : selected button : link > label , * : selected button : visited > label , * : link : selected , button : selected : link , button : selected : visited , . selection-mode . titlebar : not ( headerbar ) . subtitle : link , headerbar . selection-mode . subtitle : link , * : selected * : link , * : selected button : link , * : selected button : visited { color : #dbe9f7 ; }
button : link , button : visited { text-shadow : none ; }
button : link : hover , button : link : active , button : link : checked , button : visited : hover , button : visited : active , button : visited : checked { text-shadow : none ; }
button : link > label , button : visited > label { text-decoration-line : underline ; }
/***************** GtkSpinButton * */
spinbutton : not ( . vertical ) { padding : 0 ; }
spinbutton : not ( . vertical ) entry { min-width : 28 px ; margin : 0 ; background : none ; background-color : transparent ; border : none ; border-radius : 0 ; box-shadow : none ; }
spinbutton : not ( . vertical ) entry : backdrop : disabled { background-color : transparent ; }
spinbutton : not ( . vertical ) button { min-height : 16 px ; margin : 0 ; padding-bottom : 0 ; padding-top : 0 ; color : #43484a ; background-image : none ; border-style : none none none solid ; border-color : rgba ( 182 , 182 , 179 , 0.3 ) ; border-radius : 0 ; box-shadow : none ; }
spinbutton : not ( . vertical ) button : dir ( rtl ) { border-style : none solid none none ; }
spinbutton : not ( . vertical ) button : hover { color : #2e3436 ; background-color : rgba ( 46 , 52 , 54 , 0.05 ) ; }
spinbutton : not ( . vertical ) button : disabled { color : rgba ( 139 , 142 , 143 , 0.3 ) ; background-color : transparent ; }
spinbutton : not ( . vertical ) button : active { background-color : rgba ( 0 , 0 , 0 , 0.1 ) ; box-shadow : inset 0 2 px 3 px -1 px rgba ( 0 , 0 , 0 , 0.2 ) ; }
spinbutton : not ( . vertical ) button : backdrop { color : #96999a ; background-color : transparent ; border-color : rgba ( 192 , 192 , 189 , 0.3 ) ; transition : 200 ms ease-out ; }
spinbutton : not ( . vertical ) button : backdrop : disabled { color : rgba ( 195 , 195 , 192 , 0.3 ) ; background-color : transparent ; border-style : none none none solid ; }
spinbutton : not ( . vertical ) button : backdrop : disabled : dir ( rtl ) { border-style : none solid none none ; }
spinbutton : not ( . vertical ) button : dir ( ltr ) : last-child { border-radius : 0 3 px 3 px 0 ; }
spinbutton : not ( . vertical ) button : dir ( rtl ) : first-child { border-radius : 3 px 0 0 3 px ; }
. osd spinbutton : not ( . vertical ) button { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #eeeeec ; border-style : none none none solid ; border-color : rgba ( 0 , 0 , 0 , 0.4 ) ; border-radius : 0 ; box-shadow : none ; - gtk-icon-shadow : 0 1 px black ; }
. osd spinbutton : not ( . vertical ) button : dir ( rtl ) { border-style : none solid none none ; }
. osd spinbutton : not ( . vertical ) button : hover { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.5 ) ; background-color : rgba ( 238 , 238 , 236 , 0.1 ) ; - gtk-icon-shadow : 0 1 px black ; box-shadow : none ; }
. osd spinbutton : not ( . vertical ) button : backdrop { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.5 ) ; - gtk-icon-shadow : none ; box-shadow : none ; }
. osd spinbutton : not ( . vertical ) button : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.5 ) ; - gtk-icon-shadow : none ; box-shadow : none ; }
. osd spinbutton : not ( . vertical ) button : dir ( ltr ) : last-child { border-radius : 0 3 px 3 px 0 ; }
. osd spinbutton : not ( . vertical ) button : dir ( rtl ) : first-child { border-radius : 3 px 0 0 3 px ; }
spinbutton . vertical : disabled { color : #8b8e8f ; }
spinbutton . vertical : backdrop : disabled { color : #c3c3c0 ; }
spinbutton . vertical : drop ( active ) { border-color : transparent ; box-shadow : none ; }
spinbutton . vertical entry { min-height : 32 px ; min-width : 32 px ; padding : 0 ; border-radius : 0 ; }
spinbutton . vertical button { min-height : 32 px ; min-width : 32 px ; padding : 0 ; }
spinbutton . vertical button . up { border-radius : 3 px 3 px 0 0 ; border-style : solid solid none solid ; }
spinbutton . vertical button . down { border-radius : 0 0 3 px 3 px ; border-style : none solid solid solid ; }
. osd spinbutton . vertical button : first-child { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd spinbutton . vertical button : first-child : hover { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 57 , 63 , 65 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd spinbutton . vertical button : first-child : active { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 0 , 0 , 0 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd spinbutton . vertical button : first-child : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
. osd spinbutton . vertical button : first-child : backdrop { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
treeview spinbutton : not ( . vertical ) { min-height : 0 ; border-style : none ; border-radius : 0 ; }
treeview spinbutton : not ( . vertical ) entry { min-height : 0 ; padding : 1 px 2 px ; }
/************** ComboBoxes * */
combobox arrow { - gtk-icon-source : - gtk-icontheme ( "pan-down-symbolic" ) ; min-height : 16 px ; min-width : 16 px ; }
combobox : drop ( active ) { box-shadow : none ; }
/************ Toolbars * */
2018-02-16 20:19:04 +00:00
toolbar , . inline-toolbar , . location-bar , searchbar > revealer > box { padding : 4 px ; background-color : #e8e8e7 ; }
2017-05-03 15:43:45 +00:00
toolbar { padding : 4 px 3 px 3 px 4 px ; }
. osd toolbar { background-color : transparent ; }
toolbar . osd { padding : 13 px ; border : none ; border-radius : 5 px ; background-color : rgba ( 28 , 31 , 32 , 0.7 ) ; }
toolbar . osd . left , toolbar . osd . right , toolbar . osd . top , toolbar . osd . bottom { border-radius : 0 ; }
toolbar . horizontal separator { margin : 0 7 px 1 px 6 px ; }
toolbar . vertical separator { margin : 6 px 1 px 7 px 0 ; }
2018-03-22 20:58:31 +00:00
toolbar : not ( . inline-toolbar ) : not ( . osd ) > * : not ( . toggle ) : not ( . popup ) > * { margin-right : 1 px ; margin-bottom : 1 px ; }
2017-05-03 15:43:45 +00:00
. inline-toolbar { padding : 3 px ; border-width : 0 1 px 1 px ; border-radius : 0 0 5 px 5 px ; }
2018-02-16 20:19:04 +00:00
. location-bar { border-width : 0 0 1 px ; padding : 0 px ; }
2017-05-03 15:43:45 +00:00
2018-02-16 20:19:04 +00:00
searchbar { padding : 0 px ; }
2018-02-04 21:24:44 +00:00
2018-02-16 20:19:04 +00:00
searchbar > revealer > box { padding : 6 px ; border-width : 0 0 1 px ; }
2017-05-03 15:43:45 +00:00
2018-02-16 20:19:04 +00:00
. inline-toolbar , . location-bar , searchbar > revealer > box { border-style : solid ; border-color : #b6b6b3 ; background-color : #d9d9d7 ; }
. inline-toolbar : backdrop , . location-bar : backdrop , searchbar > revealer > box : backdrop { border-color : #c0c0bd ; background-color : #dadad8 ; box-shadow : none ; transition : 200 ms ease-out ; }
2017-05-03 15:43:45 +00:00
/*************** Header bars * */
. titlebar : not ( headerbar ) , headerbar { padding : 0 6 px ; min-height : 46 px ; border-width : 0 0 1 px ; border-style : solid ; border-color : #91918c ; border-radius : 0 ; background : #f4f4f4 linear-gradient ( to top , #d4d4d2 , #efefef 2 px , #f4f4f4 3 px ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; }
. titlebar : backdrop : not ( headerbar ) , headerbar : backdrop { border-color : #c0c0bd ; background-color : #e8e8e7 ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; transition : 200 ms ease-out ; }
. titlebar : not ( headerbar ) . title , headerbar . title { padding-left : 12 px ; padding-right : 12 px ; font-weight : bold ; }
. titlebar : not ( headerbar ) . subtitle , headerbar . subtitle { font-size : smaller ; padding-left : 12 px ; padding-right : 12 px ; }
. selection-mode . titlebar : not ( headerbar ) , headerbar . selection-mode { color : #ffffff ; border-color : #184472 ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.5 ) ; background : #4a90d9 linear-gradient ( to top , #276fba , #428bd7 2 px , #4a90d9 3 px ) ; box-shadow : inset 0 1 px rgba ( 146 , 188 , 232 , 0.9 ) ; }
. selection-mode . titlebar : backdrop : not ( headerbar ) , headerbar . selection-mode : backdrop { background-color : #4a90d9 ; background-image : none ; box-shadow : inset 0 1 px rgba ( 165 , 200 , 236 , 0.88 ) ; }
. selection-mode . titlebar : not ( headerbar ) button , headerbar . selection-mode button { color : #ffffff ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; border-bottom-color : #184472 ; background-image : linear-gradient ( to bottom , #4a90d9 , #3986d5 60 % , #2a76c6 ) ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; }
. selection-mode . titlebar : not ( headerbar ) button . flat , headerbar . selection-mode button . flat { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
. selection-mode . titlebar : not ( headerbar ) button : hover , headerbar . selection-mode button : hover { color : #ffffff ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; border-bottom-color : #184472 ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.495529 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.495529 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; background-image : linear-gradient ( to bottom , #63a0de , #4a90d9 60 % , #3986d5 ) ; }
. selection-mode . titlebar : not ( headerbar ) button : active , . selection-mode . titlebar : not ( headerbar ) button : checked , headerbar . selection-mode button : active , headerbar . selection-mode button : checked { color : #ffffff ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; background-image : image ( #3180d4 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat , . selection-mode . titlebar : not ( headerbar ) button : backdrop , headerbar . selection-mode button : backdrop . flat , headerbar . selection-mode button : backdrop { border-color : #4a90d9 ; background-image : image ( #4a90d9 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; - gtk-icon-filter : none ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat label , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat , . selection-mode . titlebar : not ( headerbar ) button : backdrop label , . selection-mode . titlebar : not ( headerbar ) button : backdrop , headerbar . selection-mode button : backdrop . flat label , headerbar . selection-mode button : backdrop . flat , headerbar . selection-mode button : backdrop label , headerbar . selection-mode button : backdrop { color : #dbe9f7 ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : active , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : checked , . selection-mode . titlebar : not ( headerbar ) button : backdrop : active , . selection-mode . titlebar : not ( headerbar ) button : backdrop : checked , headerbar . selection-mode button : backdrop . flat : active , headerbar . selection-mode button : backdrop . flat : checked , headerbar . selection-mode button : backdrop : active , headerbar . selection-mode button : backdrop : checked { border-color : #438cd8 ; background-image : image ( #438cd8 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : active label , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : active , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : checked label , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : checked , . selection-mode . titlebar : not ( headerbar ) button : backdrop : active label , . selection-mode . titlebar : not ( headerbar ) button : backdrop : active , . selection-mode . titlebar : not ( headerbar ) button : backdrop : checked label , . selection-mode . titlebar : not ( headerbar ) button : backdrop : checked , headerbar . selection-mode button : backdrop . flat : active label , headerbar . selection-mode button : backdrop . flat : active , headerbar . selection-mode button : backdrop . flat : checked label , headerbar . selection-mode button : backdrop . flat : checked , headerbar . selection-mode button : backdrop : active label , headerbar . selection-mode button : backdrop : active , headerbar . selection-mode button : backdrop : checked label , headerbar . selection-mode button : backdrop : checked { color : #d9e8f7 ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : disabled , . selection-mode . titlebar : not ( headerbar ) button : backdrop : disabled , headerbar . selection-mode button : backdrop . flat : disabled , headerbar . selection-mode button : backdrop : disabled { border-color : #65a1df ; background-image : image ( #65a1df ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : disabled label , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : disabled , . selection-mode . titlebar : not ( headerbar ) button : backdrop : disabled label , . selection-mode . titlebar : not ( headerbar ) button : backdrop : disabled , headerbar . selection-mode button : backdrop . flat : disabled label , headerbar . selection-mode button : backdrop . flat : disabled , headerbar . selection-mode button : backdrop : disabled label , headerbar . selection-mode button : backdrop : disabled { color : #9bc2ea ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : disabled : active , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : disabled : checked , . selection-mode . titlebar : not ( headerbar ) button : backdrop : disabled : active , . selection-mode . titlebar : not ( headerbar ) button : backdrop : disabled : checked , headerbar . selection-mode button : backdrop . flat : disabled : active , headerbar . selection-mode button : backdrop . flat : disabled : checked , headerbar . selection-mode button : backdrop : disabled : active , headerbar . selection-mode button : backdrop : disabled : checked { border-color : #438cd8 ; background-image : image ( #438cd8 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : disabled : active label , . selection-mode . titlebar : not ( headerbar ) button : backdrop . flat : disabled : checked label , . selection-mode . titlebar : not ( headerbar ) button : backdrop : disabled : active label , . selection-mode . titlebar : not ( headerbar ) button : backdrop : disabled : checked label , headerbar . selection-mode button : backdrop . flat : disabled : active label , headerbar . selection-mode button : backdrop . flat : disabled : checked label , headerbar . selection-mode button : backdrop : disabled : active label , headerbar . selection-mode button : backdrop : disabled : checked label { color : #85b4e6 ; }
. selection-mode . titlebar : not ( headerbar ) button . flat : backdrop , . selection-mode . titlebar : not ( headerbar ) button . flat : disabled , . selection-mode . titlebar : not ( headerbar ) button . flat : backdrop : disabled , headerbar . selection-mode button . flat : backdrop , headerbar . selection-mode button . flat : disabled , headerbar . selection-mode button . flat : backdrop : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
. selection-mode . titlebar : not ( headerbar ) button : disabled , headerbar . selection-mode button : disabled { border-color : #215d9c ; background-image : image ( #65a1df ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. selection-mode . titlebar : not ( headerbar ) button : disabled label , . selection-mode . titlebar : not ( headerbar ) button : disabled , headerbar . selection-mode button : disabled label , headerbar . selection-mode button : disabled { color : #b2d0ef ; }
. selection-mode . titlebar : not ( headerbar ) button : disabled : active , . selection-mode . titlebar : not ( headerbar ) button : disabled : checked , headerbar . selection-mode button : disabled : active , headerbar . selection-mode button : disabled : checked { border-color : #215d9c ; background-image : image ( #438cd8 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
. selection-mode . titlebar : not ( headerbar ) button : disabled : active label , . selection-mode . titlebar : not ( headerbar ) button : disabled : active , . selection-mode . titlebar : not ( headerbar ) button : disabled : checked label , . selection-mode . titlebar : not ( headerbar ) button : disabled : checked , headerbar . selection-mode button : disabled : active label , headerbar . selection-mode button : disabled : active , headerbar . selection-mode button : disabled : checked label , headerbar . selection-mode button : disabled : checked { color : #b4d1ef ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action , headerbar . selection-mode button . suggested-action { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; background-image : linear-gradient ( to bottom , #e8e8e7 , #dededd 60 % , #cfcfcd ) ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : hover , headerbar . selection-mode button . suggested-action : hover { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px white ; background-image : linear-gradient ( to bottom , #f7f7f7 , #e8e8e7 60 % , #dededd ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : active , headerbar . selection-mode button . suggested-action : active { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; background-image : image ( #d9d9d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : disabled , headerbar . selection-mode button . suggested-action : disabled { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : disabled label , . selection-mode . titlebar : not ( headerbar ) button . suggested-action : disabled , headerbar . selection-mode button . suggested-action : disabled label , headerbar . selection-mode button . suggested-action : disabled { color : #8b8e8f ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : backdrop , headerbar . selection-mode button . suggested-action : backdrop { border-color : #c0c0bd ; background-image : image ( #e8e8e7 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : backdrop label , . selection-mode . titlebar : not ( headerbar ) button . suggested-action : backdrop , headerbar . selection-mode button . suggested-action : backdrop label , headerbar . selection-mode button . suggested-action : backdrop { color : #8b8e8f ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : backdrop : disabled , headerbar . selection-mode button . suggested-action : backdrop : disabled { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #184472 ; }
. selection-mode . titlebar : not ( headerbar ) button . suggested-action : backdrop : disabled label , . selection-mode . titlebar : not ( headerbar ) button . suggested-action : backdrop : disabled , headerbar . selection-mode button . suggested-action : backdrop : disabled label , headerbar . selection-mode button . suggested-action : backdrop : disabled { color : #c3c3c0 ; }
. selection-mode . titlebar : not ( headerbar ) . selection-menu : backdrop , . selection-mode . titlebar : not ( headerbar ) . selection-menu , headerbar . selection-mode . selection-menu : backdrop , headerbar . selection-mode . selection-menu { border-color : rgba ( 74 , 144 , 217 , 0 ) ; background-color : rgba ( 74 , 144 , 217 , 0 ) ; background-image : none ; box-shadow : none ; padding-left : 10 px ; padding-right : 10 px ; }
. selection-mode . titlebar : not ( headerbar ) . selection-menu : backdrop . arrow , . selection-mode . titlebar : not ( headerbar ) . selection-menu . arrow , headerbar . selection-mode . selection-menu : backdrop . arrow , headerbar . selection-mode . selection-menu . arrow { - gtk-icon-source : - gtk-icontheme ( "pan-down-symbolic" ) ; color : rgba ( 255 , 255 , 255 , 0.5 ) ; - gtk-icon-shadow : none ; }
2017-08-18 23:12:23 +00:00
. tiled . titlebar : backdrop : not ( headerbar ) , . tiled . titlebar : not ( headerbar ) , . tiled-top . titlebar : backdrop : not ( headerbar ) , . tiled-top . titlebar : not ( headerbar ) , . tiled-left . titlebar : backdrop : not ( headerbar ) , . tiled-left . titlebar : not ( headerbar ) , . tiled-right . titlebar : backdrop : not ( headerbar ) , . tiled-right . titlebar : not ( headerbar ) , . tiled-bottom . titlebar : backdrop : not ( headerbar ) , . tiled-bottom . titlebar : not ( headerbar ) , . maximized . titlebar : backdrop : not ( headerbar ) , . maximized . titlebar : not ( headerbar ) , . fullscreen . titlebar : backdrop : not ( headerbar ) , . fullscreen . titlebar : not ( headerbar ) , . tiled headerbar : backdrop , . tiled headerbar , . tiled-top headerbar : backdrop , . tiled-top headerbar , . tiled-left headerbar : backdrop , . tiled-left headerbar , . tiled-right headerbar : backdrop , . tiled-right headerbar , . tiled-bottom headerbar : backdrop , . tiled-bottom headerbar , . maximized headerbar : backdrop , . maximized headerbar , . fullscreen headerbar : backdrop , . fullscreen headerbar { border-radius : 0 ; }
2017-05-03 15:43:45 +00:00
. default-decoration . titlebar : not ( headerbar ) , headerbar . default-decoration { min-height : 28 px ; padding : 4 px ; }
. default-decoration . titlebar : not ( headerbar ) button . titlebutton , headerbar . default-decoration button . titlebutton { min-height : 26 px ; min-width : 26 px ; margin : 0 ; padding : 0 ; }
. solid-csd . titlebar : backdrop : dir ( rtl ) : not ( headerbar ) , . solid-csd . titlebar : backdrop : dir ( ltr ) : not ( headerbar ) , . solid-csd . titlebar : dir ( rtl ) : not ( headerbar ) , . solid-csd . titlebar : dir ( ltr ) : not ( headerbar ) , . solid-csd headerbar : backdrop : dir ( rtl ) , . solid-csd headerbar : backdrop : dir ( ltr ) , . solid-csd headerbar : dir ( rtl ) , . solid-csd headerbar : dir ( ltr ) { margin-left : -1 px ; margin-right : -1 px ; margin-top : -1 px ; border-radius : 0 ; box-shadow : none ; }
headerbar entry , headerbar spinbutton , headerbar separator , headerbar button { margin-top : 6 px ; margin-bottom : 6 px ; }
headerbar switch { margin-top : 9 px ; margin-bottom : 9 px ; }
2017-08-18 23:12:23 +00:00
. background : not ( . tiled ) : not ( . maximized ) : not ( . solid-csd ) . titlebar : backdrop , . background : not ( . tiled ) : not ( . maximized ) : not ( . solid-csd ) . titlebar , . background : not ( . tiled-top ) : not ( . maximized ) : not ( . solid-csd ) . titlebar : backdrop , . background : not ( . tiled-top ) : not ( . maximized ) : not ( . solid-csd ) . titlebar , . background : not ( . tiled-left ) : not ( . maximized ) : not ( . solid-csd ) . titlebar : backdrop , . background : not ( . tiled-left ) : not ( . maximized ) : not ( . solid-csd ) . titlebar , . background : not ( . tiled-right ) : not ( . maximized ) : not ( . solid-csd ) . titlebar : backdrop , . background : not ( . tiled-right ) : not ( . maximized ) : not ( . solid-csd ) . titlebar , . background : not ( . tiled-bottom ) : not ( . maximized ) : not ( . solid-csd ) . titlebar : backdrop , . background : not ( . tiled-bottom ) : not ( . maximized ) : not ( . solid-csd ) . titlebar { border-top-left-radius : 7 px ; border-top-right-radius : 7 px ; }
2017-05-03 15:43:45 +00:00
2017-05-31 17:48:11 +00:00
window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) separator : first-child + headerbar : backdrop , window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) separator : first-child + headerbar , window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) headerbar : first-child : backdrop , window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) headerbar : first-child { border-top-left-radius : 7 px ; }
2017-05-03 15:43:45 +00:00
2017-05-31 17:48:11 +00:00
window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) headerbar : last-child : backdrop , window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) headerbar : last-child { border-top-right-radius : 7 px ; }
2017-05-03 15:43:45 +00:00
2017-05-31 17:48:11 +00:00
window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) stack headerbar : first-child : backdrop , window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) stack headerbar : first-child , window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) stack headerbar : last-child : backdrop , window : not ( . tiled ) : not ( . maximized ) : not ( . fullscreen ) : not ( . solid-csd ) stack headerbar : last-child { border-top-left-radius : 7 px ; border-top-right-radius : 7 px ; }
2017-05-03 15:43:45 +00:00
window . csd > . titlebar : not ( headerbar ) { padding : 0 ; background-color : transparent ; background-image : none ; border-style : none ; border-color : transparent ; box-shadow : none ; }
. titlebar : not ( headerbar ) > separator { background-color : #b6b6b3 ; }
/************ Pathbars * */
. path-bar button . text-button , . path-bar button . image-button , . path-bar button { padding-left : 4 px ; padding-right : 4 px ; }
. path-bar button . text-button . image-button label { padding-left : 0 ; padding-right : 0 ; }
. path-bar button . text-button . image-button label : last-child , . path-bar button label : last-child { padding-right : 8 px ; }
. path-bar button . text-button . image-button label : first-child , . path-bar button label : first-child { padding-left : 8 px ; }
. path-bar button image { padding-left : 4 px ; padding-right : 4 px ; }
. path-bar button . slider-button { padding-left : 0 ; padding-right : 0 ; }
/************** Tree Views * */
treeview . view { border-left-color : #979a9b ; border-top-color : #e8e8e7 ; }
treeview . view : selected : focus , treeview . view : selected { border-radius : 0 ; }
treeview . view : selected : backdrop , treeview . view : selected { border-left-color : #a5c8ec ; border-top-color : rgba ( 46 , 52 , 54 , 0.1 ) ; }
treeview . view : disabled { color : #8b8e8f ; }
treeview . view : disabled : selected { color : #92bce8 ; }
treeview . view : disabled : selected : backdrop { color : #80b1e4 ; }
treeview . view : disabled : backdrop { color : #c3c3c0 ; }
treeview . view . separator { min-height : 2 px ; color : #e8e8e7 ; }
treeview . view . separator : backdrop { color : rgba ( 232 , 232 , 231 , 0.1 ) ; }
treeview . view : backdrop { border-left-color : #babbbb ; border-top : #e8e8e7 ; }
treeview . view : drop ( active ) { border-style : solid none ; border-width : 1 px ; border-color : #184472 ; }
treeview . view : drop ( active ) . after { border-top-style : none ; }
treeview . view : drop ( active ) . before { border-bottom-style : none ; }
treeview . view . expander { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic" ) ; color : #4d4d4d ; }
treeview . view . expander : dir ( rtl ) { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic-rtl" ) ; }
treeview . view . expander : hover { color : black ; }
treeview . view . expander : selected { color : #c9def4 ; }
treeview . view . expander : selected : hover { color : #ffffff ; }
treeview . view . expander : selected : backdrop { color : #c7dcf2 ; }
treeview . view . expander : checked { - gtk-icon-source : - gtk-icontheme ( "pan-down-symbolic" ) ; }
treeview . view . expander : backdrop { color : #adafb0 ; }
treeview . view . progressbar { color : #ffffff ; border : 1 px solid #184472 ; border-radius : 4 px ; background-color : #4a90d9 ; background-image : linear-gradient ( to bottom , #4a90d9 , #2a76c6 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.3 ) , 0 1 px rgba ( 0 , 0 , 0 , 0.2 ) ; }
treeview . view . progressbar : selected : focus , treeview . view . progressbar : selected { border-radius : 4 px ; color : #4a90d9 ; box-shadow : none ; background-image : linear-gradient ( to bottom , #ffffff , #e6e6e6 ) ; }
treeview . view . progressbar : selected : focus : backdrop , treeview . view . progressbar : selected : backdrop { color : #4a90d9 ; border-color : #184472 ; background-color : #fcfcfc ; }
treeview . view . progressbar : backdrop { color : #fcfcfc ; background-image : none ; box-shadow : none ; }
treeview . view . trough { background-color : rgba ( 46 , 52 , 54 , 0.1 ) ; border-radius : 4 px ; }
treeview . view . trough : selected : focus , treeview . view . trough : selected { background-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-radius : 4 px ; border-width : 1 px 0 ; border-style : solid ; border-color : #4a90d9 ; }
treeview . view header button { color : #979a9b ; background-color : #ffffff ; font-weight : bold ; text-shadow : none ; box-shadow : none ; }
treeview . view header button : hover { color : #636769 ; box-shadow : none ; transition : none ; }
treeview . view header button : active { color : #2e3436 ; transition : none ; }
treeview . view button . dnd : active , treeview . view button . dnd : selected , treeview . view button . dnd : hover , treeview . view button . dnd , treeview . view header . button . dnd : active , treeview . view header . button . dnd : selected , treeview . view header . button . dnd : hover , treeview . view header . button . dnd { padding : 0 6 px ; color : #ffffff ; background-image : none ; background-color : #4a90d9 ; border-style : none ; border-radius : 0 ; box-shadow : inset 0 0 0 1 px #ffffff ; text-shadow : none ; transition : none ; }
treeview . view acceleditor > label { background-color : #4a90d9 ; }
treeview . view header button , treeview . view header button : hover , treeview . view header button : active { padding : 0 6 px ; background-image : none ; border-style : none solid solid none ; border-color : #e8e8e7 ; border-radius : 0 ; text-shadow : none ; }
treeview . view header button : disabled { border-color : #e8e8e7 ; background-image : none ; }
treeview . view header button : backdrop { color : #babbbb ; border-color : #e8e8e7 ; border-style : none solid solid none ; background-image : none ; background-color : #fcfcfc ; }
treeview . view header button : backdrop : disabled { border-color : #e8e8e7 ; background-image : none ; }
2017-05-17 16:09:59 +00:00
treeview . view header button : last-child : backdrop , treeview . view header button : last-child { border-right-style : none ; }
2017-05-03 15:43:45 +00:00
/********* Menus * */
2017-06-18 10:52:20 +00:00
menubar , . menubar { padding : 0 px ; box-shadow : inset 0 -1 px rgba ( 0 , 0 , 0 , 0.1 ) ; }
2017-05-03 15:43:45 +00:00
menubar : backdrop , . menubar : backdrop { background-color : #e8e8e7 ; }
menubar > menuitem , . menubar > menuitem { min-height : 16 px ; padding : 4 px 8 px ; }
menubar > menuitem : hover , . menubar > menuitem : hover { box-shadow : inset 0 -3 px #4a90d9 ; color : #2a76c6 ; }
menubar > menuitem : disabled , . menubar > menuitem : disabled { color : #8b8e8f ; box-shadow : none ; }
2017-08-11 13:07:13 +00:00
menu , . menu , . context-menu { padding : 2 px 0 px ; background-color : #ffffff ; border : 1 px solid #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
. csd menu , . csd . menu , . csd . context-menu { border : none ; }
menu : backdrop , . menu : backdrop , . context-menu : backdrop { background-color : #fcfcfc ; }
menu menuitem , . menu menuitem , . context-menu menuitem { min-height : 16 px ; min-width : 40 px ; padding : 4 px 6 px ; text-shadow : none ; }
menu menuitem : hover , . menu menuitem : hover , . context-menu menuitem : hover { color : #ffffff ; background-color : #4a90d9 ; }
menu menuitem : disabled , . menu menuitem : disabled , . context-menu menuitem : disabled { color : #8b8e8f ; }
menu menuitem : disabled : backdrop , . menu menuitem : disabled : backdrop , . context-menu menuitem : disabled : backdrop { color : #c3c3c0 ; }
menu menuitem : backdrop , menu menuitem : backdrop : hover , . menu menuitem : backdrop , . menu menuitem : backdrop : hover , . context-menu menuitem : backdrop , . context-menu menuitem : backdrop : hover { color : #8b8e8f ; background-color : transparent ; }
menu menuitem arrow , . menu menuitem arrow , . context-menu menuitem arrow { min-height : 16 px ; min-width : 16 px ; }
menu menuitem arrow : dir ( ltr ) , . menu menuitem arrow : dir ( ltr ) , . context-menu menuitem arrow : dir ( ltr ) { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic" ) ; margin-left : 10 px ; }
menu menuitem arrow : dir ( rtl ) , . menu menuitem arrow : dir ( rtl ) , . context-menu menuitem arrow : dir ( rtl ) { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic-rtl" ) ; margin-right : 10 px ; }
menu menuitem label : dir ( rtl ) , menu menuitem label : dir ( ltr ) , . menu menuitem label : dir ( rtl ) , . menu menuitem label : dir ( ltr ) , . context-menu menuitem label : dir ( rtl ) , . context-menu menuitem label : dir ( ltr ) { color : inherit ; }
menu > arrow , . menu > arrow , . context-menu > arrow { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; min-height : 16 px ; min-width : 16 px ; padding : 4 px ; background-color : #ffffff ; border-radius : 0 ; }
menu > arrow . top , . menu > arrow . top , . context-menu > arrow . top { margin-top : -6 px ; border-bottom : 1 px solid #eaebeb ; - gtk-icon-source : - gtk-icontheme ( "pan-up-symbolic" ) ; }
menu > arrow . bottom , . menu > arrow . bottom , . context-menu > arrow . bottom { margin-bottom : -6 px ; border-top : 1 px solid #eaebeb ; - gtk-icon-source : - gtk-icontheme ( "pan-down-symbolic" ) ; }
menu > arrow : hover , . menu > arrow : hover , . context-menu > arrow : hover { background-color : #eaebeb ; }
menu > arrow : backdrop , . menu > arrow : backdrop , . context-menu > arrow : backdrop { background-color : #fcfcfc ; }
menu > arrow : disabled , . menu > arrow : disabled , . context-menu > arrow : disabled { color : transparent ; background-color : transparent ; border-color : transparent ; }
menuitem accelerator { color : alpha ( currentColor , 0.55 ) ; }
menuitem check , menuitem radio { min-height : 16 px ; min-width : 16 px ; }
menuitem check : dir ( ltr ) , menuitem radio : dir ( ltr ) { margin-right : 7 px ; }
menuitem check : dir ( rtl ) , menuitem radio : dir ( rtl ) { margin-left : 7 px ; }
/*************** Popovers * */
2017-07-08 10:04:44 +00:00
popover > arrow { background-color : #e8e8e7 ; border : 1 px solid #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
popover > contents . menu { padding : 8 px ; background-color : white ; margin : 0 px ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
popover > contents { padding : 2 px ; margin : 0 px ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
popover > contents . background { border-radius : 5 px ; background-color : #e8e8e7 ; box-shadow : 0 1 px 2 px rgba ( 0 , 0 , 0 , 0.3 ) ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background , popover > contents . background { border : 1 px solid #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
popover > contents . background : backdrop { background-color : #e8e8e7 ; box-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
popover > contents . background > list , popover > contents . background > . view , popover > contents . background > iconview , popover > contents . background > toolbar { border-style : none ; background-color : transparent ; }
2017-05-03 15:43:45 +00:00
2017-07-08 10:04:44 +00:00
. csd popover > contents . background . touch-selection , . csd popover > contents . background . magnifier , popover > contents . background . touch-selection , popover > contents . background . magnifier { border : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; }
popover > contents . background separator { margin : 3 px ; }
popover > contents . background list separator { margin : 0 px ; }
2017-05-03 15:43:45 +00:00
/************* Notebooks * */
2017-05-11 20:08:19 +00:00
notebook box > header { padding : 1 px ; border-color : #b6b6b3 ; border-width : 1 px ; background-color : #cfcfcd ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header : backdrop { border-color : #c0c0bd ; background-color : #dadad8 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tabs { margin : -1 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top { border-bottom-style : solid ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs { margin-bottom : -2 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs > tab : hover { box-shadow : inset 0 -3 px #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs > tab : backdrop { box-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs > tab : checked { box-shadow : inset 0 -3 px #4a90d9 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . bottom { border-top-style : solid ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . bottom > tabs { margin-top : -2 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . bottom > tabs > tab : hover { box-shadow : inset 0 3 px #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . bottom > tabs > tab : backdrop { box-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . bottom > tabs > tab : checked { box-shadow : inset 0 3 px #4a90d9 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left { border-right-style : solid ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs { margin-right : -2 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs > tab : hover { box-shadow : inset -3 px 0 #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs > tab : backdrop { box-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs > tab : checked { box-shadow : inset -3 px 0 #4a90d9 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . right { border-left-style : solid ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . right > tabs { margin-left : -2 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . right > tabs > tab : hover { box-shadow : inset 3 px 0 #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . right > tabs > tab : backdrop { box-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . right > tabs > tab : checked { box-shadow : inset 3 px 0 #4a90d9 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs > arrow { border-top-style : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . bottom > tabs > arrow { border-bottom-style : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs > arrow , notebook box > header . bottom > tabs > arrow { margin-left : -5 px ; margin-right : -5 px ; padding-left : 4 px ; padding-right : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs > arrow . down , notebook box > header . bottom > tabs > arrow . down { - gtk-icon-source : - gtk-icontheme ( "pan-start-symbolic" ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top > tabs > arrow . up , notebook box > header . bottom > tabs > arrow . up { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic" ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs > arrow { border-left-style : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . right > tabs > arrow { border-right-style : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs > arrow , notebook box > header . right > tabs > arrow { margin-top : -5 px ; margin-bottom : -5 px ; padding-top : 4 px ; padding-bottom : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs > arrow . down , notebook box > header . right > tabs > arrow . down { - gtk-icon-source : - gtk-icontheme ( "pan-up-symbolic" ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left > tabs > arrow . up , notebook box > header . right > tabs > arrow . up { - gtk-icon-source : - gtk-icontheme ( "pan-down-symbolic" ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow { min-height : 16 px ; min-width : 16 px ; border-radius : 0 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : hover : not ( : active ) : not ( : backdrop ) { background-clip : padding-box ; background-image : none ; background-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : transparent ; box-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header > tabs > arrow : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab { min-height : 30 px ; min-width : 30 px ; padding : 3 px 12 px ; outline-offset : -5 px ; color : #8b8e8f ; font-weight : bold ; border-width : 1 px ; border-color : transparent ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : hover { color : #5d6163 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : hover . reorderable-page { border-color : rgba ( 182 , 182 , 179 , 0.3 ) ; background-color : rgba ( 232 , 232 , 231 , 0.2 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : backdrop { color : #b0b2b2 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : backdrop . reorderable-page { border-color : transparent ; background-color : transparent ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : checked { color : #2e3436 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : checked . reorderable-page { border-color : rgba ( 182 , 182 , 179 , 0.5 ) ; background-color : rgba ( 232 , 232 , 231 , 0.5 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : checked . reorderable-page : hover { background-color : rgba ( 232 , 232 , 231 , 0.7 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : backdrop : checked { color : #8b8e8f ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab : backdrop : checked . reorderable-page { border-color : #c0c0bd ; background-color : #e8e8e7 ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab button . flat { padding : 0 ; margin-top : 4 px ; margin-bottom : 4 px ; min-width : 20 px ; min-height : 20 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab button . flat : hover { color : currentColor ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab button . flat , notebook box > header tab button . flat : backdrop { color : alpha ( currentColor , 0.3 ) ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab button . flat : last-child { margin-left : 4 px ; margin-right : -4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header tab button . flat : first-child { margin-left : -4 px ; margin-right : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top tabs , notebook box > header . bottom tabs { padding-left : 4 px ; padding-right : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top tabs : not ( : only-child ) , notebook box > header . bottom tabs : not ( : only-child ) { margin-left : 3 px ; margin-right : 3 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top tabs : not ( : only-child ) : first-child , notebook box > header . bottom tabs : not ( : only-child ) : first-child { margin-left : -1 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top tabs : not ( : only-child ) : last-child , notebook box > header . bottom tabs : not ( : only-child ) : last-child { margin-right : -1 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top tabs tab , notebook box > header . bottom tabs tab { margin-left : 4 px ; margin-right : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top tabs tab . reorderable-page , notebook box > header . bottom tabs tab . reorderable-page { border-style : none solid ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left tabs , notebook box > header . right tabs { padding-top : 4 px ; padding-bottom : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left tabs : not ( : only-child ) , notebook box > header . right tabs : not ( : only-child ) { margin-top : 3 px ; margin-bottom : 3 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left tabs : not ( : only-child ) : first-child , notebook box > header . right tabs : not ( : only-child ) : first-child { margin-top : -1 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left tabs : not ( : only-child ) : last-child , notebook box > header . right tabs : not ( : only-child ) : last-child { margin-bottom : -1 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left tabs tab , notebook box > header . right tabs tab { margin-top : 4 px ; margin-bottom : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . left tabs tab . reorderable-page , notebook box > header . right tabs tab . reorderable-page { border-style : solid none ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . top tab { padding-bottom : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > header . bottom tab { padding-top : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > stack : not ( : only-child ) { background-color : #ffffff ; }
2017-05-03 15:43:45 +00:00
2017-05-11 20:08:19 +00:00
notebook box > stack : not ( : only-child ) : backdrop { background-color : #fcfcfc ; }
2017-05-03 15:43:45 +00:00
/************** Scrollbars * */
scrollbar { background-color : #c3c4c4 ; transition : 300 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; }
scrollbar . top { border-bottom : 1 px solid #b6b6b3 ; }
scrollbar . bottom { border-top : 1 px solid #b6b6b3 ; }
scrollbar . left { border-right : 1 px solid #b6b6b3 ; }
scrollbar . right { border-left : 1 px solid #b6b6b3 ; }
scrollbar : backdrop { background-color : #e1e1df ; border-color : #c0c0bd ; transition : 200 ms ease-out ; }
scrollbar slider { min-width : 6 px ; min-height : 6 px ; margin : -1 px ; border : 4 px solid transparent ; border-radius : 8 px ; background-clip : padding-box ; background-color : #787c7d ; }
scrollbar slider : hover { background-color : #535859 ; }
scrollbar slider : hover : active { background-color : #2a76c6 ; }
scrollbar slider : backdrop { background-color : #c3c4c4 ; }
scrollbar slider : disabled { background-color : transparent ; }
2017-10-25 07:34:52 +00:00
scrollbar range . fine-tune slider { min-width : 4 px ; min-height : 4 px ; }
2017-05-03 15:43:45 +00:00
2017-10-25 07:34:52 +00:00
scrollbar range . fine-tune . horizontal slider { border-width : 5 px 4 px ; }
2017-05-03 15:43:45 +00:00
2017-10-25 07:34:52 +00:00
scrollbar range . fine-tune . vertical slider { border-width : 4 px 5 px ; }
2017-05-03 15:43:45 +00:00
scrollbar . overlay-indicator : not ( . dragging ) : not ( . hovering ) { border-color : transparent ; opacity : 0.4 ; background-color : transparent ; }
scrollbar . overlay-indicator : not ( . dragging ) : not ( . hovering ) slider { margin : 0 ; min-width : 3 px ; min-height : 3 px ; background-color : #2e3436 ; border : 1 px solid white ; }
scrollbar . overlay-indicator : not ( . dragging ) : not ( . hovering ) button { min-width : 5 px ; min-height : 5 px ; background-color : #2e3436 ; background-clip : padding-box ; border-radius : 100 % ; border : 1 px solid white ; - gtk-icon-source : none ; }
scrollbar . overlay-indicator : not ( . dragging ) : not ( . hovering ) . horizontal slider { margin : 0 2 px ; min-width : 40 px ; }
scrollbar . overlay-indicator : not ( . dragging ) : not ( . hovering ) . horizontal button { margin : 1 px 2 px ; min-width : 5 px ; }
scrollbar . overlay-indicator : not ( . dragging ) : not ( . hovering ) . vertical slider { margin : 2 px 0 ; min-height : 40 px ; }
scrollbar . overlay-indicator : not ( . dragging ) : not ( . hovering ) . vertical button { margin : 2 px 1 px ; min-height : 5 px ; }
scrollbar . overlay-indicator . dragging , scrollbar . overlay-indicator . hovering { opacity : 0.8 ; }
scrollbar . horizontal slider { min-width : 40 px ; }
scrollbar . vertical slider { min-height : 40 px ; }
scrollbar button { padding : 0 ; min-width : 12 px ; min-height : 12 px ; border-style : none ; border-radius : 0 ; transition-property : min-height , min-width , color ; border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #787c7d ; }
scrollbar button : hover { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #535859 ; }
scrollbar button : active , scrollbar button : checked { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #2a76c6 ; }
scrollbar button : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : rgba ( 120 , 124 , 125 , 0.2 ) ; }
scrollbar button : backdrop { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : #c3c4c4 ; }
scrollbar button : backdrop : disabled { border-color : transparent ; background-color : transparent ; background-image : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; color : rgba ( 195 , 196 , 196 , 0.2 ) ; }
scrollbar . vertical button . down { - gtk-icon-source : - gtk-icontheme ( "pan-down-symbolic" ) ; }
scrollbar . vertical button . up { - gtk-icon-source : - gtk-icontheme ( "pan-up-symbolic" ) ; }
scrollbar . horizontal button . down { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic" ) ; }
scrollbar . horizontal button . up { - gtk-icon-source : - gtk-icontheme ( "pan-start-symbolic" ) ; }
treeview ~ scrollbar . vertical { border-top : 1 px solid #b6b6b3 ; margin-top : -1 px ; }
/********** Switch * */
switch { font-weight : bold ; font-size : smaller ; outline-offset : -4 px ; border : 1 px solid #b6b6b3 ; border-radius : 3 px ; color : #2e3436 ; background-color : #cfcfcd ; text-shadow : 0 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; }
switch : checked { color : #ffffff ; border-color : #184472 ; background-color : #4a90d9 ; text-shadow : 0 1 px rgba ( 24 , 68 , 114 , 0.5 ) , 0 0 2 px rgba ( 255 , 255 , 255 , 0.6 ) ; }
switch : disabled { color : #8b8e8f ; border-color : #b6b6b3 ; background-color : #f1f1f1 ; text-shadow : none ; }
switch : backdrop { color : #8b8e8f ; border-color : #c0c0bd ; background-color : #dadad8 ; text-shadow : none ; transition : 200 ms ease-out ; }
switch : backdrop : checked { color : #e8e8e7 ; border-color : #4a90d9 ; background-color : #4a90d9 ; }
switch : backdrop : disabled { color : #c3c3c0 ; border-color : #c0c0bd ; background-color : #f1f1f1 ; }
switch slider { margin : -1 px ; min-width : 44 px ; min-height : 26 px ; border : 1 px solid ; border-radius : 3 px ; transition : all 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; background-image : linear-gradient ( to bottom , #f4f4f4 20 % , #e8e8e7 90 % ) ; box-shadow : inset 0 1 px white , inset 0 -2 px #ededec , inset 0 -1 px #cacac8 , 0 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; }
switch : hover slider { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #91918c ; box-shadow : inset 0 1 px white , inset 0 -2 px #f4f4f4 , inset 0 -1 px #cfcfcd , 0 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; background-image : linear-gradient ( to bottom , #fefefe 10 % , #f2f2f1 90 % ) ; }
switch : checked slider { border : 1 px solid #184472 ; }
switch : disabled slider { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
switch : disabled slider label , switch : disabled slider { color : #8b8e8f ; }
switch : backdrop slider { transition : 200 ms ease-out ; border-color : #c0c0bd ; background-image : image ( #e8e8e7 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
switch : backdrop slider label , switch : backdrop slider { color : #8b8e8f ; }
switch : backdrop : checked slider { border-color : #4a90d9 ; }
switch : backdrop : disabled slider { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
switch : backdrop : disabled slider label , switch : backdrop : disabled slider { color : #c3c3c0 ; }
row : selected switch { box-shadow : none ; border-color : #184472 ; }
row : selected switch : backdrop { border-color : #184472 ; }
2017-09-03 12:53:48 +00:00
row : selected switch slider : dir ( rtl ) { border-left-color : #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-09-03 12:53:48 +00:00
row : selected switch slider : dir ( ltr ) { border-right-color : #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
2017-09-03 12:53:48 +00:00
row : selected switch slider : checked , row : selected switch slider { border-color : #184472 ; }
2017-05-03 15:43:45 +00:00
/************************* Check and Radio items * */
. view . content-view . check : not ( list ) , iconview . content-view . check : not ( list ) , . content-view . tile check : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-selectionmode.png" ) , url ( "assets/checkbox-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
. view . content-view . check : hover : not ( list ) , iconview . content-view . check : hover : not ( list ) , . content-view . tile check : hover : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-hover-selectionmode.png" ) , url ( "assets/checkbox-hover-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
. view . content-view . check : active : not ( list ) , iconview . content-view . check : active : not ( list ) , . content-view . tile check : active : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-active-selectionmode.png" ) , url ( "assets/checkbox-active-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
. view . content-view . check : backdrop : not ( list ) , iconview . content-view . check : backdrop : not ( list ) , . content-view . tile check : backdrop : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-backdrop-selectionmode.png" ) , url ( "assets/checkbox-backdrop-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
. view . content-view . check : checked : not ( list ) , iconview . content-view . check : checked : not ( list ) , . content-view . tile check : checked : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-checked-selectionmode.png" ) , url ( "assets/checkbox-checked-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
. view . content-view . check : checked : hover : not ( list ) , iconview . content-view . check : checked : hover : not ( list ) , . content-view . tile check : checked : hover : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-checked-hover-selectionmode.png" ) , url ( "assets/checkbox-checked-hover-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
. view . content-view . check : checked : active : not ( list ) , iconview . content-view . check : checked : active : not ( list ) , . content-view . tile check : checked : active : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-checked-active-selectionmode.png" ) , url ( "assets/checkbox-checked-active-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
. view . content-view . check : backdrop : checked : not ( list ) , iconview . content-view . check : backdrop : checked : not ( list ) , . content-view . tile check : backdrop : checked : not ( list ) { - gtk-icon-shadow : none ; - gtk-icon-source : - gtk-scaled ( url ( "assets/checkbox-checked-backdrop-selectionmode.png" ) , url ( "assets/checkbox-checked-backdrop-selectionmode@2.png" ) ) ; background-color : transparent ; min-width : 40 px ; min-height : 40 px ; background-image : none ; transition : none ; box-shadow : none ; border-width : 0 ; }
checkbutton . text-button , radiobutton . text-button { padding : 2 px 0 ; outline-offset : 0 ; }
checkbutton . text-button label : not ( : only-child ) : first-child , radiobutton . text-button label : not ( : only-child ) : first-child { margin-left : 4 px ; }
checkbutton . text-button label : not ( : only-child ) : last-child , radiobutton . text-button label : not ( : only-child ) : last-child { margin-right : 4 px ; }
check , radio { margin : 0 4 px ; min-height : 14 px ; min-width : 14 px ; border : 1 px solid ; - gtk-icon-source : none ; color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; background-image : linear-gradient ( to bottom , #f4f4f4 20 % , #e8e8e7 90 % ) ; box-shadow : inset 0 1 px white , inset 0 -2 px #ededec , inset 0 -1 px #cacac8 , 0 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; }
check : only-child , radio : only-child { margin : 0 ; }
popover check . left : dir ( rtl ) , popover radio . left : dir ( rtl ) { margin-left : 0 ; margin-right : 12 px ; }
popover check . right : dir ( ltr ) , popover radio . right : dir ( ltr ) { margin-left : 12 px ; margin-right : 0 ; }
check : hover , radio : hover { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #91918c ; box-shadow : inset 0 1 px white , inset 0 -2 px #f4f4f4 , inset 0 -1 px #cfcfcd , 0 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; background-image : linear-gradient ( to bottom , #fefefe 10 % , #f2f2f1 90 % ) ; }
check : active , radio : active { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; background-image : image ( #d9d9d7 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
check : disabled , radio : disabled { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
check : disabled label , check : disabled , radio : disabled label , radio : disabled { color : #8b8e8f ; }
check : backdrop , radio : backdrop { border-color : #c0c0bd ; background-image : image ( #e8e8e7 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; transition : 200 ms ease-out ; }
check : backdrop label , check : backdrop , radio : backdrop label , radio : backdrop { color : #8b8e8f ; }
check : backdrop : disabled , radio : backdrop : disabled { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
check : backdrop : disabled label , check : backdrop : disabled , radio : backdrop : disabled label , radio : backdrop : disabled { color : #c3c3c0 ; }
row : selected check , row : selected radio { border-color : #184472 ; }
. osd check , . osd radio { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd check : hover , . osd radio : hover { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd check : active , . osd radio : active { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 0 , 0 , 0 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; }
. osd check : backdrop , . osd radio : backdrop { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
. osd check : disabled , . osd radio : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; }
menu menuitem check , menu menuitem radio { margin : 0 ; }
menu menuitem check , menu menuitem check : hover , menu menuitem check : disabled , menu menuitem radio , menu menuitem radio : hover , menu menuitem radio : disabled { min-height : 14 px ; min-width : 14 px ; background-image : none ; background-color : transparent ; box-shadow : none ; - gtk-icon-shadow : none ; color : inherit ; border-color : currentColor ; }
2018-01-01 19:53:43 +00:00
check { border-radius : 3 px ; - gtk-icon-size : 14 px ; }
2017-05-03 15:43:45 +00:00
2017-11-05 04:08:18 +00:00
check : checked { - gtk-icon-source : - gtk-scaled ( - gtk-recolor ( url ( "assets/check-symbolic.symbolic.png" ) ) , - gtk-recolor ( url ( "assets/check@2-symbolic.symbolic.png" ) ) ) ; }
2017-05-03 15:43:45 +00:00
2017-11-05 04:08:18 +00:00
check : indeterminate { - gtk-icon-source : - gtk-scaled ( - gtk-recolor ( url ( "assets/dash-symbolic.symbolic.png" ) ) , - gtk-recolor ( url ( "assets/dash@2-symbolic.symbolic.png" ) ) ) ; }
2017-05-03 15:43:45 +00:00
2018-01-01 19:53:43 +00:00
treeview . view radio : selected : focus , treeview . view radio : selected , radio { border-radius : 100 % ; - gtk-icon-size : 14 px ; }
2017-05-03 15:43:45 +00:00
2017-11-05 04:08:18 +00:00
treeview . view radio : checked : selected , radio : checked { - gtk-icon-source : - gtk-scaled ( - gtk-recolor ( url ( "assets/bullet-symbolic.symbolic.png" ) ) , - gtk-recolor ( url ( "assets/bullet@2-symbolic.symbolic.png" ) ) ) ; }
2017-05-03 15:43:45 +00:00
2017-11-05 04:08:18 +00:00
treeview . view radio : indeterminate : selected , radio : indeterminate { - gtk-icon-source : - gtk-scaled ( - gtk-recolor ( url ( "assets/dash-symbolic.symbolic.png" ) ) , - gtk-recolor ( url ( "assets/dash@2-symbolic.symbolic.png" ) ) ) ; }
2017-05-03 15:43:45 +00:00
radio : not ( : indeterminate ) : not ( : checked ) : active : not ( : backdrop ) { - gtk-icon-transform : scale ( 0 ) ; }
check : not ( : indeterminate ) : not ( : checked ) : active : not ( : backdrop ) { - gtk-icon-transform : translate ( 6 px , -3 px ) rotate ( -45 deg ) scaleY ( 0.2 ) rotate ( 45 deg ) scaleX ( 0 ) ; }
radio : active , check : active { - gtk-icon-transform : scale ( 0 , 1 ) ; }
radio : checked : not ( : backdrop ) , radio : indeterminate : not ( : backdrop ) , check : checked : not ( : backdrop ) , check : indeterminate : not ( : backdrop ) { - gtk-icon-transform : unset ; transition : 400 ms ; }
menu menuitem radio : checked : not ( : backdrop ) , menu menuitem radio : indeterminate : not ( : backdrop ) , menu menuitem check : checked : not ( : backdrop ) , menu menuitem check : indeterminate : not ( : backdrop ) { transition : none ; }
treeview . view check : selected : focus , treeview . view check : selected , treeview . view radio : selected : focus , treeview . view radio : selected { color : #2e3436 ; border-color : #184472 ; }
treeview . view check : selected : disabled , treeview . view radio : selected : disabled { color : #8b8e8f ; }
treeview . view check : selected : disabled : backdrop , treeview . view radio : selected : disabled : backdrop { color : #c3c3c0 ; }
treeview . view check : backdrop : selected , treeview . view check : backdrop , treeview . view radio : backdrop : selected , treeview . view radio : backdrop { color : #8b8e8f ; }
/************ GtkScale * */
scale trough , scale fill , progressbar trough { border : 1 px solid #b6b6b3 ; border-radius : 3 px ; background-color : #cfcfcd ; }
scale trough : disabled , scale fill : disabled , progressbar trough : disabled { background-color : #f1f1f1 ; }
scale trough : backdrop , scale fill : backdrop , progressbar trough : backdrop , progressbar : backdrop trough { background-color : #dadad8 ; border-color : #c0c0bd ; transition : 200 ms ease-out ; }
scale trough : backdrop : disabled , scale fill : backdrop : disabled , progressbar trough : backdrop : disabled , progressbar : backdrop trough : disabled { background-color : #f1f1f1 ; }
row : selected scale trough : disabled , scale row : selected trough : disabled , row : selected scale fill : disabled , scale row : selected fill : disabled , row : selected progressbar trough : disabled , progressbar row : selected trough : disabled , row : selected scale trough , scale row : selected trough , row : selected scale fill , scale row : selected fill , row : selected progressbar trough , progressbar row : selected trough { border-color : #184472 ; }
. osd scale trough , scale . osd trough , . osd scale fill , scale . osd fill , . osd progressbar trough , progressbar . osd trough { border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : rgba ( 0 , 0 , 0 , 0.5 ) ; }
. osd scale trough : disabled , scale . osd trough : disabled , . osd scale fill : disabled , scale . osd fill : disabled , . osd progressbar trough : disabled , progressbar . osd trough : disabled { background-color : rgba ( 49 , 52 , 52 , 0.5 ) ; }
scale highlight , progressbar progress { border : 1 px solid #184472 ; border-radius : 3 px ; background-color : #4a90d9 ; }
scale highlight : disabled , progressbar progress : disabled { background-color : transparent ; border-color : transparent ; }
scale highlight : backdrop , progressbar progress : backdrop , progressbar : backdrop progress { border-color : #4a90d9 ; }
scale highlight : backdrop : disabled , progressbar progress : backdrop : disabled , progressbar : backdrop progress : disabled { background-color : transparent ; border-color : transparent ; }
row : selected scale highlight : disabled , scale row : selected highlight : disabled , row : selected progressbar progress : disabled , progressbar row : selected progress : disabled , row : selected scale highlight , scale row : selected highlight , row : selected progressbar progress , progressbar row : selected progress { border-color : #184472 ; }
. osd scale highlight , scale . osd highlight , . osd progressbar progress , progressbar . osd progress { border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; }
. osd scale highlight : disabled , scale . osd highlight : disabled , . osd progressbar progress : disabled , progressbar . osd progress : disabled { border-color : transparent ; }
scale { min-height : 10 px ; min-width : 10 px ; padding : 12 px ; }
scale fill , scale highlight { margin : -1 px ; }
scale slider { min-height : 18 px ; min-width : 18 px ; margin : -9 px ; }
2017-10-25 07:34:52 +00:00
scale : focus { outline : none ; }
2017-05-03 15:43:45 +00:00
scale . fine-tune . horizontal { padding-top : 9 px ; padding-bottom : 9 px ; min-height : 16 px ; }
scale . fine-tune . vertical { padding-left : 9 px ; padding-right : 9 px ; min-width : 16 px ; }
scale . fine-tune slider { margin : -6 px ; }
scale . fine-tune fill , scale . fine-tune highlight , scale . fine-tune trough { border-radius : 5 px ; - gtk-outline-radius : 7 px ; }
scale trough { outline-offset : 2 px ; - gtk-outline-radius : 5 px ; }
scale fill : backdrop , scale fill { background-color : #b6b6b3 ; }
scale fill : disabled : backdrop , scale fill : disabled { border-color : transparent ; background-color : transparent ; }
. osd scale fill { background-color : rgba ( 91 , 91 , 90 , 0.775 ) ; }
. osd scale fill : disabled : backdrop , . osd scale fill : disabled { border-color : transparent ; background-color : transparent ; }
scale slider { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; background-image : linear-gradient ( to bottom , #f4f4f4 20 % , #e8e8e7 90 % ) ; box-shadow : inset 0 1 px white , inset 0 -2 px #ededec , inset 0 -1 px #cacac8 , 0 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; border : 1 px solid #898984 ; border-radius : 100 % ; transition : all 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; transition-property : background , border , box-shadow ; }
scale slider : hover { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #91918c ; box-shadow : inset 0 1 px white , inset 0 -2 px #f4f4f4 , inset 0 -1 px #cfcfcd , 0 1 px rgba ( 0 , 0 , 0 , 0.1 ) ; background-image : linear-gradient ( to bottom , #fefefe 10 % , #f2f2f1 90 % ) ; }
scale slider : active { border-color : #184472 ; }
scale slider : disabled { border-color : #b6b6b3 ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
scale slider : disabled label , scale slider : disabled { color : #8b8e8f ; }
scale slider : backdrop { transition : 200 ms ease-out ; border-color : #c0c0bd ; background-image : image ( #e8e8e7 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
scale slider : backdrop label , scale slider : backdrop { color : #8b8e8f ; }
scale slider : backdrop : disabled { border-color : #c0c0bd ; background-image : image ( #f1f1f1 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
scale slider : backdrop : disabled label , scale slider : backdrop : disabled { color : #c3c3c0 ; }
row : selected scale slider : disabled , row : selected scale slider { border-color : #184472 ; }
. osd scale slider { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : #1c1f20 ; }
. osd scale slider : hover { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 57 , 63 , 65 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.1 ) ; text-shadow : 0 1 px black ; - gtk-icon-shadow : 0 1 px black ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; background-color : #1c1f20 ; }
. osd scale slider : active { color : white ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 0 , 0 , 0 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; outline-color : rgba ( 238 , 238 , 236 , 0.3 ) ; background-color : #1c1f20 ; }
. osd scale slider : disabled { color : #858786 ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 49 , 52 , 52 , 0.5 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; background-color : #1c1f20 ; }
. osd scale slider : backdrop { color : #eeeeec ; border-color : rgba ( 0 , 0 , 0 , 0.7 ) ; background-color : transparent ; background-image : image ( rgba ( 28 , 31 , 32 , 0.7 ) ) ; background-clip : padding-box ; box-shadow : none ; text-shadow : none ; - gtk-icon-shadow : none ; background-color : #1c1f20 ; }
. osd scale slider : backdrop : disabled { background-color : #1c1f20 ; }
scale value { color : alpha ( currentColor , 0.55 ) ; }
scale . fine-tune marks . top { margin-bottom : 6 px ; margin-top : -9 px ; }
scale . fine-tune marks . bottom { margin-top : 6 px ; margin-bottom : -9 px ; }
scale . fine-tune marks . top { margin-right : 6 px ; margin-left : -9 px ; }
scale . fine-tune marks . bottom { margin-left : 6 px ; margin-right : -9 px ; }
2018-01-10 08:29:45 +00:00
scale . horizontal > marks { color : alpha ( currentColor , 0.55 ) ; }
scale . horizontal > marks . top { margin-bottom : 6 px ; }
scale . horizontal > marks . bottom { margin-top : 6 px ; }
scale . horizontal > marks indicator { background-color : currentColor ; min-height : 6 px ; min-width : 1 px ; }
2017-05-03 15:43:45 +00:00
2018-01-10 09:10:11 +00:00
scale . horizontal > value . top { margin-bottom : 9 px ; }
scale . horizontal > value . bottom { margin-top : 9 px ; }
2017-05-03 15:43:45 +00:00
scale . horizontal . fine-tune indicator { min-height : 3 px ; }
2018-01-10 08:29:45 +00:00
scale . vertical > marks { color : alpha ( currentColor , 0.55 ) ; }
scale . vertical > marks . top { margin-right : 6 px ; }
scale . vertical > marks . bottom { margin-left : 6 px ; }
scale . vertical > marks indicator { background-color : currentColor ; min-height : 1 px ; min-width : 6 px ; }
2017-05-03 15:43:45 +00:00
2018-01-10 09:10:11 +00:00
scale . vertical > value . top { margin-bottom : 9 px ; }
scale . vertical > value . bottom { margin-top : 9 px ; }
2017-05-03 15:43:45 +00:00
scale . vertical . fine-tune indicator { min-width : 3 px ; }
scale . horizontal . marks-before : not ( . marks-after ) slider { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above.png" ) , url ( "assets/slider-horz-scale-has-marks-above@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-top : -14 px ; background-position : top ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-top : -11 px ; }
scale . horizontal . marks-before : not ( . marks-after ) slider : hover { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above-hover.png" ) , url ( "assets/slider-horz-scale-has-marks-above-hover@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-top : -14 px ; background-position : top ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-top : -11 px ; }
scale . horizontal . marks-before : not ( . marks-after ) slider : active { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above-active.png" ) , url ( "assets/slider-horz-scale-has-marks-above-active@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-top : -14 px ; background-position : top ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-top : -11 px ; }
scale . horizontal . marks-before : not ( . marks-after ) slider : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above-insensitive.png" ) , url ( "assets/slider-horz-scale-has-marks-above-insensitive@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-top : -14 px ; background-position : top ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-top : -11 px ; }
scale . horizontal . marks-before : not ( . marks-after ) slider : backdrop { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above-backdrop.png" ) , url ( "assets/slider-horz-scale-has-marks-above-backdrop@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-top : -14 px ; background-position : top ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-top : -11 px ; }
scale . horizontal . marks-before : not ( . marks-after ) slider : backdrop : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above-backdrop-insensitive.png" ) , url ( "assets/slider-horz-scale-has-marks-above-backdrop-insensitive@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-top : -14 px ; background-position : top ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-top : -11 px ; }
scale . horizontal . marks-after : not ( . marks-before ) slider { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-below.png" ) , url ( "assets/slider-horz-scale-has-marks-below@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-bottom : -14 px ; background-position : bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-bottom : -11 px ; }
scale . horizontal . marks-after : not ( . marks-before ) slider : hover { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-below-hover.png" ) , url ( "assets/slider-horz-scale-has-marks-below-hover@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-bottom : -14 px ; background-position : bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-bottom : -11 px ; }
scale . horizontal . marks-after : not ( . marks-before ) slider : active { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-below-active.png" ) , url ( "assets/slider-horz-scale-has-marks-below-active@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-bottom : -14 px ; background-position : bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-bottom : -11 px ; }
scale . horizontal . marks-after : not ( . marks-before ) slider : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-below-insensitive.png" ) , url ( "assets/slider-horz-scale-has-marks-below-insensitive@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-bottom : -14 px ; background-position : bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-bottom : -11 px ; }
scale . horizontal . marks-after : not ( . marks-before ) slider : backdrop { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-below-backdrop.png" ) , url ( "assets/slider-horz-scale-has-marks-below-backdrop@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-bottom : -14 px ; background-position : bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-bottom : -11 px ; }
scale . horizontal . marks-after : not ( . marks-before ) slider : backdrop : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-below-backdrop-insensitive.png" ) , url ( "assets/slider-horz-scale-has-marks-below-backdrop-insensitive@2.png" ) ) ; min-height : 26 px ; min-width : 22 px ; margin-bottom : -14 px ; background-position : bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . horizontal . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-bottom : -11 px ; }
scale . vertical . marks-before : not ( . marks-after ) slider { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-above.png" ) , url ( "assets/slider-vert-scale-has-marks-above@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-left : -14 px ; background-position : left bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-left : -11 px ; }
scale . vertical . marks-before : not ( . marks-after ) slider : hover { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-above-hover.png" ) , url ( "assets/slider-vert-scale-has-marks-above-hover@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-left : -14 px ; background-position : left bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-left : -11 px ; }
scale . vertical . marks-before : not ( . marks-after ) slider : active { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-above-active.png" ) , url ( "assets/slider-vert-scale-has-marks-above-active@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-left : -14 px ; background-position : left bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-left : -11 px ; }
scale . vertical . marks-before : not ( . marks-after ) slider : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-above-insensitive.png" ) , url ( "assets/slider-vert-scale-has-marks-above-insensitive@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-left : -14 px ; background-position : left bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-left : -11 px ; }
scale . vertical . marks-before : not ( . marks-after ) slider : backdrop { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-above-backdrop.png" ) , url ( "assets/slider-vert-scale-has-marks-above-backdrop@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-left : -14 px ; background-position : left bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-left : -11 px ; }
scale . vertical . marks-before : not ( . marks-after ) slider : backdrop : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-above-backdrop-insensitive.png" ) , url ( "assets/slider-vert-scale-has-marks-above-backdrop-insensitive@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-left : -14 px ; background-position : left bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-before : not ( . marks-after ) . fine-tune slider { margin : -7 px ; margin-left : -11 px ; }
scale . vertical . marks-after : not ( . marks-before ) slider { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-below.png" ) , url ( "assets/slider-vert-scale-has-marks-below@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-right : -14 px ; background-position : right bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-right : -11 px ; }
scale . vertical . marks-after : not ( . marks-before ) slider : hover { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-below-hover.png" ) , url ( "assets/slider-vert-scale-has-marks-below-hover@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-right : -14 px ; background-position : right bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-right : -11 px ; }
scale . vertical . marks-after : not ( . marks-before ) slider : active { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-below-active.png" ) , url ( "assets/slider-vert-scale-has-marks-below-active@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-right : -14 px ; background-position : right bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-right : -11 px ; }
scale . vertical . marks-after : not ( . marks-before ) slider : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-below-insensitive.png" ) , url ( "assets/slider-vert-scale-has-marks-below-insensitive@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-right : -14 px ; background-position : right bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-right : -11 px ; }
scale . vertical . marks-after : not ( . marks-before ) slider : backdrop { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-below-backdrop.png" ) , url ( "assets/slider-vert-scale-has-marks-below-backdrop@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-right : -14 px ; background-position : right bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-right : -11 px ; }
scale . vertical . marks-after : not ( . marks-before ) slider : backdrop : disabled { margin : -10 px ; border-style : none ; border-radius : 0 ; background-color : transparent ; background-image : - gtk-scaled ( url ( "assets/slider-vert-scale-has-marks-below-backdrop-insensitive.png" ) , url ( "assets/slider-vert-scale-has-marks-below-backdrop-insensitive@2.png" ) ) ; min-height : 22 px ; min-width : 26 px ; margin-right : -14 px ; background-position : right bottom ; background-repeat : no-repeat ; box-shadow : none ; }
scale . vertical . marks-after : not ( . marks-before ) . fine-tune slider { margin : -7 px ; margin-right : -11 px ; }
scale . color { min-height : 0 ; min-width : 0 ; }
scale . color trough { background-image : image ( #b6b6b3 ) ; background-repeat : no-repeat ; }
scale . color . horizontal { padding : 0 0 15 px 0 ; }
scale . color . horizontal trough { padding-bottom : 4 px ; background-position : 0 -3 px ; border-top-left-radius : 0 ; border-top-right-radius : 0 ; }
scale . color . horizontal slider : dir ( ltr ) : hover , scale . color . horizontal slider : dir ( ltr ) : backdrop , scale . color . horizontal slider : dir ( ltr ) : disabled , scale . color . horizontal slider : dir ( ltr ) : backdrop : disabled , scale . color . horizontal slider : dir ( ltr ) , scale . color . horizontal slider : dir ( rtl ) : hover , scale . color . horizontal slider : dir ( rtl ) : backdrop , scale . color . horizontal slider : dir ( rtl ) : disabled , scale . color . horizontal slider : dir ( rtl ) : backdrop : disabled , scale . color . horizontal slider : dir ( rtl ) { margin-bottom : -15 px ; margin-top : 6 px ; }
scale . color . vertical : dir ( ltr ) { padding : 0 0 0 15 px ; }
scale . color . vertical : dir ( ltr ) trough { padding-left : 4 px ; background-position : 3 px 0 ; border-bottom-right-radius : 0 ; border-top-right-radius : 0 ; }
scale . color . vertical : dir ( ltr ) slider : hover , scale . color . vertical : dir ( ltr ) slider : backdrop , scale . color . vertical : dir ( ltr ) slider : disabled , scale . color . vertical : dir ( ltr ) slider : backdrop : disabled , scale . color . vertical : dir ( ltr ) slider { margin-left : -15 px ; margin-right : 6 px ; }
scale . color . vertical : dir ( rtl ) { padding : 0 15 px 0 0 ; }
scale . color . vertical : dir ( rtl ) trough { padding-right : 4 px ; background-position : -3 px 0 ; border-bottom-left-radius : 0 ; border-top-left-radius : 0 ; }
scale . color . vertical : dir ( rtl ) slider : hover , scale . color . vertical : dir ( rtl ) slider : backdrop , scale . color . vertical : dir ( rtl ) slider : disabled , scale . color . vertical : dir ( rtl ) slider : backdrop : disabled , scale . color . vertical : dir ( rtl ) slider { margin-right : -15 px ; margin-left : 6 px ; }
scale . color . fine-tune . horizontal : dir ( ltr ) , scale . color . fine-tune . horizontal : dir ( rtl ) { padding : 0 0 12 px 0 ; }
scale . color . fine-tune . horizontal : dir ( ltr ) trough , scale . color . fine-tune . horizontal : dir ( rtl ) trough { padding-bottom : 7 px ; background-position : 0 -6 px ; }
scale . color . fine-tune . horizontal : dir ( ltr ) slider , scale . color . fine-tune . horizontal : dir ( rtl ) slider { margin-bottom : -15 px ; margin-top : 6 px ; }
scale . color . fine-tune . vertical : dir ( ltr ) { padding : 0 0 0 12 px ; }
scale . color . fine-tune . vertical : dir ( ltr ) trough { padding-left : 7 px ; background-position : 6 px 0 ; }
scale . color . fine-tune . vertical : dir ( ltr ) slider { margin-left : -15 px ; margin-right : 6 px ; }
scale . color . fine-tune . vertical : dir ( rtl ) { padding : 0 12 px 0 0 ; }
scale . color . fine-tune . vertical : dir ( rtl ) trough { padding-right : 7 px ; background-position : -6 px 0 ; }
scale . color . fine-tune . vertical : dir ( rtl ) slider { margin-right : -15 px ; margin-left : 6 px ; }
/***************** Progress bars * */
progressbar { font-size : smaller ; color : rgba ( 46 , 52 , 54 , 0.4 ) ; }
progressbar . horizontal trough , progressbar . horizontal progress { min-height : 2 px ; }
progressbar . vertical trough , progressbar . vertical progress { min-width : 2 px ; }
progressbar . horizontal progress { margin : 0 -1 px ; }
progressbar . vertical progress { margin : -1 px 0 ; }
progressbar : backdrop { box-shadow : none ; transition : 200 ms ease-out ; }
progressbar progress { border-radius : 1.5 px ; }
progressbar progress . left { border-top-left-radius : 2 px ; border-bottom-left-radius : 2 px ; }
progressbar progress . right { border-top-right-radius : 2 px ; border-bottom-right-radius : 2 px ; }
progressbar progress . top { border-top-right-radius : 2 px ; border-top-left-radius : 2 px ; }
progressbar progress . bottom { border-bottom-right-radius : 2 px ; border-bottom-left-radius : 2 px ; }
progressbar . osd { min-width : 3 px ; min-height : 3 px ; background-color : transparent ; }
progressbar . osd trough { border-style : none ; border-radius : 0 ; background-color : transparent ; box-shadow : none ; }
progressbar . osd progress { border-style : none ; border-radius : 0 ; }
progressbar trough . empty progress { all : unset ; }
/************* Level Bar * */
2017-08-12 15:13:11 +00:00
levelbar . horizontal block { min-height : 1 px ; }
levelbar . horizontal . discrete block { margin : 0 1 px ; min-width : 32 px ; }
2017-05-03 15:43:45 +00:00
2017-08-11 14:25:40 +00:00
levelbar . vertical block { min-width : 1 px ; }
2017-05-03 15:43:45 +00:00
2017-08-12 15:13:11 +00:00
levelbar . vertical . discrete block { margin : 1 px 0 ; min-height : 32 px ; }
2017-05-03 15:43:45 +00:00
levelbar : backdrop { transition : 200 ms ease-out ; }
levelbar trough { border : 1 px solid ; padding : 2 px ; border-radius : 3 px ; color : black ; border-color : #b6b6b3 ; background-color : #ffffff ; box-shadow : inset 0 0 0 1 px rgba ( 74 , 144 , 217 , 0 ) ; }
levelbar trough : backdrop { color : #323232 ; border-color : #c0c0bd ; background-color : #fcfcfc ; box-shadow : none ; }
levelbar block { border : 1 px solid ; border-radius : 1 px ; }
levelbar block . low { border-color : #8f4700 ; background-color : #f57900 ; }
levelbar block . low : backdrop { border-color : #f57900 ; }
levelbar block . high , levelbar block : not ( . empty ) { border-color : #215d9c ; background-color : #4a90d9 ; }
levelbar block . high : backdrop , levelbar block : not ( . empty ) : backdrop { border-color : #4a90d9 ; }
levelbar block . full { border-color : #40760c ; background-color : #73d216 ; }
levelbar block . full : backdrop { border-color : #73d216 ; }
levelbar block . empty { background-color : transparent ; border-color : rgba ( 46 , 52 , 54 , 0.2 ) ; }
levelbar block . empty : backdrop { border-color : rgba ( 139 , 142 , 143 , 0.15 ) ; }
/**************** Print dialog * */
2017-10-25 07:34:52 +00:00
printdialog drawing { color : #2e3436 ; background : white ; border : none ; padding : 0 ; }
2017-05-03 15:43:45 +00:00
2017-10-25 07:34:52 +00:00
printdialog drawing : backdrop { color : #8b8e8f ; border-color : #c0c0bd ; }
printdialog drawing paper { border : 1 px solid #b6b6b3 ; }
2017-05-03 15:43:45 +00:00
printdialog . dialog-action-box { margin : 12 px ; }
/********** Frames * */
frame , . frame { box-shadow : none ; margin : 0 ; padding : 0 ; border-radius : 0 ; border : 1 px solid #b6b6b3 ; }
frame . flat , . frame . flat { border-style : none ; }
frame : backdrop , . frame : backdrop { border-color : #c0c0bd ; }
actionbar > revealer > box { padding : 6 px ; border-top : 1 px solid #b6b6b3 ; }
actionbar > revealer > box : backdrop { border-color : #c0c0bd ; }
scrolledwindow viewport . frame { border-style : none ; }
scrolledwindow overshoot . top { background-image : radial-gradient ( farthest - side at top , #9d9d99 85 % , rgba ( 157 , 157 , 153 , 0 ) ) , radial-gradient ( farthest - side at top , rgba ( 46 , 52 , 54 , 0.07 ) , rgba ( 46 , 52 , 54 , 0 ) ) ; background-size : 100 % 3 % , 100 % 50 % ; background-repeat : no-repeat ; background-position : top ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow overshoot . top : backdrop { background-image : radial-gradient ( farthest - side at top , #c0c0bd 85 % , rgba ( 192 , 192 , 189 , 0 ) ) ; background-size : 100 % 3 % ; background-repeat : no-repeat ; background-position : top ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow overshoot . bottom { background-image : radial-gradient ( farthest - side at bottom , #9d9d99 85 % , rgba ( 157 , 157 , 153 , 0 ) ) , radial-gradient ( farthest - side at bottom , rgba ( 46 , 52 , 54 , 0.07 ) , rgba ( 46 , 52 , 54 , 0 ) ) ; background-size : 100 % 3 % , 100 % 50 % ; background-repeat : no-repeat ; background-position : bottom ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow overshoot . bottom : backdrop { background-image : radial-gradient ( farthest - side at bottom , #c0c0bd 85 % , rgba ( 192 , 192 , 189 , 0 ) ) ; background-size : 100 % 3 % ; background-repeat : no-repeat ; background-position : bottom ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow overshoot . left { background-image : radial-gradient ( farthest - side at left , #9d9d99 85 % , rgba ( 157 , 157 , 153 , 0 ) ) , radial-gradient ( farthest - side at left , rgba ( 46 , 52 , 54 , 0.07 ) , rgba ( 46 , 52 , 54 , 0 ) ) ; background-size : 3 % 100 % , 50 % 100 % ; background-repeat : no-repeat ; background-position : left ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow overshoot . left : backdrop { background-image : radial-gradient ( farthest - side at left , #c0c0bd 85 % , rgba ( 192 , 192 , 189 , 0 ) ) ; background-size : 3 % 100 % ; background-repeat : no-repeat ; background-position : left ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow overshoot . right { background-image : radial-gradient ( farthest - side at right , #9d9d99 85 % , rgba ( 157 , 157 , 153 , 0 ) ) , radial-gradient ( farthest - side at right , rgba ( 46 , 52 , 54 , 0.07 ) , rgba ( 46 , 52 , 54 , 0 ) ) ; background-size : 3 % 100 % , 50 % 100 % ; background-repeat : no-repeat ; background-position : right ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow overshoot . right : backdrop { background-image : radial-gradient ( farthest - side at right , #c0c0bd 85 % , rgba ( 192 , 192 , 189 , 0 ) ) ; background-size : 3 % 100 % ; background-repeat : no-repeat ; background-position : right ; background-color : transparent ; border : none ; box-shadow : none ; }
scrolledwindow undershoot . top { background-color : transparent ; background-image : linear-gradient ( to left , rgba ( 255 , 255 , 255 , 0.2 ) 50 % , rgba ( 0 , 0 , 0 , 0.2 ) 50 % ) ; padding-top : 1 px ; background-size : 10 px 1 px ; background-repeat : repeat-x ; background-origin : content-box ; background-position : center top ; border : none ; box-shadow : none ; }
scrolledwindow undershoot . bottom { background-color : transparent ; background-image : linear-gradient ( to left , rgba ( 255 , 255 , 255 , 0.2 ) 50 % , rgba ( 0 , 0 , 0 , 0.2 ) 50 % ) ; padding-bottom : 1 px ; background-size : 10 px 1 px ; background-repeat : repeat-x ; background-origin : content-box ; background-position : center bottom ; border : none ; box-shadow : none ; }
scrolledwindow undershoot . left { background-color : transparent ; background-image : linear-gradient ( to top , rgba ( 255 , 255 , 255 , 0.2 ) 50 % , rgba ( 0 , 0 , 0 , 0.2 ) 50 % ) ; padding-left : 1 px ; background-size : 1 px 10 px ; background-repeat : repeat-y ; background-origin : content-box ; background-position : left center ; border : none ; box-shadow : none ; }
scrolledwindow undershoot . right { background-color : transparent ; background-image : linear-gradient ( to top , rgba ( 255 , 255 , 255 , 0.2 ) 50 % , rgba ( 0 , 0 , 0 , 0.2 ) 50 % ) ; padding-right : 1 px ; background-size : 1 px 10 px ; background-repeat : repeat-y ; background-origin : content-box ; background-position : right center ; border : none ; box-shadow : none ; }
scrolledwindow junction { border-color : transparent ; border-image : linear-gradient ( to bottom , #b6b6b3 1 px , transparent 1 px ) 0 0 0 1 / 0 1 px stretch ; background-color : #c3c4c4 ; }
scrolledwindow junction : dir ( rtl ) { border-image-slice : 0 1 0 0 ; }
scrolledwindow junction : backdrop { border-image-source : linear-gradient ( to bottom , #c0c0bd 1 px , transparent 1 px ) ; background-color : #e1e1df ; transition : 200 ms ease-out ; }
separator { background : rgba ( 0 , 0 , 0 , 0.1 ) ; min-width : 1 px ; min-height : 1 px ; }
/********* Lists * */
list { color : black ; background-color : #ffffff ; border-color : #b6b6b3 ; }
list : backdrop { background-color : #fcfcfc ; border-color : #c0c0bd ; }
list row { padding : 2 px ; }
row { transition : all 150 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; }
row : hover { transition : none ; }
row : backdrop { transition : 200 ms ease-out ; }
row . activatable . has-open-popup , row . activatable : hover { background-color : rgba ( 46 , 52 , 54 , 0.05 ) ; }
row . activatable : active { box-shadow : inset 0 2 px 2 px -2 px rgba ( 0 , 0 , 0 , 0.2 ) ; }
row . activatable : backdrop : hover { background-color : transparent ; }
row . activatable : selected : active { box-shadow : inset 0 2 px 3 px -1 px rgba ( 0 , 0 , 0 , 0.5 ) ; }
row . activatable : selected . has-open-popup , row . activatable : selected : hover { background-color : #4787c9 ; }
row . activatable : selected : backdrop { background-color : #4a90d9 ; }
/********************* App Notifications * */
. app-notification , . app-notification . frame { padding : 10 px ; border-radius : 0 0 5 px 5 px ; background-color : rgba ( 28 , 31 , 32 , 0.7 ) ; background-image : linear-gradient ( to bottom , rgba ( 0 , 0 , 0 , 0.2 ) , transparent 2 px ) ; background-clip : padding-box ; }
. app-notification : backdrop , . app-notification . frame : backdrop { background-image : none ; transition : 200 ms ease-out ; }
. app-notification border , . app-notification . frame border { border : none ; }
/************* Expanders * */
2018-01-01 19:53:43 +00:00
expander title > arrow { min-width : 16 px ; min-height : 16 px ; - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic" ) ; }
2017-05-03 15:43:45 +00:00
2018-01-01 19:53:43 +00:00
expander title > arrow : dir ( rtl ) { - gtk-icon-source : - gtk-icontheme ( "pan-end-symbolic-rtl" ) ; }
2017-05-03 15:43:45 +00:00
2018-03-29 20:23:50 +00:00
expander title > arrow : disabled { color : #8b8e8f ; }
expander title > arrow : disabled : backdrop { color : #c3c3c0 ; }
2018-01-01 19:53:43 +00:00
expander title > arrow : checked { - gtk-icon-source : - gtk-icontheme ( "pan-down-symbolic" ) ; }
2017-05-03 15:43:45 +00:00
2018-01-01 21:21:52 +00:00
expander title : hover > arrow { color : #748489 ; }
2017-11-05 04:08:18 +00:00
2017-05-03 15:43:45 +00:00
/************ Calendar * */
calendar { color : black ; border : 1 px solid #b6b6b3 ; }
calendar : selected { border-radius : 3 px ; }
calendar . header { border-bottom-color : rgba ( 0 , 0 , 0 , 0.1 ) ; }
calendar . header : backdrop { border-bottom-color : rgba ( 0 , 0 , 0 , 0.1 ) ; }
calendar . button { color : rgba ( 46 , 52 , 54 , 0.45 ) ; }
calendar . button : hover { color : #2e3436 ; }
calendar . button : backdrop { color : rgba ( 139 , 142 , 143 , 0.45 ) ; }
calendar . button : disabled { color : rgba ( 139 , 142 , 143 , 0.45 ) ; }
calendar . highlight { color : #8b8e8f ; }
calendar . highlight : backdrop { color : #c3c3c0 ; }
calendar : backdrop { color : #323232 ; border-color : #c0c0bd ; }
calendar : indeterminate { color : alpha ( currentColor , 0.1 ) ; }
/*********** Dialogs * */
messagedialog . titlebar { min-height : 20 px ; background-image : none ; background-color : #e8e8e7 ; border-style : none ; border-top-left-radius : 7 px ; border-top-right-radius : 7 px ; }
messagedialog . csd . background { border-bottom-left-radius : 9 px ; border-bottom-right-radius : 9 px ; }
messagedialog . csd . dialog-action-area button { padding : 10 px 14 px ; border-radius : 0 ; border-left-style : solid ; border-right-style : none ; border-bottom-style : none ; }
messagedialog . csd . dialog-action-area button : first-child { border-left-style : none ; border-bottom-left-radius : 7 px ; - gtk-outline-bottom-left-radius : 5 px ; }
messagedialog . csd . dialog-action-area button : last-child { border-bottom-right-radius : 7 px ; - gtk-outline-bottom-right-radius : 5 px ; }
filechooser . dialog-action-box { border-top : 1 px solid #b6b6b3 ; }
filechooser . dialog-action-box : backdrop { border-top-color : #c0c0bd ; }
filechooser # pathbarbox { border-bottom : 1 px solid #e8e8e7 ; }
filechooserbutton : drop ( active ) { box-shadow : none ; border-color : transparent ; }
/*********** Sidebar * */
. sidebar { border-style : none ; background-color : #f4f4f3 ; }
stacksidebar . sidebar : dir ( ltr ) list , stacksidebar . sidebar . left list , stacksidebar . sidebar . left : dir ( rtl ) list , . sidebar : dir ( ltr ) , . sidebar . left , . sidebar . left : dir ( rtl ) { border-right : 1 px solid #b6b6b3 ; border-left-style : none ; }
stacksidebar . sidebar : dir ( rtl ) list . sidebar : dir ( rtl ) , stacksidebar . sidebar . right list . sidebar : dir ( rtl ) , . sidebar . right { border-left : 1 px solid #b6b6b3 ; border-right-style : none ; }
. sidebar : backdrop { background-color : #f2f2f2 ; border-color : #c0c0bd ; transition : 200 ms ease-out ; }
. sidebar list { background-color : transparent ; }
paned . sidebar . left , paned . sidebar . right , paned . sidebar . left : dir ( rtl ) , paned . sidebar : dir ( rtl ) , paned . sidebar : dir ( ltr ) , paned . sidebar { border-style : none ; }
stacksidebar row { padding : 10 px 4 px ; }
stacksidebar row > label { padding-left : 6 px ; padding-right : 6 px ; }
stacksidebar row . needs-attention > label { background-size : 6 px 6 px , 0 0 ; }
/**************** File chooser * */
2017-08-23 20:26:06 +00:00
row image . sidebar-icon { opacity : 0.7 ; }
2017-05-03 15:43:45 +00:00
placessidebar > viewport . frame { border-style : none ; }
placessidebar row { min-height : 36 px ; padding : 0 px ; }
placessidebar row > revealer { padding : 0 14 px ; }
placessidebar row : selected { color : #ffffff ; }
placessidebar row : disabled { color : #8b8e8f ; }
placessidebar row : backdrop { color : #8b8e8f ; }
placessidebar row : backdrop : selected { color : #fcfcfc ; }
placessidebar row : backdrop : disabled { color : #c3c3c0 ; }
placessidebar row image . sidebar-icon : dir ( ltr ) { padding-right : 8 px ; }
placessidebar row image . sidebar-icon : dir ( rtl ) { padding-left : 8 px ; }
placessidebar row label . sidebar-label : dir ( ltr ) { padding-right : 2 px ; }
placessidebar row label . sidebar-label : dir ( rtl ) { padding-left : 2 px ; }
button . sidebar-button { min-height : 26 px ; min-width : 26 px ; margin-top : 3 px ; margin-bottom : 3 px ; padding : 0 ; border-radius : 100 % ; - gtk-outline-radius : 100 % ; }
button . sidebar-button : not ( : hover ) : not ( : active ) > image , button . sidebar-button : backdrop > image { opacity : 0.7 ; }
placessidebar row : selected : active { box-shadow : none ; }
placessidebar row . sidebar-placeholder-row { padding : 0 8 px ; min-height : 2 px ; background-image : image ( #4e9a06 ) ; background-clip : content-box ; }
placessidebar row . sidebar-new-bookmark-row { color : #4a90d9 ; }
placessidebar row : drop ( active ) : not ( : disabled ) { color : #4e9a06 ; box-shadow : inset 0 1 px #4e9a06 , inset 0 -1 px #4e9a06 ; }
placessidebar row : drop ( active ) : not ( : disabled ) : selected { color : #ffffff ; background-color : #4e9a06 ; }
placesview . server-list-button > image { transition : 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; - gtk-icon-transform : rotate ( 0 turn ) ; }
placesview . server-list-button : checked > image { transition : 200 ms cubic-bezier ( 0.25 , 0.46 , 0.45 , 0.94 ) ; - gtk-icon-transform : rotate ( -0.5 turn ) ; }
placesview row . activatable : hover { background-color : transparent ; }
placesview > actionbar > revealer > box > label { padding-left : 8 px ; padding-right : 8 px ; }
/********* Paned * */
paned > separator { min-width : 1 px ; min-height : 1 px ; - gtk-icon-source : none ; border-style : none ; background-color : transparent ; background-image : image ( #b6b6b3 ) ; background-size : 1 px 1 px ; }
paned > separator : selected { background-image : image ( #4a90d9 ) ; }
paned > separator : backdrop { background-image : image ( #c0c0bd ) ; }
paned > separator . wide { min-width : 5 px ; min-height : 5 px ; background-color : #e8e8e7 ; background-image : image ( #b6b6b3 ) , image ( #b6b6b3 ) ; background-size : 1 px 1 px , 1 px 1 px ; }
paned > separator . wide : backdrop { background-color : #e8e8e7 ; background-image : image ( #c0c0bd ) , image ( #c0c0bd ) ; }
paned . horizontal > separator { background-repeat : repeat-y ; }
paned . horizontal > separator : dir ( ltr ) { margin : 0 -8 px 0 0 ; padding : 0 8 px 0 0 ; background-position : left ; }
paned . horizontal > separator : dir ( rtl ) { margin : 0 0 0 -8 px ; padding : 0 0 0 8 px ; background-position : right ; }
paned . horizontal > separator . wide { margin : 0 ; padding : 0 ; background-repeat : repeat-y , repeat-y ; background-position : left , right ; }
paned . vertical > separator { margin : 0 0 -8 px 0 ; padding : 0 0 8 px 0 ; background-repeat : repeat-x ; background-position : top ; }
paned . vertical > separator . wide { margin : 0 ; padding : 0 ; background-repeat : repeat-x , repeat-x ; background-position : bottom , top ; }
2018-03-22 20:58:31 +00:00
/************** GtkVideo * */
video { background : black ; }
video image . osd { min-width : 64 px ; min-height : 64 px ; border-radius : 32 px ; }
2017-05-03 15:43:45 +00:00
/************** GtkInfoBar * */
infobar { border-style : none ; }
infobar . info , infobar . question , infobar . warning , infobar . error { text-shadow : 0 1 px #2a76c6 ; }
infobar . info : backdrop , infobar . info , infobar . question : backdrop , infobar . question , infobar . warning : backdrop , infobar . warning , infobar . error : backdrop , infobar . error { background-color : #4a90d9 ; border-color : #2a76c6 ; }
infobar . info : backdrop label , infobar . info : backdrop , infobar . info label , infobar . info , infobar . question : backdrop label , infobar . question : backdrop , infobar . question label , infobar . question , infobar . warning : backdrop label , infobar . warning : backdrop , infobar . warning label , infobar . warning , infobar . error : backdrop label , infobar . error : backdrop , infobar . error label , infobar . error { color : #ffffff ; }
infobar . info : backdrop , infobar . question : backdrop , infobar . warning : backdrop , infobar . error : backdrop { text-shadow : none ; }
infobar . info button , infobar . question button , infobar . warning button , infobar . error button { color : #ffffff ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; border-bottom-color : #184472 ; background-image : linear-gradient ( to bottom , #4a90d9 , #3986d5 60 % , #2a76c6 ) ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; }
infobar . info button : hover , infobar . question button : hover , infobar . warning button : hover , infobar . error button : hover { color : #ffffff ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; border-bottom-color : #184472 ; text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.495529 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.495529 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) ; background-image : linear-gradient ( to bottom , #63a0de , #4a90d9 60 % , #3986d5 ) ; }
infobar . info button : active , infobar . info button : checked , infobar . question button : active , infobar . question button : checked , infobar . warning button : active , infobar . warning button : checked , infobar . error button : active , infobar . error button : checked { color : #ffffff ; outline-color : rgba ( 255 , 255 , 255 , 0.3 ) ; border-color : #215d9c ; background-image : image ( #3180d4 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; text-shadow : none ; - gtk-icon-shadow : none ; }
infobar . info button : disabled , infobar . question button : disabled , infobar . warning button : disabled , infobar . error button : disabled { border-color : #215d9c ; background-image : image ( #65a1df ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
infobar . info button : disabled label , infobar . info button : disabled , infobar . question button : disabled label , infobar . question button : disabled , infobar . warning button : disabled label , infobar . warning button : disabled , infobar . error button : disabled label , infobar . error button : disabled { color : #b2d0ef ; }
infobar . info button : backdrop , infobar . question button : backdrop , infobar . warning button : backdrop , infobar . error button : backdrop { border-color : #4a90d9 ; background-image : image ( #4a90d9 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #215d9c ; }
infobar . info button : backdrop label , infobar . info button : backdrop , infobar . question button : backdrop label , infobar . question button : backdrop , infobar . warning button : backdrop label , infobar . warning button : backdrop , infobar . error button : backdrop label , infobar . error button : backdrop { color : #dbe9f7 ; }
infobar . info button : backdrop : disabled , infobar . question button : backdrop : disabled , infobar . warning button : backdrop : disabled , infobar . error button : backdrop : disabled { border-color : #65a1df ; background-image : image ( #65a1df ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; border-color : #215d9c ; }
infobar . info button : backdrop : disabled label , infobar . info button : backdrop : disabled , infobar . question button : backdrop : disabled label , infobar . question button : backdrop : disabled , infobar . warning button : backdrop : disabled label , infobar . warning button : backdrop : disabled , infobar . error button : backdrop : disabled label , infobar . error button : backdrop : disabled { color : #9bc2ea ; }
infobar . info selection , infobar . question selection , infobar . warning selection , infobar . error selection { background-color : #2a76c6 ; }
/************ Tooltips * */
2018-01-12 21:31:11 +00:00
tooltip { padding : 4 px ; border-radius : 5 px ; box-shadow : none ; text-shadow : 0 1 px black ; }
2017-05-03 15:43:45 +00:00
2018-01-13 06:39:54 +00:00
tooltip . background { background-color : rgba ( 0 , 0 , 0 , 0.8 ) ; background-clip : padding-box ; border : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ; }
2017-05-03 15:43:45 +00:00
tooltip decoration { background-color : transparent ; }
2018-01-12 21:31:11 +00:00
tooltip * { background-color : transparent ; color : white ; }
2017-05-03 15:43:45 +00:00
/***************** Color Chooser * */
colorswatch : drop ( active ) , colorswatch { border-style : none ; }
colorswatch . top { border-top-left-radius : 5.5 px ; border-top-right-radius : 5.5 px ; }
colorswatch . top overlay { border-top-left-radius : 5 px ; border-top-right-radius : 5 px ; }
colorswatch . bottom { border-bottom-left-radius : 5.5 px ; border-bottom-right-radius : 5.5 px ; }
colorswatch . bottom overlay { border-bottom-left-radius : 5 px ; border-bottom-right-radius : 5 px ; }
colorswatch . left , colorswatch : first-child : not ( . top ) { border-top-left-radius : 5.5 px ; border-bottom-left-radius : 5.5 px ; }
colorswatch . left overlay , colorswatch : first-child : not ( . top ) overlay { border-top-left-radius : 5 px ; border-bottom-left-radius : 5 px ; }
colorswatch . right , colorswatch : last-child : not ( . bottom ) { border-top-right-radius : 5.5 px ; border-bottom-right-radius : 5.5 px ; }
colorswatch . right overlay , colorswatch : last-child : not ( . bottom ) overlay { border-top-right-radius : 5 px ; border-bottom-right-radius : 5 px ; }
2017-09-16 16:02:24 +00:00
colorswatch . dark { outline-color : rgba ( 255 , 255 , 255 , 0.6 ) ; }
Adwaita: dark: Make colorswatch.light tick visible
It used $text_color unconditionally, but in :dark, text is white, so we
overlaid a white tick on any light colours, all the way to white itself.
Using these named colours doesn’t make practical or semantic sense.
Instead, use white/black over dark/light swatches, as in HC, so all
variant–swatch combos work. Light looks the same, & :dark works now.
For backdrop, use alpha 0.5, unlike 0.7 in HC, as that seemed excessive
& different from the current effect. 0.5 is almost identical to how
$backdrop_fg_colour is a 50% mix of $fg_color, & matches backdrop text.
https://bugzilla.gnome.org/show_bug.cgi?id=787531
2017-09-16 14:46:50 +00:00
colorswatch . dark overlay { color : white ; }
2017-05-03 15:43:45 +00:00
colorswatch . dark overlay : hover { border-color : rgba ( 0 , 0 , 0 , 0.8 ) ; }
Adwaita: dark: Make colorswatch.light tick visible
It used $text_color unconditionally, but in :dark, text is white, so we
overlaid a white tick on any light colours, all the way to white itself.
Using these named colours doesn’t make practical or semantic sense.
Instead, use white/black over dark/light swatches, as in HC, so all
variant–swatch combos work. Light looks the same, & :dark works now.
For backdrop, use alpha 0.5, unlike 0.7 in HC, as that seemed excessive
& different from the current effect. 0.5 is almost identical to how
$backdrop_fg_colour is a 50% mix of $fg_color, & matches backdrop text.
https://bugzilla.gnome.org/show_bug.cgi?id=787531
2017-09-16 14:46:50 +00:00
colorswatch . dark overlay : backdrop { color : rgba ( 255 , 255 , 255 , 0.5 ) ; }
2017-05-03 15:43:45 +00:00
2017-09-16 16:02:24 +00:00
colorswatch . light { outline-color : rgba ( 0 , 0 , 0 , 0.6 ) ; }
2017-05-03 15:43:45 +00:00
colorswatch . light overlay { color : black ; }
colorswatch . light overlay : hover { border-color : rgba ( 0 , 0 , 0 , 0.5 ) ; }
Adwaita: dark: Make colorswatch.light tick visible
It used $text_color unconditionally, but in :dark, text is white, so we
overlaid a white tick on any light colours, all the way to white itself.
Using these named colours doesn’t make practical or semantic sense.
Instead, use white/black over dark/light swatches, as in HC, so all
variant–swatch combos work. Light looks the same, & :dark works now.
For backdrop, use alpha 0.5, unlike 0.7 in HC, as that seemed excessive
& different from the current effect. 0.5 is almost identical to how
$backdrop_fg_colour is a 50% mix of $fg_color, & matches backdrop text.
https://bugzilla.gnome.org/show_bug.cgi?id=787531
2017-09-16 14:46:50 +00:00
colorswatch . light overlay : backdrop { color : rgba ( 0 , 0 , 0 , 0.5 ) ; }
2017-05-03 15:43:45 +00:00
colorswatch : drop ( active ) { box-shadow : none ; }
colorswatch : drop ( active ) . light overlay { border-color : #4e9a06 ; box-shadow : inset 0 0 0 2 px #3d7805 , inset 0 0 0 1 px #4e9a06 ; }
colorswatch : drop ( active ) . dark overlay { border-color : #4e9a06 ; box-shadow : inset 0 0 0 2 px rgba ( 0 , 0 , 0 , 0.3 ) , inset 0 0 0 1 px #4e9a06 ; }
colorswatch overlay { border : 1 px solid rgba ( 0 , 0 , 0 , 0.3 ) ; }
colorswatch overlay : hover { box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.4 ) , inset 0 -1 px rgba ( 0 , 0 , 0 , 0.2 ) ; }
colorswatch overlay : backdrop , colorswatch overlay : backdrop : hover { border-color : rgba ( 0 , 0 , 0 , 0.3 ) ; box-shadow : none ; }
colorswatch # add-color-button { border-radius : 5 px 5 px 0 0 ; }
colorswatch # add-color-button : only-child { border-radius : 5 px ; }
colorswatch # add-color-button overlay { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; background-image : linear-gradient ( to bottom , #e8e8e7 , #dededd 60 % , #cfcfcd ) ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; }
colorswatch # add-color-button overlay : hover { color : #2e3436 ; outline-color : rgba ( 46 , 52 , 54 , 0.3 ) ; border-color : #b6b6b3 ; border-bottom-color : #91918c ; text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; box-shadow : inset 0 1 px white ; background-image : linear-gradient ( to bottom , #f7f7f7 , #e8e8e7 60 % , #dededd ) ; }
colorswatch # add-color-button overlay : backdrop { border-color : #c0c0bd ; background-image : image ( #e8e8e7 ) ; text-shadow : none ; - gtk-icon-shadow : none ; box-shadow : inset 0 1 px rgba ( 255 , 255 , 255 , 0 ) ; }
colorswatch # add-color-button overlay : backdrop label , colorswatch # add-color-button overlay : backdrop { color : #8b8e8f ; }
colorswatch : disabled { opacity : 0.5 ; }
colorswatch : disabled overlay { border-color : rgba ( 0 , 0 , 0 , 0.6 ) ; box-shadow : none ; }
row : selected colorswatch { box-shadow : 0 0 0 2 px #ffffff ; }
colorswatch # editor-color-sample { border-radius : 4 px ; }
colorswatch # editor-color-sample overlay { border-radius : 4.5 px ; }
colorchooser . popover . osd { border-radius : 5 px ; }
/******** Misc * */
. content-view { background-color : #d7d7d5 ; }
. content-view : hover { - gtk-icon-filter : brightness ( 1.2 ) ; }
. content-view : backdrop { background-color : #d7d7d5 ; }
. osd . scale-popup button . flat { border-style : none ; border-radius : 5 px ; }
. scale-popup button : hover { background-color : rgba ( 46 , 52 , 54 , 0.1 ) ; border-radius : 5 px ; }
/********************** Window Decorations * */
decoration { border-radius : 7 px 7 px 0 0 ; border-width : 0 px ; box-shadow : 0 3 px 9 px 1 px rgba ( 0 , 0 , 0 , 0.5 ) , 0 0 0 1 px rgba ( 0 , 0 , 0 , 0.23 ) ; margin : 10 px ; }
decoration : backdrop { box-shadow : 0 3 px 9 px 1 px transparent , 0 2 px 6 px 2 px rgba ( 0 , 0 , 0 , 0.2 ) , 0 0 0 1 px rgba ( 0 , 0 , 0 , 0.18 ) ; transition : 200 ms ease-out ; }
2017-08-18 23:12:23 +00:00
. maximized decoration , . fullscreen decoration , . tiled decoration , . tiled-top decoration , . tiled-left decoration , . tiled-right decoration , . tiled-bottom decoration { border-radius : 0 ; }
2017-05-03 15:43:45 +00:00
. popup decoration { box-shadow : none ; }
. ssd decoration { box-shadow : 0 0 0 1 px rgba ( 0 , 0 , 0 , 0.23 ) ; }
. csd . popup decoration { border-radius : 0 ; box-shadow : 0 1 px 2 px rgba ( 0 , 0 , 0 , 0.2 ) , 0 0 0 1 px rgba ( 0 , 0 , 0 , 0.13 ) ; }
tooltip . csd decoration { border-radius : 5 px ; box-shadow : none ; }
messagedialog . csd decoration { border-radius : 7 px ; box-shadow : 0 1 px 2 px rgba ( 0 , 0 , 0 , 0.2 ) , 0 0 0 1 px rgba ( 0 , 0 , 0 , 0.13 ) ; }
. solid-csd decoration { margin : 0 ; padding : 4 px ; background-color : #b6b6b3 ; border : solid 1 px #b6b6b3 ; border-radius : 0 ; box-shadow : inset 0 0 0 3 px #f4f4f4 , inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; }
. solid-csd decoration : backdrop { box-shadow : inset 0 0 0 3 px #e8e8e7 , inset 0 1 px rgba ( 255 , 255 , 255 , 0.8 ) ; }
button . titlebutton { text-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; - gtk-icon-shadow : 0 1 px rgba ( 255 , 255 , 255 , 0.769231 ) ; }
button . titlebutton : backdrop { - gtk-icon-shadow : none ; }
headerbar . selection-mode button . titlebutton , . titlebar . selection-mode button . titlebutton { text-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; - gtk-icon-shadow : 0 -1 px rgba ( 0 , 0 , 0 , 0.543529 ) ; }
headerbar . selection-mode button . titlebutton : backdrop , . titlebar . selection-mode button . titlebutton : backdrop { - gtk-icon-shadow : none ; }
2017-08-23 20:26:06 +00:00
. view : selected : focus , . view : selected , iconview : selected , . view text : selected , iconview text : selected , textview text : selected , . view text selection : focus , iconview text selection : focus , . view text selection , iconview text selection , textview text selection : focus , textview text selection , flowbox flowboxchild : selected , spinbutton : not ( . vertical ) selection , entry selection , modelbutton . flat : selected , . menuitem . button . flat : selected , treeview . view : selected : focus , treeview . view : selected , row : selected , calendar : selected { background-color : #4a90d9 ; }
2017-05-03 15:43:45 +00:00
2017-08-23 20:26:06 +00:00
row : selected label , label : selected , . selection-mode button . titlebutton , . view : selected : focus , . view : selected , iconview : selected , . view text : selected , iconview text : selected , textview text : selected , . view text selection : focus , iconview text selection : focus , . view text selection , iconview text selection , textview text selection : focus , textview text selection , flowbox flowboxchild : selected , spinbutton : not ( . vertical ) selection , entry selection , modelbutton . flat : selected , . menuitem . button . flat : selected , treeview . view : selected : focus , treeview . view : selected , row : selected , calendar : selected { color : #ffffff ; }
2017-05-03 15:43:45 +00:00
row : selected label : disabled , label : disabled : selected , . selection-mode button . titlebutton : disabled , iconview : disabled : selected : focus , . view : disabled : selected , iconview : disabled : selected , iconview text : disabled : selected : focus , textview text : disabled : selected : focus , . view text : disabled : selected , iconview text : disabled : selected , textview text : disabled : selected , iconview text selection : disabled : focus , . view text selection : disabled , iconview text selection : disabled , textview text selection : disabled , flowbox flowboxchild : disabled : selected , label : disabled selection , spinbutton : not ( . vertical ) selection : disabled , entry selection : disabled , modelbutton . flat : disabled : selected , . menuitem . button . flat : disabled : selected , row : disabled : selected , calendar : disabled : selected { color : #a5c8ec ; }
row : selected label : backdrop , label : backdrop : selected , . selection-mode button . titlebutton : backdrop , iconview : backdrop : selected : focus , . view : backdrop : selected , iconview : backdrop : selected , iconview text : backdrop : selected : focus , textview text : backdrop : selected : focus , . view text : backdrop : selected , iconview text : backdrop : selected , textview text : backdrop : selected , iconview text selection : backdrop : focus , . view text selection : backdrop , iconview text selection : backdrop , textview text selection : backdrop , flowbox flowboxchild : backdrop : selected , label : backdrop selection , spinbutton : not ( . vertical ) selection : backdrop , entry selection : backdrop , modelbutton . flat : backdrop : selected , . menuitem . button . flat : backdrop : selected , row : backdrop : selected , calendar : backdrop : selected { color : #fcfcfc ; }
row : selected label : backdrop : disabled , label : backdrop : disabled : selected , . selection-mode button . titlebutton : backdrop : disabled , . view : backdrop : disabled : selected , iconview : backdrop : disabled : selected , . view text : backdrop : disabled : selected , iconview text : backdrop : disabled : selected , textview text : backdrop : disabled : selected , . view text selection : backdrop : disabled , iconview text selection : backdrop : disabled , textview text selection : backdrop : disabled , flowbox flowboxchild : backdrop : disabled : selected , label : disabled selection : backdrop , label : backdrop selection : disabled , spinbutton : not ( . vertical ) selection : backdrop : disabled , entry selection : backdrop : disabled , modelbutton . flat : backdrop : disabled : selected , . menuitem . button . flat : backdrop : disabled : selected , row : backdrop : disabled : selected , calendar : backdrop : disabled : selected { color : #80b1e4 ; }
. monospace { font-family : monospace ; }
/********************** Touch Copy & Paste * */
cursor-handle { background-color : transparent ; background-image : none ; box-shadow : none ; border-style : none ; }
cursor-handle . top : dir ( ltr ) , cursor-handle . bottom : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/text-select-start.png" ) , url ( "assets/text-select-start@2.png" ) ) ; padding-left : 10 px ; }
cursor-handle . bottom : dir ( ltr ) , cursor-handle . top : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/text-select-end.png" ) , url ( "assets/text-select-end@2.png" ) ) ; padding-right : 10 px ; }
cursor-handle . insertion-cursor : dir ( ltr ) , cursor-handle . insertion-cursor : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above.png" ) , url ( "assets/slider-horz-scale-has-marks-above@2.png" ) ) ; }
cursor-handle . top : hover : dir ( ltr ) , cursor-handle . bottom : hover : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/text-select-start-hover.png" ) , url ( "assets/text-select-start-hover@2.png" ) ) ; padding-left : 10 px ; }
cursor-handle . bottom : hover : dir ( ltr ) , cursor-handle . top : hover : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/text-select-end-hover.png" ) , url ( "assets/text-select-end-hover@2.png" ) ) ; padding-right : 10 px ; }
cursor-handle . insertion-cursor : hover : dir ( ltr ) , cursor-handle . insertion-cursor : hover : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above-hover.png" ) , url ( "assets/slider-horz-scale-has-marks-above-hover@2.png" ) ) ; }
cursor-handle . top : active : dir ( ltr ) , cursor-handle . bottom : active : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/text-select-start-active.png" ) , url ( "assets/text-select-start-active@2.png" ) ) ; padding-left : 10 px ; }
cursor-handle . bottom : active : dir ( ltr ) , cursor-handle . top : active : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/text-select-end-active.png" ) , url ( "assets/text-select-end-active@2.png" ) ) ; padding-right : 10 px ; }
cursor-handle . insertion-cursor : active : dir ( ltr ) , cursor-handle . insertion-cursor : active : dir ( rtl ) { - gtk-icon-source : - gtk-scaled ( url ( "assets/slider-horz-scale-has-marks-above-active.png" ) , url ( "assets/slider-horz-scale-has-marks-above-active@2.png" ) ) ; }
. context-menu { font : initial ; }
2017-10-25 07:34:52 +00:00
shortcuts-section { margin : 20 px ; }
. shortcuts-search-results { margin : 20 px ; border-spacing : 24 px ; }
2017-05-03 15:43:45 +00:00
. keycap { min-width : 20 px ; min-height : 25 px ; margin-top : 2 px ; padding-bottom : 3 px ; padding-left : 6 px ; padding-right : 6 px ; color : #2e3436 ; background-color : #ffffff ; border : 1 px solid ; border-color : #cfcfcd ; border-radius : 5 px ; box-shadow : inset 0 -3 px #ededec ; font-size : smaller ; }
. keycap : backdrop { background-color : #fcfcfc ; color : #8b8e8f ; transition : 200 ms ease-out ; }
: not ( decoration ) : not ( window ) : drop ( active ) : focus , : not ( decoration ) : not ( window ) : drop ( active ) { border-color : #4e9a06 ; box-shadow : inset 0 0 0 1 px #4e9a06 ; caret-color : #4e9a06 ; }
stackswitcher button . text-button { min-width : 100 px ; }
stackswitcher button . circular , stackswitcher button . text-button . circular { min-width : 32 px ; min-height : 32 px ; padding : 0 ; }
2017-09-02 15:56:14 +00:00
/********* Emoji * */
2017-08-11 15:54:15 +00:00
popover . emoji-picker { padding-left : 0 ; padding-right : 0 ; }
2017-09-02 15:54:47 +00:00
button . emoji-section { border-color : transparent ; border-width : 3 px ; border-style : none none solid ; border-radius : 0 ; margin : 2 px 4 px 2 px 4 px ; padding : 3 px 0 0 ; min-width : 32 px ; min-height : 28 px ; /* reset props inherited from the button style */ background : none ; box-shadow : none ; text-shadow : none ; outline-offset : -5 px ; }
2017-08-11 15:54:15 +00:00
2017-09-02 15:56:14 +00:00
button . emoji-section : backdrop : not ( : checked ) { border-color : transparent ; }
2017-08-11 15:54:15 +00:00
button . emoji-section : hover { border-color : #b6b6b3 ; }
button . emoji-section : checked { border-color : #4a90d9 ; }
2017-09-02 15:54:47 +00:00
button . emoji-section label { padding : 0 ; opacity : 0.55 ; }
2017-08-11 15:54:15 +00:00
2017-09-02 15:54:47 +00:00
button . emoji-section : hover label { opacity : 0.775 ; }
2017-08-11 15:54:15 +00:00
2017-09-02 15:54:47 +00:00
button . emoji-section : checked label { opacity : 1 ; }
2017-09-02 15:56:14 +00:00
2017-08-11 15:54:15 +00:00
. emoji { font-size : x-large ; padding : 6 px ; border-radius : 6 px ; }
2017-09-05 00:42:13 +00:00
. emoji : hover { background : #4a90d9 ; }
2017-08-11 15:54:15 +00:00
2017-05-03 15:43:45 +00:00
/* GTK NAMED COLORS ---------------- use responsibly! */
2014-10-18 14:29:19 +00:00
/ *
2014-10-20 13:22:42 +00:00
widget text / foreground color * /
2014-08-28 11:21:14 +00:00
@ define-color theme_fg_color # 2e3436 ;
2014-10-18 14:29:19 +00:00
/ *
2014-10-18 14:57:39 +00:00
text color for entries , views and content in general * /
@ define-color theme_text_color black ;
/ *
2014-10-18 14:29:19 +00:00
widget base background color * /
2015-12-04 17:42:56 +00:00
@ define-color theme_bg_color # e8e8e7 ;
2014-10-18 14:29:19 +00:00
/ *
text widgets and the like base background color * /
2014-09-06 14:02:34 +00:00
@ define-color theme_base_color # ffffff ;
2014-10-18 14:29:19 +00:00
/ *
base background color of selections * /
2014-08-28 11:21:14 +00:00
@ define-color theme_selected_bg_color # 4a90d9 ;
2014-10-18 14:29:19 +00:00
/ *
text / foreground color of selections * /
2014-09-06 14:02:34 +00:00
@ define-color theme_selected_fg_color # ffffff ;
2014-10-18 14:29:19 +00:00
/ *
base background color of insensitive widgets * /
2016-02-24 21:36:14 +00:00
@ define-color insensitive_bg_color # f1f1f1 ;
2014-10-18 14:29:19 +00:00
/ *
text foreground color of insensitive widgets * /
2016-02-24 21:36:14 +00:00
@ define-color insensitive_fg_color # 8b8e8f ;
2014-10-18 14:29:19 +00:00
/ *
insensitive text widgets and the like base background color * /
2014-09-06 14:02:34 +00:00
@ define-color insensitive_base_color # ffffff ;
2014-10-18 14:29:19 +00:00
/ *
widget text / foreground color on backdrop windows * /
2016-02-24 21:36:14 +00:00
@ define-color theme_unfocused_fg_color # 8b8e8f ;
2014-10-18 14:29:19 +00:00
/ *
2014-10-18 14:57:39 +00:00
text color for entries , views and content in general on backdrop windows * /
@ define-color theme_unfocused_text_color black ;
/ *
2014-10-18 14:29:19 +00:00
widget base background color on backdrop windows * /
2015-12-04 17:42:56 +00:00
@ define-color theme_unfocused_bg_color # e8e8e7 ;
2014-10-18 14:29:19 +00:00
/ *
text widgets and the like base background color on backdrop windows * /
2016-03-19 17:55:13 +00:00
@ define-color theme_unfocused_base_color # fcfcfc ;
2014-10-18 14:29:19 +00:00
/ *
base background color of selections on backdrop windows * /
2014-08-28 11:21:14 +00:00
@ define-color theme_unfocused_selected_bg_color # 4a90d9 ;
2014-10-18 14:29:19 +00:00
/ *
text / foreground color of selections on backdrop windows * /
2014-09-06 14:02:34 +00:00
@ define-color theme_unfocused_selected_fg_color # ffffff ;
2014-10-18 14:29:19 +00:00
/ *
2016-07-24 16:04:51 +00:00
insensitive color on backdrop windows * /
@ define-color unfocused_insensitive_color # c3c3c0 ;
/ *
2014-10-18 14:29:19 +00:00
widgets main borders color * /
2016-04-17 16:06:15 +00:00
@ define-color borders # b6b6b3 ;
2014-10-18 14:29:19 +00:00
/ *
widgets main borders color on backdrop windows * /
2016-04-17 16:06:15 +00:00
@ define-color unfocused_borders # c0c0bd ;
2014-10-18 14:29:19 +00:00
/ *
these are pretty self explicative * /
2014-08-28 11:21:14 +00:00
@ define-color warning_color # f57900 ;
@ define-color error_color # cc0000 ;
@ define-color success_color # 73d216 ;
2014-10-18 14:29:19 +00:00
/ *
these colors are exported for the window manager and shouldn ' t be used in applications ,
read if you used those and something break with a version upgrade you ' re on your own . . . * /
2014-08-28 11:21:14 +00:00
@ define-color wm_title shade ( # 2e3436 , 1 . 8 ) ;
2016-02-24 21:36:14 +00:00
@ define-color wm_unfocused_title # 8b8e8f ;
2015-12-04 17:42:56 +00:00
@ define-color wm_highlight rgba ( 255 , 255 , 255 , 0 . 8 ) ;
@ define-color wm_borders_edge rgba ( 255 , 255 , 255 , 0 . 8 ) ;
@ define-color wm_bg_a shade ( # e8e8e7 , 1 . 2 ) ;
@ define-color wm_bg_b # e8e8e7 ;
2014-08-28 11:21:14 +00:00
@ define-color wm_shadow alpha ( black , 0 . 35 ) ;
@ define-color wm_border alpha ( black , 0 . 18 ) ;
2015-12-04 17:42:56 +00:00
@ define-color wm_button_hover_color_a shade ( # e8e8e7 , 1 . 3 ) ;
@ define-color wm_button_hover_color_b # e8e8e7 ;
@ define-color wm_button_active_color_a shade ( # e8e8e7 , 0 . 85 ) ;
@ define-color wm_button_active_color_b shade ( # e8e8e7 , 0 . 89 ) ;
@ define-color wm_button_active_color_c shade ( # e8e8e7 , 0 . 9 ) ;
2014-09-06 14:02:34 +00:00
@ define-color content_view_bg # ffffff ;