[libadwaita/wip/exalm/background-colors2: 3/18] stylesheet: Remove .sidebar border
- From: Alexander Mikhaylenko <alexm src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [libadwaita/wip/exalm/background-colors2: 3/18] stylesheet: Remove .sidebar border
- Date: Fri, 1 Oct 2021 13:38:39 +0000 (UTC)
commit 25ac0df567705c2b69cb3a2df46034fa7304b787
Author: Alexander Mikhaylenko <alexm gnome org>
Date: Fri Oct 1 13:25:04 2021 +0500
stylesheet: Remove .sidebar border
It's been a problem for a long time, and now that designers want consistent
sidebar colors it's gonna get in the way even more as if you just ignore it
and use a plain listbox/listview as a sidebar it will have the wrong color.
So just remove that border and tell people to use manual separators
instead.
Keep an explicit border in GtkAssistant. Inspector and gtk demos will be
missing borders, but not much we can do here.
Update migration guide.
doc/migrating-libhandy-1-4-to-libadwaita.md | 5 +++++
src/stylesheet/widgets/_dialogs.scss | 1 +
src/stylesheet/widgets/_sidebars.scss | 25 +++++++++----------------
3 files changed, 15 insertions(+), 16 deletions(-)
---
diff --git a/doc/migrating-libhandy-1-4-to-libadwaita.md b/doc/migrating-libhandy-1-4-to-libadwaita.md
index f49ac2f1..a6360dd5 100644
--- a/doc/migrating-libhandy-1-4-to-libadwaita.md
+++ b/doc/migrating-libhandy-1-4-to-libadwaita.md
@@ -338,6 +338,11 @@ If you were using `@theme_selected_bg_color` as a text color, use
`@accent_color` instead to make sure the text is readable. You can also use the
`.accent` style class to apply the correct color.
+#### Make sure your sidebars have borders
+
+The `.sidebar` style class doesn't provide a border by default. Instead, use a
+[class@Gtk.Separator] with the style class `.sidebar` manually.
+
#### Adapt to Header Bar, Action Bar and Toolbar Style Changes
When possible, buttons in [class@Gtk.HeaderBar] and [class@Gtk.ActionBar] will
diff --git a/src/stylesheet/widgets/_dialogs.scss b/src/stylesheet/widgets/_dialogs.scss
index 7616f8f4..ba713886 100644
--- a/src/stylesheet/widgets/_dialogs.scss
+++ b/src/stylesheet/widgets/_dialogs.scss
@@ -31,6 +31,7 @@ window.assistant {
.sidebar {
padding: $menu-margin;
background-clip: padding-box;
+ @extend %sidebar_border;
> label {
padding: 6px 12px;
diff --git a/src/stylesheet/widgets/_sidebars.scss b/src/stylesheet/widgets/_sidebars.scss
index 1774b5a8..fd5653ae 100644
--- a/src/stylesheet/widgets/_sidebars.scss
+++ b/src/stylesheet/widgets/_sidebars.scss
@@ -2,25 +2,18 @@
background-color: mix($bg_color, $base_color, 50%);
background-clip: padding-box;
- &:not(separator) {
- &:dir(ltr),
- &.left,
- &.left:dir(rtl) {
- border-right: 1px solid $borders_color;
- border-left-style: none;
- }
-
- &:dir(rtl),
- &.right {
- border-left: 1px solid $borders_color;
- border-right-style: none;
- }
- }
-
listview.view,
list { background-color: transparent; }
+}
+
+%sidebar_border {
+ &:dir(ltr) {
+ border-right: 1px solid $borders_color;
+ }
- paned & { &.left, &.right, &.left:dir(rtl), &:dir(rtl), &:dir(ltr), & { border-style: none; }}
+ &:dir(rtl) {
+ border-left: 1px solid $borders_color;
+ }
}
stacksidebar row {
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]