Improve Profile#account page UI

app/assets/stylesheets/common.scss

@@ -270,26 +270,6 @@ li.note {
   }
 }
 
-.oauth_select_holder {
-  img {
-    padding: 5px;
-    margin-right: 10px;
-  }
-  .active {
-    img {
-      border: 1px solid #ccc;
-      background: $hover;
-      @include border-radius(5px);
-    }
-  }
-}
-
-.btn-build-token {
-  float: left;
-  padding: 6px 20px;
-  margin-right: 12px;
-}
-
 .gitlab-promo {
   a {
     color: #aaa;

app/assets/stylesheets/sections/profile.scss

@@ -4,3 +4,41 @@
     margin-bottom: 0;
   }
 }
+
+.account-page {
+  fieldset {
+    margin-bottom: 15px;
+    border-bottom: 1px dashed #ddd;
+    padding-bottom: 15px;
+
+    &:last-child {
+      border: none;
+    }
+
+    legend {
+      border: none;
+      margin: 0;
+    }
+  }
+}
+
+.oauth_select_holder {
+  img {
+    padding: 2px;
+    margin-right: 10px;
+  }
+  .active {
+    img {
+      border: 1px solid #4BD;
+      background: $hover;
+      @include border-radius(5px);
+    }
+  }
+}
+
+.btn-build-token {
+  float: left;
+  padding: 6px 20px;
+  margin-right: 12px;
+}
+

app/views/profiles/accounts/show.html.haml

@@ -7,7 +7,7 @@
 %hr
 
 
-%div
+.account-page
   %fieldset.update-token
     %legend
       Private token
@@ -33,7 +33,7 @@
   - if show_profile_social_tab?
     %fieldset
       %legend Social Accounts
-      .oauth_select_holder
+      .oauth_select_holder.append-bottom-10
         %p Click on icon to activate signin with one of the following services
         - enabled_social_providers.each do |provider|
           %span{class: oauth_active_class(provider) }