[dconf-editor] Better labels placing.

[Arnaud Bonatti <arnaudb src gnome org>]

commit f9be3197d56e3fbdb4beac55dd2439c124ac2020
Author: Arnaud Bonatti <arnaud bonatti gmail com>
Date:   Sun May 1 10:45:08 2016 +0200

    Better labels placing.

 editor/dconf-editor.css       |   13 +++++++++
 editor/folder-list-box-row.ui |    9 +++---
 editor/key-list-box-row.ui    |   56 ++++++++++++++++++++++------------------
 3 files changed, 48 insertions(+), 30 deletions(-)
---
diff --git a/editor/dconf-editor.css b/editor/dconf-editor.css
index f1fb8a8..4c2f5f5 100644
--- a/editor/dconf-editor.css
+++ b/editor/dconf-editor.css
@@ -46,11 +46,24 @@
 .small-rows .dconf-list > row > .folder > grid { background-size:0.75rem; }
 
 /* technical padding: (2 * visual padding) + icon size */
+            .dconf-list:dir(ltr) > row > .key    > grid { padding-left:  10px; } /* looks cool */
             .dconf-list:dir(ltr) > row > .folder > grid { padding-left:  3rem; }
 .small-rows .dconf-list:dir(ltr) > row > .folder > grid { padding-left:  2.25rem; }
+            .dconf-list:dir(rtl) > row > .key    > grid { padding-right: 10px; }
             .dconf-list:dir(rtl) > row > .folder > grid { padding-right: 3rem; }
 .small-rows .dconf-list:dir(rtl) > row > .folder > grid { padding-right: 2.25rem; }
 
+/* technical labels placing */
+            .dconf-list          > row > .key    > grid  label.key-name { min-width:     222px; }
+            .dconf-list          > row > .folder > grid  label.key-name { min-width:calc(222px + 10px - 
3rem); }
+.small-rows .dconf-list          > row > .folder > grid  label.key-name { min-width:calc(222px + 10px - 
2.25rem); }
+
+            .dconf-list          > row > .key    > grid > grid          { min-width:400px; }
+
+/* grid spacing and padding-end */
+            .dconf-list:dir(ltr) > row  grid > label { padding-right: 0.5em; }
+            .dconf-list:dir(rtl) > row  grid > label { padding-left:  0.5em; }
+
 /*\
 * * pathbar
 \*/
diff --git a/editor/folder-list-box-row.ui b/editor/folder-list-box-row.ui
index 2523340..f8b3341 100644
--- a/editor/folder-list-box-row.ui
+++ b/editor/folder-list-box-row.ui
@@ -2,7 +2,6 @@
 <interface>
   <!-- interface-requires gtk+ 3.0 -->
   <template class="FolderListBoxRow" parent="ClickableListBoxRow">
-    <property name="visible">True</property>
     <style>
       <class name="folder"/>
     </style>
@@ -10,14 +9,14 @@
       <object class="GtkGrid">
         <property name="visible">True</property>
         <property name="orientation">horizontal</property>
-        <!-- no margin_start: done via CSS -->
-        <property name="column-spacing">6</property>
-        <property name="margin-end">6</property><!-- same as column_spacing -->
-        <property name="hexpand">True</property><!-- TODO add to key-list-box-row.ui? -->
         <child>
           <object class="GtkLabel" id="folder_name_label">
             <property name="visible">True</property>
             <property name="vexpand">True</property>
+            <property name="xalign">0</property>
+            <style>
+              <class name="key-name"/>
+            </style>
           </object>
         </child>
       </object>
diff --git a/editor/key-list-box-row.ui b/editor/key-list-box-row.ui
index 0b5ad1e..d2facda 100644
--- a/editor/key-list-box-row.ui
+++ b/editor/key-list-box-row.ui
@@ -2,43 +2,49 @@
 <interface>
   <!-- interface-requires gtk+ 3.0 -->
   <template class="KeyListBoxRow" parent="ClickableListBoxRow">
+    <style>
+      <class name="key"/>
+    </style>
     <child>
       <object class="GtkGrid">
         <property name="visible">True</property>
         <property name="orientation">horizontal</property>
-        <property name="margin-start">10</property><!-- looks cool -->
-        <property name="column-spacing">6</property>
-        <property name="margin-end">6</property><!-- same as column_spacing -->
         <child>
-          <object class="GtkLabel" id="key_name_label">
+          <object class="GtkGrid">
             <property name="visible">True</property>
-            <property name="xalign">0</property>
-            <property name="vexpand">True</property>
-            <property name="width-request">222</property>
-            <property name="wrap">True</property>
-            <property name="wrap-mode">PANGO_WRAP_WORD_CHAR</property>
-            <property name="halign">start</property>
-            <property name="single-line-mode">True</property>
-          </object>
-        </child>
-        <child>
-          <object class="GtkLabel" id="key_value_label">
-            <property name="visible">True</property>
-            <property name="xalign">0</property>
-            <property name="vexpand">True</property>
-            <property name="width-request">166</property>
-            <property name="wrap">True</property>
-            <property name="wrap-mode">PANGO_WRAP_WORD_CHAR</property>
-            <property name="halign">start</property>
-            <property name="single-line-mode">True</property>
+            <property name="orientation">horizontal</property>
+            <child>
+              <object class="GtkLabel" id="key_name_label">
+                <property name="visible">True</property>
+                <property name="vexpand">True</property>
+                <property name="xalign">0</property>
+                <property name="wrap">True</property>
+                <property name="wrap-mode">PANGO_WRAP_WORD_CHAR</property>
+                <property name="single-line-mode">True</property>
+                <style>
+                  <class name="key-name"/>
+                </style>
+              </object>
+            </child>
+            <child>
+              <object class="GtkLabel" id="key_value_label">
+                <property name="visible">True</property>
+                <property name="vexpand">True</property>
+                <property name="xalign">0</property>
+                <property name="wrap">True</property>
+                <property name="wrap-mode">PANGO_WRAP_WORD_CHAR</property>
+                <property name="single-line-mode">True</property>
+              </object>
+            </child>
           </object>
         </child>
         <child>
           <object class="GtkLabel" id="key_info_label">
             <property name="visible">True</property>
-            <property name="expand">True</property>
+            <property name="vexpand">True</property>
+            <property name="xalign">0</property>
+            <property name="hexpand">True</property>
             <property name="wrap">False</property>
-            <property name="halign">start</property>
             <property name="single-line-mode">True</property>
             <property name="ellipsize">end</property>
           </object>