[polari/wip/dmoelgaard/initial-setup] Tweak styling

[Bastian Ilsø Hougaard <bastianilso src gnome org>]

commit fd065814db42857e220ddbd462a469c88bcc9837
Author: Bastian Ilsø <bastianilso gnome org>
Date:   Wed Aug 2 00:15:03 2017 +0100

    Tweak styling

 data/resources/application.css |    8 ++++
 data/resources/init-setup.ui   |   71 ++++++++++++++++-----------------------
 2 files changed, 37 insertions(+), 42 deletions(-)
---
diff --git a/data/resources/application.css b/data/resources/application.css
index c75a2ea..44741a0 100644
--- a/data/resources/application.css
+++ b/data/resources/application.css
@@ -128,6 +128,14 @@ treeview.polari-server-room-list {
     font-size: larger;
 }
 
+.polari-setup-page {
+    padding: 48px 156px;
+}
+
+.polari-setup-title {
+    font-size: 175%;
+}
+
 .polari-error-information {
     background-color: @polari_dark_bg_color;
     border-style: solid;
diff --git a/data/resources/init-setup.ui b/data/resources/init-setup.ui
index f2a1716..497d858 100644
--- a/data/resources/init-setup.ui
+++ b/data/resources/init-setup.ui
@@ -2,8 +2,8 @@
 <interface>
   <template class="Gjs_InitSetup">
     <property name="icon-name">org.gnome.Polari</property>
-    <property name="default-width">500</property>
-    <property name="default-height">500</property>
+    <property name="default-width">800</property>
+    <property name="default-height">600</property>
     <child type="titlebar">
       <object class="GtkBox">
         <property name="visible">True</property>
@@ -101,37 +101,34 @@
             <property name="orientation">vertical</property>
             <property name="visible">True</property>
             <property name="vexpand">True</property>
-            <property name="margin">30</property>
-            <property name="margin-bottom">24</property>
-            <property name="spacing">25</property>
+            <property name="spacing">24</property>
+            <style>
+              <class name="polari-setup-page"/>
+            </style>
             <child>
               <object class="GtkBox">
                 <property name="visible">True</property>
                 <property name="orientation">vertical</property>
+                <property name="spacing">24</property>
+                <property name="halign">center</property>
                 <child>
                   <object class="GtkLabel">
                     <property name="visible">True</property>
                     <property name="label">Welcome to Polari</property>
                     <style>
-                      <class name="polari-background-title"/>
+                      <class name="polari-setup-title"/>
                     </style>
                   </object>
                 </child>
                 <child>
                   <object class="GtkLabel">
                     <property name="visible">True</property>
-                    <property name="label">Polari is an easy way to chat using IRC.</property>
+                    <property name="max-width-chars">42</property>
+                    <property name="wrap">True</property>
+                    <property name="justify">center</property>
+                    <property name="label">Polari is an easy way to chat using IRC. Select a connection to 
get started.</property>
                     <style>
-                      <class name="polari-background-description"/>
-                    </style>
-                  </object>
-                </child>
-                <child>
-                  <object class="GtkLabel">
-                    <property name="visible">True</property>
-                    <property name="label">Select a connection to get started.</property>
-                    <style>
-                      <class name="polari-background-description"/>
+                      <class name="dim-label"/>
                     </style>
                   </object>
                 </child>
@@ -151,53 +148,43 @@
           <object class="GtkBox">
             <property name="orientation">vertical</property>
             <property name="visible">True</property>
-            <property name="margin">30</property>
-            <property name="margin-bottom">24</property>
-            <property name="spacing">25</property>
+            <property name="spacing">24</property>
+            <style>
+              <class name="polari-setup-page"/>
+            </style>
             <child>
               <object class="GtkBox">
                 <property name="visible">True</property>
                 <property name="orientation">vertical</property>
+                <property name="halign">center</property>
+                <property name="spacing">24</property>
                 <child>
                   <object class="GtkLabel">
                     <property name="visible">True</property>
                     <property name="label">Welcome to Polari</property>
                     <style>
-                      <class name="polari-background-title"/>
+                      <class name="polari-setup-title"/>
                     </style>
                   </object>
                 </child>
                 <child>
                   <object class="GtkLabel">
                     <property name="visible">True</property>
-                    <property name="label">Select rooms you want to connect to. You can add more</property>
+                    <property name="max-width-chars">60</property>
+                    <property name="wrap">True</property>
+                    <property name="justify">center</property>
+                    <property name="label">Select rooms you want to connect to. You can add more connections 
and rooms later, by clicking the + button.</property>
                     <style>
-                      <class name="polari-background-description"/>
+                      <class name="dim-label"/>
                     </style>
                   </object>
                 </child>
-                <child>
-                  <object class="GtkLabel">
-                    <property name="visible">True</property>
-                    <property name="label">connections and rooms later, by clicking the + button.</property>
-                    <style>
-                      <class name="polari-background-description"/>
-                    </style>
-                  </object>
-                </child>
-              </object>
+                </object>
             </child>
             <child>
-              <object class="GtkBox">
+              <object class="Gjs_ServerRoomList" id="serverRoomList">
                 <property name="visible">True</property>
-                <property name="orientation">vertical</property>
-                <property name="spacing">18</property>
-                <child>
-                  <object class="Gjs_ServerRoomList" id="serverRoomList">
-                    <property name="visible">True</property>
-                    <property name="vexpand">True</property>
-                  </object>
-                </child>
+                <property name="vexpand">True</property>
               </object>
             </child>
           </object>