User prefrence: align all control groups on top. And some padding for follow category.

app/assets/javascripts/discourse/templates/user/preferences.js.handlebars

@@ -13,7 +13,7 @@
       <div class="controls">
         <span class='static'>{{username}}</span>
         {{#if can_edit_username}}
-          {{#link-to "preferences.username" class="btn pad-left"}}<i class="fa fa-pencil"></i>{{/link-to}}
+          {{#link-to "preferences.username" class="btn btn-small pad-left no-text"}}<i class="fa fa-pencil"></i>{{/link-to}}
         {{/if}}
       </div>
       <div class='instructions'>
@@ -42,7 +42,7 @@
         <label class="control-label">{{i18n user.title.title}}</label>
         <div class="controls">
           <span class="static">{{title}}</span>
-          {{#link-to "preferences.badgeTitle" class="btn pad-left"}}<i class="fa fa-pencil"></i>{{/link-to}}
+          {{#link-to "preferences.badgeTitle" class="btn btn-small pad-left no-text"}}<i class="fa fa-pencil"></i>{{/link-to}}
         </div>
       </div>
     {{/if}}
@@ -52,7 +52,7 @@
       <div class="controls">
         <span class='static'>{{email}}</span>
         {{#if can_edit_email}}
-          {{#link-to "preferences.email" class="btn pad-left no-text"}}<i class="fa fa-pencil"></i>{{/link-to}}
+          {{#link-to "preferences.email" class="btn btn-small pad-left no-text"}}<i class="fa fa-pencil"></i>{{/link-to}}
         {{/if}}
       </div>
       <div class='instructions'>

app/assets/stylesheets/common/base/compose.scss

@@ -44,24 +44,22 @@ div.ac-wrap.disabled {
 div.ac-wrap {
   background-color: $secondary;
   border: 1px solid scale-color($primary, $lightness: 90%);
-  padding: 5px 10px;
+  padding: 5px 4px 1px 4px;
   div.item {
     float: left;
+    margin-bottom: 4px;
     margin-right: 10px;
-    margin-bottom: 5px;
     span {
-      padding-left: 5px;
-      height: 22px;
+      height: 24px;
       display: inline-block;
-      line-height: 22px;
-      vertical-align: bottom;
+      line-height: 20px;
     }
     a.remove {
       margin-left: 4px;
-      font-size: 10px;
+      font-size: 11px;
       line-height: 10px;
-      padding: 2px 1px 1px 3px;
-      border-radius: 10px;
+      padding: 1.5px 1.5px 1.5px 2.5px;
+      border-radius: 12px;
       width: 10px;
       display: inline-block;
       border: 1px solid scale-color($primary, $lightness: 90%);
@@ -75,10 +73,11 @@ div.ac-wrap {
   }
   input[type="text"] {
     float: left;
-    margin-top: 5px;
+    margin-bottom: 4px;
+    height: 24px;
+    display: block;
     border: 0;
     padding: 0;
-    margin: 4px 0 0;
     box-shadow: none;
   }
 }

app/assets/stylesheets/desktop/discourse.scss

@@ -328,6 +328,7 @@ body {
     }
   }
   .control-group {
+    margin-bottom: 9px;
     &.warning {
       > label {
         color: $danger;
@@ -463,9 +464,6 @@ body {
     display: none;
   }
 
-  .control-group {
-    margin-bottom: 9px;
-  }
   .form-horizontal {
     .control-group {
       margin-bottom: 18px;
@@ -486,7 +484,6 @@ body {
     .control-label {
       float: left;
       width: 140px;
-      padding-top: 5px;
       text-align: right;
       font-weight: bold;
     }

app/assets/stylesheets/desktop/user.scss

@@ -58,8 +58,6 @@
 
   .static {
     color: $primary;
-    margin-top: 5px;
-    margin-left: 5px;
     display: inline-block;
   }
   .instructions {
@@ -84,7 +82,6 @@
   }
 
   .other .controls {
-    margin-top: 10px;
     select {
       width: 280px;
     }