Visual design feedback

**Why**: Small visual tweaks
18F · Aug 15, 2016 · 77c19f9 · 77c19f9
1 parent b5c00d9
commit 77c19f9
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 3 deletions.
diff --git a/app/assets/stylesheets/components/_margin.scss b/app/assets/stylesheets/components/_margin.scss
@@ -0,0 +1,19 @@
+.m5 { margin: $space-5; }
+.mt5 { margin-top: $space-5; }
+.mr5 { margin-right: $space-5; }
+.mb5 { margin-bottom: $space-5; }
+.ml5 { margin-left: $space-5; }
+.mx5 {
+  margin-left: $space-5;
+  margin-right: $space-5;
+}
+
+.my5 {
+  margin-bottom: $space-5;
+  margin-top: $space-5;
+}
+
+.mxn5 {
+  margin-left: -$space-5;
+  margin-right: -$space-5;
+}
diff --git a/app/assets/stylesheets/components/all.scss b/app/assets/stylesheets/components/all.scss
@@ -12,6 +12,7 @@
 @import 'form';
 @import 'heading';
 @import 'list';
+@import 'margin';
 @import 'nav';
 @import 'number';
 @import 'password';

diff --git a/app/assets/stylesheets/variables/_web.scss b/app/assets/stylesheets/variables/_web.scss
@@ -32,11 +32,12 @@ $space-1: .5rem !default;
 $space-2: 1rem !default;
 $space-3: 2rem !default;
 $space-4: 3rem !default;
+$space-5: 4rem !default;
 
 $form-field-font-size: 1rem !default;
 $form-field-height: 2.5rem !default;
 $form-field-padding-y: .5rem !default;
-$form-field-padding-x: .5rem !default;
+$form-field-padding-x: .75rem !default;
 
 $button-font-size: inherit !default;
 $button-font-weight: bold !default;

diff --git a/app/views/profile/index.html.slim b/app/views/profile/index.html.slim
@@ -4,7 +4,7 @@
 - btn_cls = 'btn btn-primary px2 py0 h6 regular sm-col-12 border-box center'
 .mb3.h6.caps.red = t('headings.profile.main')
 h2.heading = t('headings.profile.login_info')
-.mb4
+.mb5
   .py2.border-bottom
     .clearfix.mxn1
       .sm-col.sm-col-5.px1 = 'Email address'
@@ -35,7 +35,7 @@ h2.heading = t('headings.profile.login_info')
 h2.heading
   | #{t('headings.profile.agencies')} #{tooltip(t('tooltips.placeholder'))}
 - if current_user.active_identities.empty?
-  p.mt2.mb4.italic You haven't logged into any agencies yet.
+  p.mt2.mb5.italic You haven't logged into any agencies yet.
 else
   - current_user.active_identities.each do |i|
     .py2.border-top

diff --git a/app/views/users/edit_email/edit.html.slim b/app/views/users/edit_email/edit.html.slim
@@ -6,3 +6,4 @@ h1.heading = t('headings.edit_info.email')
   = f.error_notification
   = f.input :email, required: true
   = f.button :submit, 'Update'
+.mt2 = link_to 'Cancel', :back, class: 'underline'
diff --git a/app/views/users/edit_phone/edit.html.slim b/app/views/users/edit_phone/edit.html.slim
@@ -7,3 +7,4 @@ h1.heading = t('headings.edit_info.phone')
   = f.error_notification
   = f.input :phone, as: :tel, required: true
   = f.button :submit, 'Update'
+.mt2 = link_to 'Cancel', :back, class: 'underline'