[gtk/wip/jimmac/rich-list-styling] Adwaita: rich-list styling
- From: Jakub Steiner <jimmac src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk/wip/jimmac/rich-list-styling] Adwaita: rich-list styling
- Date: Thu, 20 Aug 2020 17:39:29 +0000 (UTC)
commit 5f630481db5f9d5f76498a1c490788543bcaff79
Author: Jakub Steiner <jimmac gmail com>
Date: Mon Aug 17 13:18:07 2020 +0200
Adwaita: rich-list styling
FIXME: why is the second list in Demo>List Box>Controls taller?
https://gitlab.gnome.org/GNOME/gtk/-/issues/3073
demos/widget-factory/widget-factory.ui | 57 +---------------------------------
gtk/theme/Adwaita/_common.scss | 21 +++++++++++--
2 files changed, 20 insertions(+), 58 deletions(-)
---
diff --git a/demos/widget-factory/widget-factory.ui b/demos/widget-factory/widget-factory.ui
index fccbb520d9..dd9903ce7a 100644
--- a/demos/widget-factory/widget-factory.ui
+++ b/demos/widget-factory/widget-factory.ui
@@ -1643,10 +1643,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 1</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
<property name="hexpand">1</property>
</object>
</child>
@@ -1654,10 +1650,6 @@ microphone-sensitivity-medium-symbolic</property>
<object class="GtkSwitch" id="listboxrow1switch">
<property name="halign">end</property>
<property name="valign">center</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
- <property name="margin-start">12</property>
- <property name="margin-end">12</property>
</object>
</child>
</object>
@@ -1674,10 +1666,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 2</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
<property name="hexpand">1</property>
</object>
</child>
@@ -1685,10 +1673,6 @@ microphone-sensitivity-medium-symbolic</property>
<object class="GtkScale" id="opacity">
<property name="halign">end</property>
<property name="valign">center</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
- <property name="margin-start">12</property>
- <property name="margin-end">12</property>
<property name="draw-value">0</property>
<property name="width-request">150</property>
<property name="adjustment">adjustment1</property>
@@ -1707,10 +1691,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 3</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
<property name="hexpand">1</property>
</object>
</child>
@@ -1719,10 +1699,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="icon-name">object-select-symbolic</property>
<property name="halign">end</property>
<property name="valign">center</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
- <property name="margin-start">12</property>
- <property name="margin-end">12</property>
<property name="opacity">0</property>
</object>
</child>
@@ -1740,10 +1716,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 4</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
<property name="hexpand">1</property>
</object>
</child>
@@ -1753,10 +1725,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="hexpand">1</property>
<property name="halign">end</property>
<property name="valign">center</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
- <property name="margin-start">12</property>
- <property name="margin-end">12</property>
</object>
</child>
</object>
@@ -1773,10 +1741,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 5</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
<property name="hexpand">1</property>
</object>
</child>
@@ -1784,10 +1748,6 @@ microphone-sensitivity-medium-symbolic</property>
<object class="GtkButton" id="listboxrow5button">
<property name="halign">end</property>
<property name="valign">center</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
- <property name="margin-start">12</property>
- <property name="margin-end">12</property>
<property
name="icon-name">appointment-soon-symbolic</property>
</object>
</child>
@@ -1805,10 +1765,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 6</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
<property name="hexpand">1</property>
</object>
</child>
@@ -1816,10 +1772,6 @@ microphone-sensitivity-medium-symbolic</property>
<object class="GtkCheckButton">
<property name="halign">end</property>
<property name="valign">center</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
- <property name="margin-start">12</property>
- <property name="margin-end">12</property>
</object>
</child>
</object>
@@ -1835,10 +1787,6 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 7</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
<property name="hexpand">1</property>
</object>
</child>
@@ -1855,10 +1803,7 @@ microphone-sensitivity-medium-symbolic</property>
<property name="label" translatable="yes">Row 8</property>
<property name="halign">start</property>
<property name="valign">center</property>
- <property name="margin-start">6</property>
- <property name="margin-end">6</property>
- <property name="margin-top">6</property>
- <property name="margin-bottom">6</property>
+
<property name="hexpand">1</property>
</object>
</child>
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 11e14836df..519a4a89e1 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -3072,7 +3072,7 @@ separator {
* Lists *
*********/
listview,
-list, .rich-list {
+list {
color: $text_color;
background-color: $base_color;
border-color: $borders_color;
@@ -3083,7 +3083,7 @@ list, .rich-list {
border-color: $backdrop_borders_color;
}
- > row { padding: 18px; }
+ > row { padding: 2px; }
> row.expander { padding: 0px; }
> row.expander .row-header { padding: 2px; }
@@ -3145,6 +3145,23 @@ row {
background-color: $selected_bg_color;
}
+/*******************************************************
+ * Rich Lists *
+ * Large list usually containing lots of widgets *
+ * https://gitlab.gnome.org/GNOME/gtk/-/issues/3073 *
+ *******************************************************/
+
+
+.rich-list { /* rich lists usually containing other widgets than just labels/text */
+ & > row {
+ padding: 8px 12px;
+ min-height: 32px; /* should be tall even when only containing a label */
+
+ & > box {
+ border-spacing: 12px;
+ }
+ }
+}
/*********************
* App Notifications *
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
