Review changes

- Moved stuff to align left on mobile. - Fixed spacing on process page with class that removes color since block__bg basically provides the spacing for everything in the sidebar.
cfpb · Oct 25, 2016 · 07239fd · 07239fd
1 parent 91dd2fe
commit 07239fd
Show file tree

Hide file tree

Showing 7 changed files with 17 additions and 14 deletions.
diff --git a/src/closing-disclosure/index.html b/src/closing-disclosure/index.html
@@ -21,7 +21,7 @@ <h1 class="page-title">Closing Disclosure Explainer</h1>
                       block__flush-top
                       block__padded-top
                       block__flush-bottom
-                      u-right">
+                      u-right-on-desktop">
             {{ social_media.render( {
                   'title':  'Check out this page from the @CFPB'
             } ) }}

diff --git a/src/explore-rates/index.html b/src/explore-rates/index.html
@@ -27,7 +27,7 @@ <h2 class="page-title">Explore interest rates<sup class="beta">BETA</sup></h2>
                         block__flush-top
                         block__padded-top
                         block__flush-bottom
-                        u-right">
+                        u-right-on-desktop">
               {{ social_media.render( {
                     'title':  'Check out this page from the @CFPB'
               } ) }}

diff --git a/src/loan-estimate/index.html b/src/loan-estimate/index.html
@@ -25,7 +25,7 @@ <h1 class="page-title">Loan Estimate Explainer</h1>
                       block__flush-top
                       block__padded-top
                       block__flush-bottom
-                      u-right">
+                      u-right-on-desktop">
             {{ social_media.render( {
                   'title':  'Check out this page from the @CFPB'
             } ) }}

diff --git a/src/loan-options/index.html b/src/loan-options/index.html
@@ -24,7 +24,7 @@ <h1>Understand loan options</h1>
                     block__flush-top
                     block__flush-bottom
                     block__padded-bottom
-                    social-media_container">
+                    u-right-on-desktop">
           {{ social_media.render( {
                 'title':  'Check out this page from the @CFPB'
           } ) }}

diff --git a/src/process/_process-step.html b/src/process/_process-step.html
@@ -85,7 +85,7 @@ <h3 class="h6 u-mb15">Tools for this Phase</h3>
                   </div>
                 {% endfor %}
               </section>
-              <div class="block">
+              <div class="block block__bg u-no-bg">
                 {{ social_media.render( {
                       'title':  'Check out this page from the @CFPB'
                 } ) }}

diff --git a/src/static/css/module/helpers.less b/src/static/css/module/helpers.less
@@ -365,6 +365,10 @@ object {
     background-color: @block__bg;
 }
 
+.u-no-bg {
+   background-color: transparent;
+}
+
 .content-l_col {
     .respond-to-min(@tablet-min, {
         &.content-l_col-1-3 + &.content-l_col-2-3,
@@ -378,13 +382,18 @@ object {
 
 .content-l_col-1-4  {
   .respond-to-min(@tablet-min, {
-    .grid_column(1, 4);    
+    .grid_column(1, 4);
   });
 }
 
-.content-l_col-3-4  {    
+.content-l_col-3-4  {
   .respond-to-min(@tablet-min, {
-    .grid_column(3, 4);    
+    .grid_column(3, 4);
   });
 }
 
+.u-right-on-desktop {
+  .respond-to-min( 801px, {
+    text-align: right;
+  });
+}
diff --git a/src/static/css/module/loan-options.less b/src/static/css/module/loan-options.less
@@ -23,12 +23,6 @@ ul.unindent-ul{
   }
 }
 
-.respond-to-min( 801px, {
-  .content__loan-options .social-media_container {
-    text-align: right;
-  }
-});
-
 // Expandables
 
 .type-details {