diff --git a/gtk/resources/theme/Adwaita/_common.scss b/gtk/resources/theme/Adwaita/_common.scss index 5e0b45f97b..6cf2a2f83d 100644 --- a/gtk/resources/theme/Adwaita/_common.scss +++ b/gtk/resources/theme/Adwaita/_common.scss @@ -520,6 +520,9 @@ $_dot_color: if($variant=='light', $selected_bg_color, // to position the needs attention dot, padding is added to the button // child, a label needs just lateral padding while an icon needs vertical // padding added too. + + outline-offset: -3px; // needs to be set or it gets overridden by GtkRadioButton outline-offset + > GtkLabel { padding-left: 6px; // label padding padding-right: 6px; // diff --git a/gtk/resources/theme/Adwaita/gtk-contained-dark.css b/gtk/resources/theme/Adwaita/gtk-contained-dark.css index d8b242bc5b..2169964cf0 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/resources/theme/Adwaita/gtk-contained-dark.css @@ -832,37 +832,41 @@ GtkCalendar.header .button.titlebutton { .titlebar .text-button.titlebutton.button GtkLabel:last-child, GtkCalendar.header .text-button.titlebutton.button GtkLabel:last-child { padding-right: 8px; } - .stack-switcher > .button > GtkLabel, .header-bar .stack-switcher > .button.titlebutton > GtkLabel, - .titlebar .stack-switcher > .button.titlebutton > GtkLabel, - GtkCalendar.header .stack-switcher > .button.titlebutton > GtkLabel { - padding-left: 6px; - padding-right: 6px; } - .stack-switcher > .button > GtkImage, .header-bar .stack-switcher > .button.titlebutton > GtkImage, - .titlebar .stack-switcher > .button.titlebutton > GtkImage, - GtkCalendar.header .stack-switcher > .button.titlebutton > GtkImage { - padding-left: 6px; - padding-right: 6px; - padding-top: 3px; - padding-bottom: 3px; } - .stack-switcher > .button.text-button { - padding: 5px 10px 6px; } - .stack-switcher > .button.image-button, .header-bar .stack-switcher > .titlebutton.button, - .titlebar .stack-switcher > .titlebutton.button, - GtkCalendar.header .stack-switcher > .titlebutton.button { - padding: 5px 2px; } - .stack-switcher > .button.needs-attention > GtkLabel, .stack-switcher > .button.needs-attention > GtkImage { - animation: needs_attention 150ms ease-in; - background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#3583d5), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.45, to(rgba(0, 0, 0, 0.81176)), to(transparent)); - background-size: 6px 6px, 6px 6px; - background-repeat: no-repeat; - background-position: right 3px, right 2px; } - .stack-switcher > .button.needs-attention > GtkLabel:backdrop, .stack-switcher > .button.needs-attention > GtkImage:backdrop { - background-size: 6px 6px, 0 0; } - .stack-switcher > .button.needs-attention > GtkLabel:dir(rtl), .stack-switcher > .button.needs-attention > GtkImage:dir(rtl) { - background-position: left 3px, left 2px; } - .stack-switcher > .button.needs-attention:active > GtkLabel, .stack-switcher > .button.needs-attention:active > GtkImage, .stack-switcher > .button.needs-attention:checked > GtkLabel, .stack-switcher > .button.needs-attention:checked > GtkImage { - animation: none; - background-image: none; } + .stack-switcher > .button, .header-bar .stack-switcher > .button.titlebutton, + .titlebar .stack-switcher > .button.titlebutton, + GtkCalendar.header .stack-switcher > .button.titlebutton { + outline-offset: -3px; } + .stack-switcher > .button > GtkLabel, .header-bar .stack-switcher > .button.titlebutton > GtkLabel, + .titlebar .stack-switcher > .button.titlebutton > GtkLabel, + GtkCalendar.header .stack-switcher > .button.titlebutton > GtkLabel { + padding-left: 6px; + padding-right: 6px; } + .stack-switcher > .button > GtkImage, .header-bar .stack-switcher > .button.titlebutton > GtkImage, + .titlebar .stack-switcher > .button.titlebutton > GtkImage, + GtkCalendar.header .stack-switcher > .button.titlebutton > GtkImage { + padding-left: 6px; + padding-right: 6px; + padding-top: 3px; + padding-bottom: 3px; } + .stack-switcher > .button.text-button { + padding: 5px 10px 6px; } + .stack-switcher > .button.image-button, .header-bar .stack-switcher > .titlebutton.button, + .titlebar .stack-switcher > .titlebutton.button, + GtkCalendar.header .stack-switcher > .titlebutton.button { + padding: 5px 2px; } + .stack-switcher > .button.needs-attention > GtkLabel, .stack-switcher > .button.needs-attention > GtkImage { + animation: needs_attention 150ms ease-in; + background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#3583d5), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.45, to(rgba(0, 0, 0, 0.81176)), to(transparent)); + background-size: 6px 6px, 6px 6px; + background-repeat: no-repeat; + background-position: right 3px, right 2px; } + .stack-switcher > .button.needs-attention > GtkLabel:backdrop, .stack-switcher > .button.needs-attention > GtkImage:backdrop { + background-size: 6px 6px, 0 0; } + .stack-switcher > .button.needs-attention > GtkLabel:dir(rtl), .stack-switcher > .button.needs-attention > GtkImage:dir(rtl) { + background-position: left 3px, left 2px; } + .stack-switcher > .button.needs-attention:active > GtkLabel, .stack-switcher > .button.needs-attention:active > GtkImage, .stack-switcher > .button.needs-attention:checked > GtkLabel, .stack-switcher > .button.needs-attention:checked > GtkImage { + animation: none; + background-image: none; } .inline-toolbar .button, .inline-toolbar .header-bar .button.titlebutton, .header-bar .inline-toolbar .button.titlebutton, .inline-toolbar .titlebar .button.titlebutton, .titlebar .inline-toolbar .button.titlebutton, diff --git a/gtk/resources/theme/Adwaita/gtk-contained.css b/gtk/resources/theme/Adwaita/gtk-contained.css index add4c1ca65..e81b376dfe 100644 --- a/gtk/resources/theme/Adwaita/gtk-contained.css +++ b/gtk/resources/theme/Adwaita/gtk-contained.css @@ -824,37 +824,41 @@ GtkCalendar.header .button.titlebutton { .titlebar .text-button.titlebutton.button GtkLabel:last-child, GtkCalendar.header .text-button.titlebutton.button GtkLabel:last-child { padding-right: 8px; } - .stack-switcher > .button > GtkLabel, .header-bar .stack-switcher > .button.titlebutton > GtkLabel, - .titlebar .stack-switcher > .button.titlebutton > GtkLabel, - GtkCalendar.header .stack-switcher > .button.titlebutton > GtkLabel { - padding-left: 6px; - padding-right: 6px; } - .stack-switcher > .button > GtkImage, .header-bar .stack-switcher > .button.titlebutton > GtkImage, - .titlebar .stack-switcher > .button.titlebutton > GtkImage, - GtkCalendar.header .stack-switcher > .button.titlebutton > GtkImage { - padding-left: 6px; - padding-right: 6px; - padding-top: 3px; - padding-bottom: 3px; } - .stack-switcher > .button.text-button { - padding: 5px 10px 6px; } - .stack-switcher > .button.image-button, .header-bar .stack-switcher > .titlebutton.button, - .titlebar .stack-switcher > .titlebutton.button, - GtkCalendar.header .stack-switcher > .titlebutton.button { - padding: 5px 2px; } - .stack-switcher > .button.needs-attention > GtkLabel, .stack-switcher > .button.needs-attention > GtkImage { - animation: needs_attention 150ms ease-in; - background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#4a90d9), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(rgba(255, 255, 255, 0.76923)), to(transparent)); - background-size: 6px 6px, 6px 6px; - background-repeat: no-repeat; - background-position: right 3px, right 4px; } - .stack-switcher > .button.needs-attention > GtkLabel:backdrop, .stack-switcher > .button.needs-attention > GtkImage:backdrop { - background-size: 6px 6px, 0 0; } - .stack-switcher > .button.needs-attention > GtkLabel:dir(rtl), .stack-switcher > .button.needs-attention > GtkImage:dir(rtl) { - background-position: left 3px, left 4px; } - .stack-switcher > .button.needs-attention:active > GtkLabel, .stack-switcher > .button.needs-attention:active > GtkImage, .stack-switcher > .button.needs-attention:checked > GtkLabel, .stack-switcher > .button.needs-attention:checked > GtkImage { - animation: none; - background-image: none; } + .stack-switcher > .button, .header-bar .stack-switcher > .button.titlebutton, + .titlebar .stack-switcher > .button.titlebutton, + GtkCalendar.header .stack-switcher > .button.titlebutton { + outline-offset: -3px; } + .stack-switcher > .button > GtkLabel, .header-bar .stack-switcher > .button.titlebutton > GtkLabel, + .titlebar .stack-switcher > .button.titlebutton > GtkLabel, + GtkCalendar.header .stack-switcher > .button.titlebutton > GtkLabel { + padding-left: 6px; + padding-right: 6px; } + .stack-switcher > .button > GtkImage, .header-bar .stack-switcher > .button.titlebutton > GtkImage, + .titlebar .stack-switcher > .button.titlebutton > GtkImage, + GtkCalendar.header .stack-switcher > .button.titlebutton > GtkImage { + padding-left: 6px; + padding-right: 6px; + padding-top: 3px; + padding-bottom: 3px; } + .stack-switcher > .button.text-button { + padding: 5px 10px 6px; } + .stack-switcher > .button.image-button, .header-bar .stack-switcher > .titlebutton.button, + .titlebar .stack-switcher > .titlebutton.button, + GtkCalendar.header .stack-switcher > .titlebutton.button { + padding: 5px 2px; } + .stack-switcher > .button.needs-attention > GtkLabel, .stack-switcher > .button.needs-attention > GtkImage { + animation: needs_attention 150ms ease-in; + background-image: -gtk-gradient(radial, center center, 0, center center, 0.5, to(#4a90d9), to(transparent)), -gtk-gradient(radial, center center, 0, center center, 0.5, to(rgba(255, 255, 255, 0.76923)), to(transparent)); + background-size: 6px 6px, 6px 6px; + background-repeat: no-repeat; + background-position: right 3px, right 4px; } + .stack-switcher > .button.needs-attention > GtkLabel:backdrop, .stack-switcher > .button.needs-attention > GtkImage:backdrop { + background-size: 6px 6px, 0 0; } + .stack-switcher > .button.needs-attention > GtkLabel:dir(rtl), .stack-switcher > .button.needs-attention > GtkImage:dir(rtl) { + background-position: left 3px, left 4px; } + .stack-switcher > .button.needs-attention:active > GtkLabel, .stack-switcher > .button.needs-attention:active > GtkImage, .stack-switcher > .button.needs-attention:checked > GtkLabel, .stack-switcher > .button.needs-attention:checked > GtkImage { + animation: none; + background-image: none; } .inline-toolbar .button, .inline-toolbar .header-bar .button.titlebutton, .header-bar .inline-toolbar .button.titlebutton, .inline-toolbar .titlebar .button.titlebutton, .titlebar .inline-toolbar .button.titlebutton,