diff options
author | nana-4 <hnmaigo@gmail.com> | 2019-04-09 00:40:38 +0900 |
---|---|---|
committer | nana-4 <hnmaigo@gmail.com> | 2019-04-09 02:27:41 +0900 |
commit | ca233ad9aee7d2f924aafd37d9763f9dd68119ca (patch) | |
tree | 768bfc75db063cbda9cb1e8799ff99a62750a116 /gtk/theme | |
parent | 2594593de2a77500afb481f7ebee652a0d9c27d4 (diff) | |
download | gtk+-ca233ad9aee7d2f924aafd37d9763f9dd68119ca.tar.gz |
themes: Fix and improve linked button style
Instead of re-styling the border and radius of the linked buttons
depending on the position (middle, first, last, or only child), just
remove the border and radius in a specific direction when the button is
`:not(:first-child)` and/or `:not(:last-child)`.
This properly handles the style of linked buttons in all positions
-- middle, first, last, and only child.
Fixes #1294
Diffstat (limited to 'gtk/theme')
-rw-r--r-- | gtk/theme/Adwaita/_common.scss | 134 | ||||
-rw-r--r-- | gtk/theme/Adwaita/gtk-contained-dark.css | 22 | ||||
-rw-r--r-- | gtk/theme/Adwaita/gtk-contained.css | 22 | ||||
-rw-r--r-- | gtk/theme/HighContrast/_common.scss | 134 | ||||
-rw-r--r-- | gtk/theme/HighContrast/gtk-contained-inverse.css | 22 | ||||
-rw-r--r-- | gtk/theme/HighContrast/gtk-contained.css | 22 |
6 files changed, 106 insertions, 250 deletions
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss index 44e6fde534..f26a9bc198 100644 --- a/gtk/theme/Adwaita/_common.scss +++ b/gtk/theme/Adwaita/_common.scss @@ -833,25 +833,13 @@ button { &.font { > box > box > label { font-weight: bold; }} // inline-toolbar buttons - .inline-toolbar &, .inline-toolbar &:backdrop { - border-radius: 2px; - border-width: 1px; - @extend %linked; - } + .inline-toolbar & { @extend %linked; } .primary-toolbar & { -gtk-icon-shadow: none; } // tango icons don't need shadows - .linked > &, - .linked > &:hover, - .linked > &:active, - .linked > &:checked, - .linked > &:backdrop { @extend %linked; } + .linked:not(.vertical) > & { @extend %linked; } - .linked.vertical > &, - .linked.vertical > &:hover, - .linked.vertical > &:active, - .linked.vertical > &:checked, - .linked.vertical > &:backdrop { @extend %linked_vertical; } + .linked.vertical > & { @extend %linked_vertical; } &.circular { // The Bloody Circul Button border-radius: 9999px; @@ -942,80 +930,45 @@ button { } // More inline toolbar buttons -toolbar.inline-toolbar toolbutton, -toolbar.inline-toolbar toolbutton:backdrop { - > button.flat { @extend %linked_middle; } - - &:first-child > button.flat { @extend %linked:first-child; } - - &:last-child > button.flat { @extend %linked:last-child; } - - &:only-child > button.flat { @extend %linked:only-child; } +toolbar.inline-toolbar toolbutton { + &:not(:first-child) > button.flat { @extend %linked:not(:first-child); } + &:not(:last-child) > button.flat { @extend %linked:not(:last-child); } } -%linked_middle { - border-radius: 0; - border-right-style: none; +%linked_not_left { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -%linked_left { - border-top-left-radius: $button_radius; - border-bottom-left-radius: $button_radius; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - border-right-style: none; -} - -%linked_right { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-top-right-radius: $button_radius; - border-bottom-right-radius: $button_radius; - border-right-style: solid; +%linked_not_right { + border-right-style: none; + border-top-right-radius: 0; + border-bottom-right-radius: 0; } // 1st/last child are at text start/end %linked { - @extend %linked_middle; - &:dir(ltr) { - &:first-child { @extend %linked_left; } - &:last-child { @extend %linked_right; } + &:not(:first-child) { @extend %linked_not_left; } + &:not(:last-child) { @extend %linked_not_right; } } &:dir(rtl) { - &:first-child { @extend %linked_right; } - &:last-child { @extend %linked_left; } - } - - &:only-child { - border-radius: $button_radius; - border-style: solid; + &:not(:first-child) { @extend %linked_not_right; } + &:not(:last-child) { @extend %linked_not_left; } } } -%linked_vertical_middle { - border-style: solid solid none solid; - border-radius: 0; -} - %linked_vertical{ - @extend %linked_vertical_middle; - - &:first-child { - border-top-left-radius: $button_radius; - border-top-right-radius: $button_radius; - } - - &:last-child { - border-bottom-left-radius: $button_radius; - border-bottom-right-radius: $button_radius; - border-style: solid; + &:not(:first-child) { + border-top-left-radius: 0; + border-top-right-radius: 0; } - &:only-child { - border-radius: $button_radius; - border-style: solid; + &:not(:last-child) { + border-bottom-style: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } } @@ -1319,13 +1272,15 @@ spinbutton { } %top_button { - border-radius: $button_radius $button_radius 0 0; - border-style: solid solid none solid; + border-bottom-style: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } %bottom_button { - border-radius: 0 0 $button_radius $button_radius; - border-style: none solid solid solid; + border-top-style: none; + border-top-left-radius: 0; + border-top-right-radius: 0; } } @@ -1367,10 +1322,7 @@ combobox { } &.linked { - button:nth-child(2) { - &:dir(ltr) { @extend %linked:last-child; } - &:dir(rtl) { @extend %linked:first-child; } - } + button:nth-child(2) { @extend %linked:not(:first-child); } } &:drop(active) { // FIXME: untested @@ -1380,23 +1332,19 @@ combobox { } } -.linked > combobox > box > button.combo { - // the combo is a composite widget so the way we do button linking doesn't - // work, special case needed. See - // https://bugzilla.gnome.org/show_bug.cgi?id=733979 +// the combo is a composite widget so the way we do button linking doesn't +// work, special case needed. See +// https://bugzilla.gnome.org/show_bug.cgi?id=733979 - &:dir(ltr), - &:dir(rtl) { @extend %linked_middle; } // specificity bump +.linked:not(.vertical) > combobox { + &:not(:first-child) > box > button.combo { @extend %linked:not(:first-child); } + &:not(:last-child) > box > button.combo { @extend %linked:not(:last-child); } } -.linked:not(.vertical) > combobox:first-child > box > button.combo { @extend %linked:first-child; } -.linked:not(.vertical) > combobox:last-child > box > button.combo { @extend %linked:last-child; } -.linked:not(.vertical) > combobox:only-child > box > button.combo { @extend %linked:only-child; } - -.linked.vertical > combobox > box > button.combo { @extend %linked_vertical_middle; } -.linked.vertical > combobox:first-child > box > button.combo { @extend %linked_vertical:first-child;} -.linked.vertical > combobox:last-child > box > button.combo { @extend %linked_vertical:last-child; } -.linked.vertical > combobox:only-child > box > button.combo { @extend %linked_vertical:only-child; } +.linked.vertical > combobox { + &:not(:first-child) > box > button.combo { @extend %linked_vertical:not(:first-child); } + &:not(:last-child) > box > button.combo { @extend %linked_vertical:not(:last-child); } +} /************ diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css index 51f77d4493..51c513a5bc 100644 --- a/gtk/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/theme/Adwaita/gtk-contained-dark.css @@ -388,8 +388,6 @@ 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: 2px; border-width: 1px; } - .primary-toolbar button { -gtk-icon-shadow: none; } button.circular { border-radius: 9999px; -gtk-outline-radius: 9999px; background-origin: padding-box, border-box; background-clip: padding-box, border-box; } @@ -436,21 +434,13 @@ button.circular:hover:not(:checked):not(:active):not(:disabled):not(:backdrop) { .inline-toolbar toolbutton > button:backdrop:disabled:active label, .inline-toolbar toolbutton > button:backdrop:disabled:checked label { color: #5b5b5b; } -toolbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .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, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-right-style: solid; } - -.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .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: 5px; border-style: solid; } - -.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .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:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 5px; border-top-right-radius: 5px; } +.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } -.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-style: solid; } +.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; } -.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 5px; border-style: solid; } +.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } modelbutton.flat, .menuitem.button.flat, modelbutton.flat:backdrop, modelbutton.flat:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, list row button, 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 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; } @@ -553,9 +543,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; } -spinbutton.vertical button.up { border-radius: 5px 5px 0 0; border-style: solid solid none solid; } +spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } -spinbutton.vertical button.down { border-radius: 0 0 5px 5px; border-style: none solid solid solid; } +spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; } .osd spinbutton.vertical button:first-child { color: #eeeeec; border-color: rgba(0, 0, 0, 0.7); background-color: transparent; background-image: image(rgba(36, 33, 42, 0.7)); background-clip: padding-box; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); text-shadow: 0 1px black; -gtk-icon-shadow: 0 1px black; outline-color: rgba(238, 238, 236, 0.3); } diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css index 5a5d58f235..84f8b4230d 100644 --- a/gtk/theme/Adwaita/gtk-contained.css +++ b/gtk/theme/Adwaita/gtk-contained.css @@ -390,8 +390,6 @@ 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: 2px; border-width: 1px; } - .primary-toolbar button { -gtk-icon-shadow: none; } button.circular { border-radius: 9999px; -gtk-outline-radius: 9999px; background-origin: padding-box, border-box; background-clip: padding-box, border-box; } @@ -438,21 +436,13 @@ button.circular:hover:not(:checked):not(:active):not(:disabled):not(:backdrop) { .inline-toolbar toolbutton > button:backdrop:disabled:active label, .inline-toolbar toolbutton > button:backdrop:disabled:checked label { color: #d4cfca; } -toolbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .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, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 5px; border-bottom-left-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-right-style: solid; } - -.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .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: 5px; border-style: solid; } - -.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .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:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 5px; border-top-right-radius: 5px; } +.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } -.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; border-style: solid; } +.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; } -.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 5px; border-style: solid; } +.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } modelbutton.flat, .menuitem.button.flat, modelbutton.flat:backdrop, modelbutton.flat:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, list row button, 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 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; } @@ -561,9 +551,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; } -spinbutton.vertical button.up { border-radius: 5px 5px 0 0; border-style: solid solid none solid; } +spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } -spinbutton.vertical button.down { border-radius: 0 0 5px 5px; border-style: none solid solid solid; } +spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; } .osd spinbutton.vertical button:first-child { color: #eeeeec; border-color: rgba(0, 0, 0, 0.7); background-color: transparent; background-image: image(rgba(36, 33, 42, 0.7)); background-clip: padding-box; box-shadow: inset 0 1px rgba(255, 255, 255, 0.1); text-shadow: 0 1px black; -gtk-icon-shadow: 0 1px black; outline-color: rgba(238, 238, 236, 0.3); } diff --git a/gtk/theme/HighContrast/_common.scss b/gtk/theme/HighContrast/_common.scss index e98c7324c1..123921230d 100644 --- a/gtk/theme/HighContrast/_common.scss +++ b/gtk/theme/HighContrast/_common.scss @@ -680,25 +680,13 @@ button { } //inline-toolbar buttons - .inline-toolbar &, .inline-toolbar &:backdrop { - border-radius: 2px; - border-width: 1px; - @extend %linked; - } + .inline-toolbar & { @extend %linked; } .primary-toolbar & { -gtk-icon-shadow: none; } // tango icons don't need shadows - .linked > &, - .linked > &:hover, - .linked > &:active, - .linked > &:checked, - .linked > &:backdrop { @extend %linked; } + .linked:not(.vertical) > & { @extend %linked; } - .linked.vertical > &, - .linked.vertical > &:hover, - .linked.vertical > &:active, - .linked.vertical > &:checked, - .linked.vertical > &:backdrop { @extend %linked_vertical; } + .linked.vertical > & { @extend %linked_vertical; } } %needs_attention { @@ -749,80 +737,45 @@ button { } // More inline toolbar buttons -toolbar.inline-toolbar toolbutton, -toolbar.inline-toolbar toolbutton:backdrop { - & > button.flat { @extend %linked_middle; } - - &:first-child > button.flat { @extend %linked:first-child; } - - &:last-child > button.flat { @extend %linked:last-child; } - - &:only-child > button.flat { @extend %linked:only-child; } -} - -%linked_middle { - border-radius: 0; - border-right-style: none; +toolbar.inline-toolbar toolbutton { + &:not(:first-child) > button.flat { @extend %linked:not(:first-child); } + &:not(:last-child) > button.flat { @extend %linked:not(:last-child); } } -%linked_left { - border-top-left-radius: 3px; - border-bottom-left-radius: 3px; - border-top-right-radius: 0; - border-bottom-right-radius: 0; - border-right-style: none; +%linked_not_left { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -%linked_right { - border-top-left-radius: 0; - border-bottom-left-radius: 0; - border-top-right-radius: 3px; - border-bottom-right-radius: 3px; - border-right-style: solid; +%linked_not_right { + border-right-style: none; + border-top-right-radius: 0; + border-bottom-right-radius: 0; } // 1st/last child are at text start/end %linked { - @extend %linked_middle; - &:dir(ltr) { - &:first-child { @extend %linked_left; } - &:last-child { @extend %linked_right; } + &:not(:first-child) { @extend %linked_not_left; } + &:not(:last-child) { @extend %linked_not_right; } } &:dir(rtl) { - &:first-child { @extend %linked_right; } - &:last-child { @extend %linked_left; } - } - - &:only-child { - border-radius: 3px; - border-style: solid; + &:not(:first-child) { @extend %linked_not_right; } + &:not(:last-child) { @extend %linked_not_left; } } } -%linked_vertical_middle { - border-style: solid solid none solid; - border-radius: 0; -} - %linked_vertical{ - @extend %linked_vertical_middle; - - &:first-child { - border-top-left-radius: 3px; - border-top-right-radius: 3px; - } - - &:last-child { - border-bottom-left-radius: 3px; - border-bottom-right-radius: 3px; - border-style: solid; + &:not(:first-child) { + border-top-left-radius: 0; + border-top-right-radius: 0; } - &:only-child { - border-radius: 3px; - border-style: solid; + &:not(:last-child) { + border-bottom-style: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } } @@ -1087,13 +1040,15 @@ spinbutton { } %top_button { - border-radius: 3px 3px 0 0; - border-style: solid solid none solid; + border-bottom-style: none; + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; } %bottom_button { - border-radius: 0 0 3px 3px; - border-style: none solid solid solid; + border-top-style: none; + border-top-left-radius: 0; + border-top-right-radius: 0; } } @@ -1134,10 +1089,7 @@ combobox { } &.linked { - button:nth-child(2) { - &:dir(ltr) { @extend %linked:last-child; } - &:dir(rtl) { @extend %linked:first-child; } - } + button:nth-child(2) { @extend %linked:not(:first-child); } } &:drop(active) { // FIXME: untested @@ -1147,23 +1099,19 @@ combobox { } } -.linked > combobox > box > button.combo { - // the combo is a composite widget so the way we do button linking doesn't - // work, special case needed. See - // https://bugzilla.gnome.org/show_bug.cgi?id=733979 +// the combo is a composite widget so the way we do button linking doesn't +// work, special case needed. See +// https://bugzilla.gnome.org/show_bug.cgi?id=733979 - &:dir(ltr), - &:dir(rtl) { @extend %linked_middle; } // specificity bump +.linked:not(.vertical) > combobox { + &:not(:first-child) > box > button.combo { @extend %linked:not(:first-child); } + &:not(:last-child) > box > button.combo { @extend %linked:not(:last-child); } } -.linked:not(.vertical) > combobox:first-child > box > button.combo { @extend %linked:first-child; } -.linked:not(.vertical) > combobox:last-child > box > button.combo { @extend %linked:last-child; } -.linked:not(.vertical) > combobox:only-child > box > button.combo { @extend %linked:only-child; } - -.linked.vertical > combobox > box > button.combo { @extend %linked_vertical_middle; } -.linked.vertical > combobox:first-child > box > button.combo { @extend %linked_vertical:first-child;} -.linked.vertical > combobox:last-child > box > button.combo { @extend %linked_vertical:last-child; } -.linked.vertical > combobox:only-child > box > button.combo { @extend %linked_vertical:only-child; } +.linked.vertical > combobox { + &:not(:first-child) > box > button.combo { @extend %linked_vertical:not(:first-child); } + &:not(:last-child) > box > button.combo { @extend %linked_vertical:not(:last-child); } +} /************ diff --git a/gtk/theme/HighContrast/gtk-contained-inverse.css b/gtk/theme/HighContrast/gtk-contained-inverse.css index 69a15db18a..bb021ff7ba 100644 --- a/gtk/theme/HighContrast/gtk-contained-inverse.css +++ b/gtk/theme/HighContrast/gtk-contained-inverse.css @@ -318,8 +318,6 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch .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; } -.inline-toolbar button, .inline-toolbar button:backdrop { border-radius: 2px; border-width: 1px; } - .primary-toolbar button { -gtk-icon-shadow: none; } .stack-switcher > button.needs-attention > label, .stack-switcher > button.needs-attention > image, stacksidebar row.needs-attention > label { animation: needs_attention 150ms ease-in; background-image: radial-gradient(#ddd 68%, rgba(221, 221, 221, 0) 70%); background-size: 6px 6px; background-repeat: no-repeat; background-position: right 3px; } @@ -346,21 +344,13 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch .inline-toolbar toolbutton > button:backdrop:disabled:active, .inline-toolbar toolbutton > button:backdrop:disabled:checked { border-width: 2px; border-style: solid; color: gray; border-color: #494949; background-image: none; background-color: #090909; } -toolbar.inline-toolbar toolbutton > button.flat, searchbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, searchbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .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, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 3px; border-bottom-left-radius: 3px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-right-style: solid; } - -.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .linked:not(.vertical) > entry:only-child, .inline-toolbar button:only-child, .linked > button:only-child, toolbar.inline-toolbar toolbutton:only-child > button.flat, searchbar.inline-toolbar toolbutton:only-child > button.flat, toolbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, searchbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, .linked:not(.vertical) > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; } - -.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .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:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 3px; border-top-right-radius: 3px; } +.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } -.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-style: solid; } +.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; } -.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; } +.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } modelbutton.flat, popover.background checkbutton, popover.background radiobutton, .menuitem.button.flat, modelbutton.flat:backdrop, popover.background checkbutton:backdrop, popover.background radiobutton:backdrop, modelbutton.flat:backdrop:hover, popover.background checkbutton:backdrop:hover, popover.background radiobutton:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, button:link, button:visited, button:link:hover, button:link:active, button:visited:hover, button:visited:active, button:link:backdrop, button:visited:backdrop, notebook tab button, row.activatable, row.activatable:backdrop, row.activatable:backdrop:active, row.activatable:backdrop:checked, row.activatable:backdrop:disabled, row.activatable:backdrop:disabled:active, row.activatable:backdrop:disabled:checked, row.activatable:disabled:active, row.activatable:disabled:checked, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:backdrop:hover { background-color: transparent; background-image: none; border-color: transparent; box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; } @@ -455,9 +445,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; } -spinbutton.vertical button.up { border-radius: 3px 3px 0 0; border-style: solid solid none solid; } +spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } -spinbutton.vertical button.down { border-radius: 0 0 3px 3px; border-style: none solid solid solid; } +spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; } .osd spinbutton.vertical button:first-child { border-width: 2px; border-style: solid; color: #fff; background-image: none; background-color: rgba(0, 0, 0, 0.8); border-color: rgba(255, 255, 255, 0.2); } diff --git a/gtk/theme/HighContrast/gtk-contained.css b/gtk/theme/HighContrast/gtk-contained.css index ded0353672..1220441055 100644 --- a/gtk/theme/HighContrast/gtk-contained.css +++ b/gtk/theme/HighContrast/gtk-contained.css @@ -320,8 +320,6 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch .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; } -.inline-toolbar button, .inline-toolbar button:backdrop { border-radius: 2px; border-width: 1px; } - .primary-toolbar button { -gtk-icon-shadow: none; } .stack-switcher > button.needs-attention > label, .stack-switcher > button.needs-attention > image, stacksidebar row.needs-attention > label { animation: needs_attention 150ms ease-in; background-image: radial-gradient(#000 68%, rgba(0, 0, 0, 0) 70%); background-size: 6px 6px; background-repeat: no-repeat; background-position: right 3px; } @@ -348,21 +346,13 @@ button.destructive-action:disabled:active, button.destructive-action:disabled:ch .inline-toolbar toolbutton > button:backdrop:disabled:active, .inline-toolbar toolbutton > button:backdrop:disabled:checked { border-width: 2px; border-style: solid; color: gray; border-color: silver; background-image: none; background-color: #f6f6f6; } -toolbar.inline-toolbar toolbutton > button.flat, searchbar.inline-toolbar toolbutton > button.flat, toolbar.inline-toolbar toolbutton:backdrop > button.flat, searchbar.inline-toolbar toolbutton:backdrop > button.flat, .linked:not(.vertical) > spinbutton:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text, .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, .linked > combobox > box > button.combo:dir(ltr), .linked > combobox > box > button.combo:dir(rtl) { border-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):first-child, .linked:not(.vertical) > entry:dir(ltr):first-child, .inline-toolbar button:dir(ltr):first-child, .linked > button:dir(ltr):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2):dir(rtl), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):last-child, .linked:not(.vertical) > entry:dir(rtl):last-child, .inline-toolbar button:dir(rtl):last-child, .linked > button:dir(rtl):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(rtl), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(rtl) { border-top-left-radius: 3px; border-bottom-left-radius: 3px; border-top-right-radius: 0; border-bottom-right-radius: 0; border-right-style: none; } - -.linked:not(.vertical) > spinbutton:dir(ltr):last-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):last-child, .linked:not(.vertical) > entry:dir(ltr):last-child, .inline-toolbar button:dir(ltr):last-child, .linked > button:dir(ltr):last-child, toolbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:last-child > button.flat:dir(ltr), toolbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:backdrop:last-child > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:last-child > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):first-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):first-child, .linked:not(.vertical) > entry:dir(rtl):first-child, .inline-toolbar button:dir(rtl):first-child, .linked > button:dir(rtl):first-child, toolbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:first-child > button.flat:dir(rtl), toolbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:backdrop:first-child > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:first-child > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; border-top-right-radius: 3px; border-bottom-right-radius: 3px; border-right-style: solid; } - -.linked:not(.vertical) > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:only-child, .linked:not(.vertical) > entry:only-child, .inline-toolbar button:only-child, .linked > button:only-child, toolbar.inline-toolbar toolbutton:only-child > button.flat, searchbar.inline-toolbar toolbutton:only-child > button.flat, toolbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, searchbar.inline-toolbar toolbutton:backdrop:only-child > button.flat, .linked:not(.vertical) > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; } - -.linked.vertical > spinbutton:not(.vertical), spinbutton.vertical .linked.vertical > text, .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:not(.vertical) > spinbutton:dir(ltr):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:first-child), .linked:not(.vertical) > entry:dir(ltr):not(:first-child), .inline-toolbar button:dir(ltr):not(:first-child), .linked:not(.vertical) > button:dir(ltr):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(ltr), combobox.linked button:dir(ltr):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:last-child), .linked:not(.vertical) > entry:dir(rtl):not(:last-child), .inline-toolbar button:dir(rtl):not(:last-child), .linked:not(.vertical) > button:dir(rtl):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(rtl), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(rtl) { border-top-left-radius: 0; border-bottom-left-radius: 0; } -.linked.vertical > spinbutton:first-child:not(.vertical), spinbutton.vertical .linked.vertical > text:first-child, .linked.vertical > entry:first-child, .linked.vertical > button:first-child, .linked.vertical > combobox:first-child > box > button.combo { border-top-left-radius: 3px; border-top-right-radius: 3px; } +.linked:not(.vertical) > spinbutton:dir(ltr):not(:last-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(ltr):not(:last-child), .linked:not(.vertical) > entry:dir(ltr):not(:last-child), .inline-toolbar button:dir(ltr):not(:last-child), .linked:not(.vertical) > button:dir(ltr):not(:last-child), toolbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), searchbar.inline-toolbar toolbutton:not(:last-child) > button.flat:dir(ltr), .linked:not(.vertical) > combobox:not(:last-child) > box > button.combo:dir(ltr), .linked:not(.vertical) > spinbutton:dir(rtl):not(:first-child):not(.vertical), spinbutton.vertical .linked:not(.vertical) > text:dir(rtl):not(:first-child), .linked:not(.vertical) > entry:dir(rtl):not(:first-child), .inline-toolbar button:dir(rtl):not(:first-child), .linked:not(.vertical) > button:dir(rtl):not(:first-child), toolbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), searchbar.inline-toolbar toolbutton:not(:first-child) > button.flat:dir(rtl), combobox.linked button:dir(rtl):nth-child(2), .linked:not(.vertical) > combobox:not(:first-child) > box > button.combo:dir(rtl) { border-right-style: none; border-top-right-radius: 0; border-bottom-right-radius: 0; } -.linked.vertical > spinbutton:last-child:not(.vertical), spinbutton.vertical .linked.vertical > text:last-child, .linked.vertical > entry:last-child, .linked.vertical > button:last-child, .linked.vertical > combobox:last-child > box > button.combo { border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; border-style: solid; } +.linked.vertical > spinbutton:not(:first-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:first-child), .linked.vertical > entry:not(:first-child), .linked.vertical > button:not(:first-child), .linked.vertical > combobox:not(:first-child) > box > button.combo { border-top-left-radius: 0; border-top-right-radius: 0; } -.linked.vertical > spinbutton:only-child:not(.vertical), spinbutton.vertical .linked.vertical > text:only-child, .linked.vertical > entry:only-child, .linked.vertical > button:only-child, .linked.vertical > combobox:only-child > box > button.combo { border-radius: 3px; border-style: solid; } +.linked.vertical > spinbutton:not(:last-child):not(.vertical), spinbutton.vertical .linked.vertical > text:not(:last-child), .linked.vertical > entry:not(:last-child), .linked.vertical > button:not(:last-child), .linked.vertical > combobox:not(:last-child) > box > button.combo { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } modelbutton.flat, popover.background checkbutton, popover.background radiobutton, .menuitem.button.flat, modelbutton.flat:backdrop, popover.background checkbutton:backdrop, popover.background radiobutton:backdrop, modelbutton.flat:backdrop:hover, popover.background checkbutton:backdrop:hover, popover.background radiobutton:backdrop:hover, .menuitem.button.flat:backdrop, .menuitem.button.flat:backdrop:hover, button:link, button:visited, button:link:hover, button:link:active, button:visited:hover, button:visited:active, button:link:backdrop, button:visited:backdrop, notebook tab button, row.activatable, row.activatable:backdrop, row.activatable:backdrop:active, row.activatable:backdrop:checked, row.activatable:backdrop:disabled, row.activatable:backdrop:disabled:active, row.activatable:backdrop:disabled:checked, row.activatable:disabled:active, row.activatable:disabled:checked, calendar.button, calendar.button:hover, calendar.button:backdrop, calendar.button:backdrop:hover { background-color: transparent; background-image: none; border-color: transparent; box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); text-shadow: none; -gtk-icon-shadow: none; } @@ -459,9 +449,9 @@ spinbutton.vertical text { min-height: 32px; min-width: 32px; padding: 0; border spinbutton.vertical button { min-height: 32px; min-width: 32px; padding: 0; } -spinbutton.vertical button.up { border-radius: 3px 3px 0 0; border-style: solid solid none solid; } +spinbutton.vertical button.up { border-bottom-style: none; border-bottom-left-radius: 0; border-bottom-right-radius: 0; } -spinbutton.vertical button.down { border-radius: 0 0 3px 3px; border-style: none solid solid solid; } +spinbutton.vertical button.down { border-top-style: none; border-top-left-radius: 0; border-top-right-radius: 0; } .osd spinbutton.vertical button:first-child { border-width: 2px; border-style: solid; color: #fff; background-image: none; background-color: rgba(0, 0, 0, 0.8); border-color: rgba(255, 255, 255, 0.2); } |