#71. Added styles for mobile hero text.

miemma · Apr 21, 2017 · 00c670f · 00c670f
1 parent d16ef1f
commit 00c670f
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 5 deletions.
diff --git a/emma/static/styl/landing/home-responsive.styl b/emma/static/styl/landing/home-responsive.styl
@@ -9,11 +9,34 @@
       width 72%
 
 @media screen and (max-width: 600px)
-  .landing-video-section .col-xs-9
-      width 91.6%
+  .landing-video-section
+    .desktop-content
+      display none
 
-  .landing-video-section .col-xs-6
-      width 72%
+    .mobile-content
+      display block
+
+      .emma-btn-dark
+        display block
+        width 280px
+        center-block()
+        font-family 'Avenir LT Std Heavy'
+        margin-top 10px
+
+  .homepage-hero__mobile-title
+    font-family 'Avenir LT Std Heavy'
+    font-size 24px
+
+  .homepage-hero__mobile-subtitle
+    font-size 18px
+    font-family 'Avenir LT Std Heavy'
+    margin-top 8px
+    display block
+    line-height 1.3
+
+  .homepage-hero__mobile-paragraph
+    margin-top 13px
+    margin-bottom 20px
 
 @media screen and (max-width: 1023px)
   .landing-agend-call__main-div

diff --git a/emma/static/styl/landing/home.styl b/emma/static/styl/landing/home.styl
@@ -22,11 +22,22 @@
     right 0
     top 0
     z-index 2
+    width 100%
 
   .text-container
     position relative
     top 50%
     transform translateY(calc(-50%))
+    width 100%
+
+  .mobile-content
+    display none
+    text-align center
+    color white
+    center-block()
+    font-family 'Avenir LT Std Medium'
+    width 90%
+    max-width 380px
 
 .landing-testimonial
   font-size remify(18)

diff --git a/emma/templates/landing/index.html b/emma/templates/landing/index.html
@@ -62,7 +62,7 @@
         </div>
         <div class="mobile-content">
           <h1 class="homepage-hero__mobile-title">Un acompañamiento con propósito para tu ser querido</h1>
-          <span class="homepage-hero__mobile-subtitle">Emma lleva calidad de vida al hogar de los adultos mayores.</span>
+          <span class="homepage-hero__mobile-subtitle">Emma lleva calidad de vida al hogar de los adultos mayores.</span>
           <p class="homepage-hero__mobile-paragraph">
             ¿Necesitas apoyo para evaluar tu caso? Nosotros podemos ayudar. Programa una valoración sin costo.
           </p>