[ux] change font sizes on headings, port h3 to h4 on settings

clientapp/templates.js

@@ -196,7 +196,7 @@ exports.pages.groupchat = function anonymous(locals) {
 exports.pages.main = function anonymous(locals) {
     var buf = [];
     with (locals || {}) {
-        buf.push('<section class="page main"><div><h3>Current status</h3><div contenteditable="true" class="status"></div></div><div id="avatarChanger"><h3>Change Avatar</h3><div class="uploadRegion"><p>Drag and drop a new avatar here</p><img/><form><input id="uploader" type="file"/></form></div></div><div><h3>Add / Approve Contacts</h3><input type="text" id="addcontact" class="inline"/><button class="addContact">Add</button><ul id="contactrequests"></ul></div><div><h3>Desktop Integration</h3><button class="enableAlerts">Enable alerts</button><button class="primary installFirefox">Install app</button></div></section>');
+        buf.push('<section class="page main"><div><h4>Current status</h4><div contenteditable="true" class="status"></div></div><div id="avatarChanger"><h4>Change Avatar</h4><div class="uploadRegion"><p>Drag and drop a new avatar here</p><img/><form><input id="uploader" type="file"/></form></div></div><div><h4>Add / Approve Contacts</h4><input type="text" id="addcontact" class="inline"/><button class="addContact">Add</button><ul id="contactrequests"></ul></div><div><h4>Desktop Integration</h4><button class="enableAlerts">Enable alerts</button><button class="primary installFirefox">Install app</button></div></section>');
     }
     return buf.join("");
 };

clientapp/templates/pages/main.jade

@@ -1,11 +1,11 @@
 section.page.main
 
   div
-    h3 Current status
+    h4 Current status
     .status(contenteditable="true")
 
   div#avatarChanger
-    h3 Change Avatar
+    h4 Change Avatar
     div.uploadRegion
       p Drag and drop a new avatar here
       img
@@ -13,12 +13,12 @@ section.page.main
         input#uploader(type="file")
 
   div
-    h3 Add / Approve Contacts
+    h4 Add / Approve Contacts
     input(type="text", class="inline")#addcontact
     button.addContact Add
     ul#contactrequests
 
   div
-    h3 Desktop Integration
+    h4 Desktop Integration
     button.enableAlerts Enable alerts
     button.primary.installFirefox Install app

public/css/_variables.styl

@@ -52,10 +52,10 @@ $font-size-base = 14px
 $font-size-small = 12px
 $font-size-smaller = 10px
 
-$font-size-h1 = 30px
-$font-size-h2 = 24px
-$font-size-h3 = 18px
-$font-size-h4 = 14px
+$font-size-h1 = 28px
+$font-size-h2 = 22px
+$font-size-h3 = 16px
+$font-size-h4 = 12px
 
 $line-height-base = 18px
 $line-height-headings = 26px

public/css/app/layout.styl

@@ -12,9 +12,9 @@ body
 h1, h2, h3, h4
   color: darken($gray, 30%)
 
-h3
+h4
   margin-top: 0
-  font-size: $font-size-h3
+  font-size: $font-size-h4
 
 a
   color: $blue

public/css/otalk.css

@@ -175,9 +175,9 @@ h3,
 h4 {
   color: #3c3c3c;
 }
-h3 {
+h4 {
   margin-top: 0;
-  font-size: 18px;
+  font-size: 12px;
 }
 a {
   color: #12acef;
@@ -1345,7 +1345,7 @@ rgba(0,0,0,0.2)
   color: #fff;
 rgba(0,0,0,0.7)
   line-height: 1;
-  font-size: 18px;
+  font-size: 16px;
 }
 #calls .caller {
   margin: 0;

public/x-manifest.cache

@@ -1,5 +1,5 @@
 CACHE MANIFEST
-# 0.0.1 1382653746877
+# 0.0.1 1382694727785
 
 CACHE:
 /app.js