update styling and put content inside .container

fameandpartners · Dec 29, 2016 · 07cf0ad · 07cf0ad
1 parent 9737a95
commit 07cf0ad
Show file tree

Hide file tree

Showing 7 changed files with 67 additions and 56 deletions.
diff --git a/app/assets/stylesheets/redesign/_error.scss b/app/assets/stylesheets/redesign/_error.scss
@@ -1,4 +1,4 @@
-// 404 - 500 Pages
+// Error Pages (Errors 404, 500 etc)
 .error-page {
   margin: 100px auto;
 
@@ -23,13 +23,4 @@
     @extend .link-underline;
   }
 
-  .thin-bottom::after {
-    content: "";
-    padding-bottom: 50px;
-    border-bottom: 1px solid #000;
-    width: 90px;
-    display: block;
-    margin: 0 auto;
-  }
-
 }
diff --git a/app/assets/stylesheets/redesign/generic/_helpers.scss b/app/assets/stylesheets/redesign/generic/_helpers.scss
@@ -174,6 +174,22 @@
 
 }
 
+.thin-line {
+
+  &--bottom::after {
+    content: "";
+    padding-bottom: 50px;
+    border-bottom: 1px solid $c-neutral-black;
+    width: 90px;
+    display: block;
+  }
+
+  &--alignCenter::after {
+    margin: 0 auto;
+  }
+
+}
+
 @media (min-width: $bootstrap-md-width) {
 
   .no-margin-md {

diff --git a/app/assets/stylesheets/redesign/pages/_why-us.scss b/app/assets/stylesheets/redesign/pages/_why-us.scss
@@ -33,12 +33,8 @@
   }
 
   .heading-thin-line-bottom::after {
-    content: "";
-    padding-bottom: 40px;
+    @extend .thin-line--bottom;
     margin-bottom: 40px;
-    border-bottom: 1px solid $c-neutral-black;
-    width: 90px;
-    display: block;
   }
 
   @media (max-width: $bootstrap-md-width - 1px) {
@@ -63,7 +59,7 @@
       }
 
     }
-    
+
   }
 
 }
diff --git a/app/views/errors/404.html.slim b/app/views/errors/404.html.slim
@@ -2,12 +2,14 @@
 
 = render 'errors/analytics_javascript', locals: { code: 404, message: 'not found'}
 
-.error-page.text-center
-  h1
-    | Looking for something?
-  h2
-    | <em>Sorry,</em> this page doesn't exist.
-  p
-    | Try our #{link_to "homepage", root_path} to see what's new and start customizing.
-  p.thin-bottom
-    | Still can't find what you're looking for? #{link_to "E-mail us", 'mailto:team@fameandpartners.com'} at team@fameandpartners.com.
+.container
+  .col-xs-12
+    .error-page.text-center
+      h1
+        | Looking for something?
+      h2
+        | <em>Sorry,</em> this page doesn't exist.
+      p
+        | Try our #{link_to "homepage", root_path} to see what's new and start customizing.
+      p.thin-line--bottom.thin-line--alignCenter
+        | Still can't find what you're looking for? #{link_to "E-mail us", 'mailto:team@fameandpartners.com'} at team@fameandpartners.com.
diff --git a/app/views/errors/422.html.slim b/app/views/errors/422.html.slim
@@ -2,12 +2,14 @@
 
 = render 'errors/analytics_javascript', locals: { code: 422, message: 'unprocessable entity'}
 
-.error-page.text-center
-  h1
-    | The change you wanted was rejected.
-  h2
-    | Maybe you tried to change something you didn't have access to.
-  p.thin-bottom
-    = link_to 'Go to homepage', root_path
-  p.thin-bottom
-    | Still can't find what you're looking for? #{link_to "E-mail us", 'mailto:team@fameandpartners.com'} at team@fameandpartners.com.
+.container
+  .col-xs-12
+    .error-page.text-center
+      h1
+        | The change you wanted was rejected.
+      h2
+        | Maybe you tried to change something you didn't have access to.
+      p
+        | Try our #{link_to "homepage", root_path} to see what's new and start customizing.
+      p.thin-line--bottom.thin-line--alignCenter
+        | Still can't find what you're looking for? #{link_to "E-mail us", 'mailto:team@fameandpartners.com'} at team@fameandpartners.com.
diff --git a/app/views/errors/500.html.slim b/app/views/errors/500.html.slim
@@ -2,16 +2,18 @@
 
 = render 'errors/analytics_javascript', locals: { code: 500, message: 'server error'}
 
-.error-page.text-center
-  h1
-    | So sorry to interrupt your shopping experience.
-  p
-    | In the meantime, here is a $20 voucher to make up for your time - just use this code <strong>@checkout: OOPS20</strong></p>
-  p
-    | We should be back up in a few minutes but if you would like some further assistance, feel free to email or call us:
-  p
-    = link_to 'team@fameandpartners.com', 'mailto:team@fameandpartners.com'
-  p
-    | Our site engineers are currently making some upgrades to make it even better.
-  p.thin-bottom
-    = link_to 'Go to homepage', root_path
+.container
+  .col-xs-12
+    .error-page.text-center
+      h1
+        | So sorry to interrupt your shopping experience.
+      p
+        | In the meantime, here is a $20 voucher to make up for your time - just use this code <strong>@checkout: OOPS20</strong></p>
+      p
+        | We should be back up in a few minutes but if you would like some further assistance, feel free to email or call us:
+      p
+        = link_to 'team@fameandpartners.com', 'mailto:team@fameandpartners.com'
+      p
+        | Our site engineers are currently making some upgrades to make it even better.
+      p.thin-line--bottom.thin-line--alignCenter
+        = link_to 'Go to homepage', root_path
diff --git a/app/views/errors/not_found.html.slim b/app/views/errors/not_found.html.slim
@@ -1,12 +1,14 @@
-.error-page.text-center
-  h1
-    | Looking for something?
-  h2
-    | <em>Sorry,</em> this page doesn't exist.
-  p
-    | Try our #{link_to "homepage", '/'} to see what's new and start customizing.
-  p.thin-bottom
-    | Still can't find what you're looking for? #{link_to "E-mail us", 'mailto:team@fameandpartners.com'} at team@fameandpartners.com.
+.container
+  .col-xs-12
+    .error-page.text-center
+      h1
+        | Looking for something?
+      h2
+        | <em>Sorry,</em> this page doesn't exist.
+      p
+        | Try our #{link_to "homepage", root_path} to see what's new and start customizing.
+      p.thin-line--bottom.thin-line--alignCenter
+        | Still can't find what you're looking for? #{link_to "E-mail us", 'mailto:team@fameandpartners.com'} at team@fameandpartners.com.
 
 javascript:
   (function (i, s, o, g, r, a, m) {