issue #89: Looking good now. Code cleaned up, sufficiently responsive…

…. Possibly redundant files still in the system (unused image files), but looking for input there. Ready for review.)

git push
git commit --amend -m issue

app/assets/stylesheets/hero.scss

@@ -1,50 +1,57 @@
+//---- Styles -----//
+
 .row__hero-banner {
-   // margin:  0.5em 0.5em 0em 0.5em;
 
     h1 {
-        text-indent:    -9999px;
+        text-indent: -9999px;
         margin: auto;
-        max-width:  100%;
-        // min-height: 13vw;
-        background-image:   url([email protected]);
-        background-size:    contain;
-        background-repeat:  no-repeat;
+        max-width: 100%;
+        background-image: url([email protected]);
+        background-size: contain;
+        background-repeat: no-repeat;
         background-position: center;
-        overflow:   hidden;
+        overflow: hidden;
       }
 }
 
 .row__hero-flow {
-    text-align:   center;
-    // background-image:   url([email protected]); 
-    background-size:    contain;
-    background-repeat:  no-repeat;
+    text-align: center;
+    background-size: contain;
+    background-repeat: no-repeat;
     background-position: center;
 }
 
+.page-header__login {
+    text-align: center;
+}
+
+.page-header__call-to-action    {
+    text-align: center;
+}
+
+
 // ----- Responsive Section ----- //
 
 //  Bootstrap...........Large (lg) 1200px or greater (Desktop)
 
 
 
-
 //  Bootstrap..........Medium (md)  992px or greater (Desktop)
 
 @media (min-width: 992px)  {
     .row__hero-banner {
         //margin:  0.5em 0.5em 0em 0.5em;
 
         h1 {
-            text-indent:    -9999px;
+            text-indent: -9999px;
             margin: auto;
-            max-width:  100%;
+            max-width: 100%;
             // min-height: 13vw;
-            background-image:   url([email protected]);
-            background-size:    contain;
-            background-repeat:  no-repeat;
+            background-image: url([email protected]);
+            background-size: contain;
+            background-repeat: no-repeat;
             background-position: center;
-            overflow:   hidden;
+            overflow: hidden;
         }
     }
 
@@ -55,17 +62,27 @@
         padding: 0em 2em 0em 2em;
         margin: auto;
     }
+}
+
+@media (min-width: 992px) and (max-width: 1199px)   { 
+    .page-header__login {
+        text-align: left;
+    }
 
+    .page-header__call-to-action    {
+        text-align: left;
+    }
 }
 
+
 //  Bootstrap...........Small (sm)  768px or greater (Tablet)
 
 @media (min-width: 768px)   {
     .row__hero-flow {
-        text-align:   center;
-        background-image:   url([email protected]);
-        background-size:    contain;
-        background-repeat:  no-repeat;
+        text-align: center;
+        background-image: url([email protected]);
+        background-size: contain;
+        background-repeat: no-repeat;
         background-position: center;
     }
 }
@@ -75,18 +92,17 @@
 
 @media (max-width: 400px)   {
     .row__hero-banner {
-       // margin:  0.5em 0.5em 0em 0.5em;
 
         h1 {
-            text-indent:    -9999px;
+            text-indent: -9999px;
             margin: auto;
-            max-width:  100%;
+            max-width: 100%;
             min-height: 40vw;
-            background-image:   url([email protected]);
-            background-size:    contain;
-            background-repeat:  no-repeat;
+            background-image: url([email protected]);
+            background-size: contain;
+            background-repeat: no-repeat;
             background-position: center;
-            overflow:   hidden;
+            overflow: hidden;
           }
     }
 }

app/views/layouts/application.html.erb

@@ -35,8 +35,8 @@
               <h1 class="page-header__title"><%= t('brand') %></h1>
               <h2 class="page-header__subtitle">Plan your meals for the  week using your favorite recipes from your self-curated cookbook.</h2>
               <h3 class="page-header__motto">We'll even build you a shopping list to take to the grocery store.</h3>
-              <div class="page-header__call-to-action text-center"><%= link_to "Start your cookbook <i class=\"glyphicon glyphicon-chevron-right \"></i>".html_safe, new_user_registration_path, class: "btn btn-primary btn-lg" %> </div>
-              <div class="page-header__login text-center">
+              <div class="page-header__call-to-action"><%= link_to "Start your cookbook <i class=\"glyphicon glyphicon-chevron-right \"></i>".html_safe, new_user_registration_path, class: "btn btn-primary btn-lg" %> </div>
+              <div class="page-header__login">
                 <p>Already have an account?</p>
                 <%= link_to "Log in to your account", new_user_session_path, class: "btn btn-default" %>
               </div>