diff options
author | Lapo Calamandrei <calamandrei@gmail.com> | 2014-08-06 13:20:45 +0200 |
---|---|---|
committer | Lapo Calamandrei <calamandrei@gmail.com> | 2014-08-06 13:20:45 +0200 |
commit | f8c1a4fed8450fc03958bb466e51791c2751b4ae (patch) | |
tree | b422c692ac6d670af743c7d28aa6dd02a20fa602 | |
parent | cfff5620692024cb4a9a99e37ba4eac6893e4f41 (diff) | |
download | gtk+-f8c1a4fed8450fc03958bb466e51791c2751b4ae.tar.gz |
Adwaita: linked logic surgery
-rw-r--r-- | gtk/resources/theme/Adwaita/_common.scss | 104 | ||||
-rw-r--r-- | gtk/resources/theme/Adwaita/gtk-contained-dark.css | 65 | ||||
-rw-r--r-- | gtk/resources/theme/Adwaita/gtk-contained.css | 65 |
3 files changed, 64 insertions, 170 deletions
diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss index 6c2809be50..d8fb84761a 100644 --- a/gtk/resources/theme/Adwaita/_common.scss +++ b/gtk/resources/theme/Adwaita/_common.scss @@ -209,7 +209,7 @@ GtkLabel { box-shadow: none; &:backdrop { background-color: transparent; } } - .linked & { + .linked & { //FIXME: use same buttons linking logic and template &:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; @@ -340,11 +340,23 @@ $_dot_color: if($variant=='light', $selected_bg_color, @include button(osd); text-shadow: none; icon-shadow: none; - @extend %linked_buttons; - &:hover { @include button(osd-hover); @extend %linked_buttons; } - &:active { @include button(osd-active); @extend %linked_buttons; } - &:insensitive { @include button(osd-insensitive); @extend %linked_buttons; } - &:backdrop { @include button(osd-backdrop); @extend %linked_buttons; } + @extend %linked; + &:hover { + @include button(osd-hover); + @extend %linked; + } + &:active { + @include button(osd-active); + @extend %linked; + } + &:insensitive { + @include button(osd-insensitive); + @extend %linked; + } + &:backdrop { + @include button(osd-backdrop); + @extend %linked; + } } // Suggested and Destructive Action buttons @each $b_type, $b_color in (suggested-action, $selected_bg_color), @@ -439,7 +451,7 @@ $_dot_color: if($variant=='light', $selected_bg_color, .inline-toolbar &, .inline-toolbar &:backdrop { border-radius: 2px; border-width: 1px; - @extend %linked_buttons; + @extend %linked; } .primary-toolbar & { icon-shadow: none; } // tango icons don't need added shadows @@ -450,12 +462,12 @@ $_dot_color: if($variant=='light', $selected_bg_color, .linked &, .linked &:hover, .linked &:active, - .linked &:backdrop { @extend %linked_buttons; } + .linked &:backdrop { @extend %linked; } .linked.vertical &, .linked.vertical &:hover, .linked.vertical &:active, - .linked.vertical &:backdrop { @extend %linked_buttons_vertical; } + .linked.vertical &:backdrop { @extend %linked_vertical; } } @@ -477,34 +489,26 @@ $_dot_color: if($variant=='light', $selected_bg_color, .inline-toolbar.toolbar GtkToolButton { // .inline-toolbar.toolbar here for // higher specificity than the previous // "button look" selector - & > .button.flat { - border-radius: 0; - border-left-style: none; - } - &:dir(rtl) > .button.flat {} - &:first-child > .button.flat { - border-radius: 3px 0 0 3px; - border-left-style: solid; - } - &:last-child > .button.flat { - border-radius: 0 3px 3px 0; - } - &:last-child:dir(rtl) > .button.flat { - border-right-style: solid; - } - &:only-child > .button.flat { - border-radius: 3px; - border-style: solid; - } + & > .button.flat { @extend %linked_middle; } + &:dir(rtl) > .button.flat { @extend %linked_middle:dir(rtl); } + &:first-child > .button.flat { @extend %linked:first-child; } + &:last-child > .button.flat { @extend %linked:last-child; } + &:last-child:dir(rtl) > .button.flat { @extend %linked:last-child:dir(rtl); } + &:only-child > .button.flat { @extend %linked; } } -%linked_buttons { +%linked_middle { border-radius: 0; border-left-style: none; &:dir(rtl) { + border-radius: 0; // needed when including %linked_middle:dir(rtl) border-right-style: none; border-left-style: solid - }; + } +} + +%linked { + @extend %linked_middle; &:first-child { border-radius: 3px 0 0 3px; border-left-style: solid; @@ -519,7 +523,7 @@ $_dot_color: if($variant=='light', $selected_bg_color, } } -%linked_buttons_vertical{ +%linked_vertical{ border-left-style: solid; border-top-style: none; &:first-child { @@ -744,52 +748,28 @@ GtkComboBox { -GtkWidget-horizontal-separator: 0; -GtkWidget-vertical-separator: 0; } - &.combobox-entry .entry { - border-radius: 3px 0 0 3px; - &:dir(rtl) { - border-radius: 0 3px 3px 0; - } - } + &.combobox-entry .entry { @extend %linked; } &.combobox-entry .button, &.combobox-entry .button:backdrop { // It is needed to specify the backdrop button or it gets overridden - border-radius: 0 3px 3px 0; - border-left-style: none; - &:dir(rtl) { - border-radius: 3px 0 0 3px; - border-left-style: solid; - border-right-style: none; - } + @extend %linked; } } - -//FIXME: we need a better general solution for button linking - .linked > GtkComboBox > .button { // the combo is a composite widget so the way we do button linkind doesn't // work, special case needed. See // https://bugzilla.gnome.org/show_bug.cgi?id=733979 - - &:dir(ltr), &:dir(rtl) { // needed to increase specificity - border-radius: 0; - border-left-style: none; - } - &:dir(rtl) { - border-right-style: none; - border-left-style: solid - } + &:dir(ltr) { @extend %linked_middle; } // specificity bump + &:dir(rtl) { @extend %linked_middle:dir(rtl); } } .linked > GtkComboBox:first-child > .button { - border-radius: 3px 0 0 3px; - border-left-style: solid; + @extend %linked:first-child; } .linked > GtkComboBox:last-child > .button { - border-radius: 0 3px 3px 0; - &:dir(rtl) { border-right-style: solid; } + @extend %linked:last-child; } .linked > GtkComboBox:only-child > .button { - border-radius: 3px; - border-style: solid; + @extend %linked:only-child; } /************ diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css b/gtk/resources/theme/Adwaita/gtk-contained-dark.css index bd468d55cd..09f8169d4c 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css @@ -612,37 +612,25 @@ background-image: linear-gradient(to bottom, #303434); box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); } -.inline-toolbar.toolbar GtkToolButton > .button.flat, .inline-toolbar GtkToolButton > .button.flat { +.inline-toolbar GtkToolButton > .button.flat, .inline-toolbar.search-bar GtkToolButton > .button.flat, .osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:backdrop, .inline-toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:only-child > .button.flat, GtkComboBox.combobox-entry .entry, GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop, .linked > GtkComboBox > .button:dir(ltr) { border-radius: 0; border-left-style: none; } -.inline-toolbar.toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar GtkToolButton:first-child > .button.flat { + .inline-toolbar GtkToolButton > .button.flat:dir(rtl), .inline-toolbar GtkToolButton:dir(rtl) > .button.flat, .inline-toolbar.search-bar GtkToolButton:dir(rtl) > .button.flat, .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl), .inline-toolbar GtkToolButton:only-child > .button.flat:dir(rtl), GtkComboBox.combobox-entry .entry:dir(rtl), GtkComboBox.combobox-entry .button:dir(rtl), .linked > GtkComboBox > .button:dir(rtl) { + border-radius: 0; + border-right-style: none; + border-left-style: solid; } + +.osd .button:first-child, .inline-toolbar .button:first-child, .linked .button:first-child, .inline-toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:first-child > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat:first-child, GtkComboBox.combobox-entry .entry:first-child, GtkComboBox.combobox-entry .button:first-child, .linked > GtkComboBox:first-child > .button { border-radius: 3px 0 0 3px; border-left-style: solid; } -.inline-toolbar.toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar GtkToolButton:last-child > .button.flat { +.osd .button:last-child, .inline-toolbar .button:last-child, .linked .button:last-child, .inline-toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat:last-child, GtkComboBox.combobox-entry .entry:last-child, GtkComboBox.combobox-entry .button:last-child, .linked > GtkComboBox:last-child > .button { border-radius: 0 3px 3px 0; } -.inline-toolbar.toolbar GtkToolButton:last-child:dir(rtl) > .button.flat, .inline-toolbar GtkToolButton:last-child:dir(rtl) > .button.flat { - border-right-style: solid; } -.inline-toolbar.toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat { + .osd .button:last-child:dir(rtl), .inline-toolbar .button:last-child:dir(rtl), .linked .button:last-child:dir(rtl), .inline-toolbar GtkToolButton:last-child > .button.flat:dir(rtl), .inline-toolbar GtkToolButton:last-child:dir(rtl) > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child:dir(rtl) > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat:last-child:dir(rtl), GtkComboBox.combobox-entry .entry:last-child:dir(rtl), GtkComboBox.combobox-entry .button:last-child:dir(rtl), .linked > GtkComboBox:last-child > .button:dir(rtl) { + border-right-style: solid; } +.osd .button:only-child, .inline-toolbar .button:only-child, .linked .button:only-child, .inline-toolbar GtkToolButton:only-child > .button.flat:only-child, GtkComboBox.combobox-entry .entry:only-child, GtkComboBox.combobox-entry .button:only-child, .linked > GtkComboBox:only-child > .button { border-radius: 3px; border-style: solid; } -.osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:backdrop { - border-radius: 0; - border-left-style: none; } - .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl) { - border-right-style: none; - border-left-style: solid; } - .osd .button:first-child, .inline-toolbar .button:first-child, .linked .button:first-child { - border-radius: 3px 0 0 3px; - border-left-style: solid; } - .osd .button:last-child, .inline-toolbar .button:last-child, .linked .button:last-child { - border-radius: 0 3px 3px 0; } - .osd .button:last-child:dir(rtl), .inline-toolbar .button:last-child:dir(rtl), .linked .button:last-child:dir(rtl) { - border-right-style: solid; } - .osd .button:only-child, .inline-toolbar .button:only-child, .linked .button:only-child { - border-radius: 3px; - border-style: solid; } - .linked.vertical .button, .linked.vertical .button:hover, .linked.vertical .button:active, .linked.vertical .button:backdrop { border-left-style: solid; border-top-style: none; } @@ -869,37 +857,6 @@ GtkComboBox { -GtkWidget-wide-separators: true; -GtkWidget-horizontal-separator: 0; -GtkWidget-vertical-separator: 0; } - GtkComboBox.combobox-entry .entry { - border-radius: 3px 0 0 3px; } - GtkComboBox.combobox-entry .entry:dir(rtl) { - border-radius: 0 3px 3px 0; } - GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop { - border-radius: 0 3px 3px 0; - border-left-style: none; } - GtkComboBox.combobox-entry .button:dir(rtl), GtkComboBox.combobox-entry .button:backdrop:dir(rtl) { - border-radius: 3px 0 0 3px; - border-left-style: solid; - border-right-style: none; } - -.linked > GtkComboBox > .button:dir(ltr), .linked > GtkComboBox > .button:dir(rtl) { - border-radius: 0; - border-left-style: none; } -.linked > GtkComboBox > .button:dir(rtl) { - border-right-style: none; - border-left-style: solid; } - -.linked > GtkComboBox:first-child > .button { - border-radius: 3px 0 0 3px; - border-left-style: solid; } - -.linked > GtkComboBox:last-child > .button { - border-radius: 0 3px 3px 0; } - .linked > GtkComboBox:last-child > .button:dir(rtl) { - border-right-style: solid; } - -.linked > GtkComboBox:only-child > .button { - border-radius: 3px; - border-style: solid; } /************ * Toolbars * diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css index e6b91b0eae..31c86d69d4 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained.css +++ b/gtk/resources/theme/Adwaita/gtk-contained.css @@ -604,37 +604,25 @@ background-image: linear-gradient(to bottom, #ededed); box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); } -.inline-toolbar.toolbar GtkToolButton > .button.flat, .inline-toolbar GtkToolButton > .button.flat { +.inline-toolbar GtkToolButton > .button.flat, .inline-toolbar.search-bar GtkToolButton > .button.flat, .osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:backdrop, .inline-toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:only-child > .button.flat, GtkComboBox.combobox-entry .entry, GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop, .linked > GtkComboBox > .button:dir(ltr) { border-radius: 0; border-left-style: none; } -.inline-toolbar.toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar GtkToolButton:first-child > .button.flat { + .inline-toolbar GtkToolButton > .button.flat:dir(rtl), .inline-toolbar GtkToolButton:dir(rtl) > .button.flat, .inline-toolbar.search-bar GtkToolButton:dir(rtl) > .button.flat, .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl), .inline-toolbar GtkToolButton:only-child > .button.flat:dir(rtl), GtkComboBox.combobox-entry .entry:dir(rtl), GtkComboBox.combobox-entry .button:dir(rtl), .linked > GtkComboBox > .button:dir(rtl) { + border-radius: 0; + border-right-style: none; + border-left-style: solid; } + +.osd .button:first-child, .inline-toolbar .button:first-child, .linked .button:first-child, .inline-toolbar GtkToolButton:first-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:first-child > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat:first-child, GtkComboBox.combobox-entry .entry:first-child, GtkComboBox.combobox-entry .button:first-child, .linked > GtkComboBox:first-child > .button { border-radius: 3px 0 0 3px; border-left-style: solid; } -.inline-toolbar.toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar GtkToolButton:last-child > .button.flat { +.osd .button:last-child, .inline-toolbar .button:last-child, .linked .button:last-child, .inline-toolbar GtkToolButton:last-child > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat:last-child, GtkComboBox.combobox-entry .entry:last-child, GtkComboBox.combobox-entry .button:last-child, .linked > GtkComboBox:last-child > .button { border-radius: 0 3px 3px 0; } -.inline-toolbar.toolbar GtkToolButton:last-child:dir(rtl) > .button.flat, .inline-toolbar GtkToolButton:last-child:dir(rtl) > .button.flat { - border-right-style: solid; } -.inline-toolbar.toolbar GtkToolButton:only-child > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat { + .osd .button:last-child:dir(rtl), .inline-toolbar .button:last-child:dir(rtl), .linked .button:last-child:dir(rtl), .inline-toolbar GtkToolButton:last-child > .button.flat:dir(rtl), .inline-toolbar GtkToolButton:last-child:dir(rtl) > .button.flat, .inline-toolbar.search-bar GtkToolButton:last-child:dir(rtl) > .button.flat, .inline-toolbar GtkToolButton:only-child > .button.flat:last-child:dir(rtl), GtkComboBox.combobox-entry .entry:last-child:dir(rtl), GtkComboBox.combobox-entry .button:last-child:dir(rtl), .linked > GtkComboBox:last-child > .button:dir(rtl) { + border-right-style: solid; } +.osd .button:only-child, .inline-toolbar .button:only-child, .linked .button:only-child, .inline-toolbar GtkToolButton:only-child > .button.flat:only-child, GtkComboBox.combobox-entry .entry:only-child, GtkComboBox.combobox-entry .button:only-child, .linked > GtkComboBox:only-child > .button { border-radius: 3px; border-style: solid; } -.osd .button, .osd .button:hover, .osd .button:active, .osd .button:insensitive, .osd .button:backdrop, .inline-toolbar .button, .inline-toolbar .button:backdrop, .linked .button, .linked .button:hover, .linked .button:active, .linked .button:backdrop { - border-radius: 0; - border-left-style: none; } - .osd .button:dir(rtl), .inline-toolbar .button:dir(rtl), .linked .button:dir(rtl) { - border-right-style: none; - border-left-style: solid; } - .osd .button:first-child, .inline-toolbar .button:first-child, .linked .button:first-child { - border-radius: 3px 0 0 3px; - border-left-style: solid; } - .osd .button:last-child, .inline-toolbar .button:last-child, .linked .button:last-child { - border-radius: 0 3px 3px 0; } - .osd .button:last-child:dir(rtl), .inline-toolbar .button:last-child:dir(rtl), .linked .button:last-child:dir(rtl) { - border-right-style: solid; } - .osd .button:only-child, .inline-toolbar .button:only-child, .linked .button:only-child { - border-radius: 3px; - border-style: solid; } - .linked.vertical .button, .linked.vertical .button:hover, .linked.vertical .button:active, .linked.vertical .button:backdrop { border-left-style: solid; border-top-style: none; } @@ -861,37 +849,6 @@ GtkComboBox { -GtkWidget-wide-separators: true; -GtkWidget-horizontal-separator: 0; -GtkWidget-vertical-separator: 0; } - GtkComboBox.combobox-entry .entry { - border-radius: 3px 0 0 3px; } - GtkComboBox.combobox-entry .entry:dir(rtl) { - border-radius: 0 3px 3px 0; } - GtkComboBox.combobox-entry .button, GtkComboBox.combobox-entry .button:backdrop { - border-radius: 0 3px 3px 0; - border-left-style: none; } - GtkComboBox.combobox-entry .button:dir(rtl), GtkComboBox.combobox-entry .button:backdrop:dir(rtl) { - border-radius: 3px 0 0 3px; - border-left-style: solid; - border-right-style: none; } - -.linked > GtkComboBox > .button:dir(ltr), .linked > GtkComboBox > .button:dir(rtl) { - border-radius: 0; - border-left-style: none; } -.linked > GtkComboBox > .button:dir(rtl) { - border-right-style: none; - border-left-style: solid; } - -.linked > GtkComboBox:first-child > .button { - border-radius: 3px 0 0 3px; - border-left-style: solid; } - -.linked > GtkComboBox:last-child > .button { - border-radius: 0 3px 3px 0; } - .linked > GtkComboBox:last-child > .button:dir(rtl) { - border-right-style: solid; } - -.linked > GtkComboBox:only-child > .button { - border-radius: 3px; - border-style: solid; } /************ * Toolbars * |