more mobile styles

dmd-web-and-mobile · Apr 4, 2016 · de6754e · de6754e
1 parent 8abb6d7
commit de6754e
Show file tree

Hide file tree

Showing 7 changed files with 51 additions and 41 deletions.
diff --git a/www/wp-content/themes/ation2016/src/styles/components/_footer.scss b/www/wp-content/themes/ation2016/src/styles/components/_footer.scss
@@ -1,3 +1,29 @@
+$footer-font-size: 12px;
+$footer-link-color: $white;
+
 footer {
     border-top: 1px solid $light-grey;
+    background-color: $grey;
+
+    .footer-links {
+	    ul {
+	        list-style-type: none;
+	        margin: 0;
+	        padding: 0;
+	        float: right;
+	        @media ( max-width: $screen-xs-max ) {
+	    		float: left;
+	    	}
+	        li {
+	            display: inline-block;
+	            padding-right: 20px;
+	            color: $white;
+	            font-size: $footer-font-size;
+	            line-height: ($footer-font-size * 2) + 12px;
+	            a,a:hover {
+	                color: $footer-link-color;
+	            }
+	        }
+	    }
+	}
 }
diff --git a/www/wp-content/themes/ation2016/src/styles/components/_mobile-menu.scss b/www/wp-content/themes/ation2016/src/styles/components/_mobile-menu.scss
@@ -58,7 +58,7 @@ $mobile-menu-width: 225px;
 
             a {
                 color: $white;
-                padding: 10px 10px;
+                padding: 20px 10px;
                 display: block;
                 text-decoration: none;
 
@@ -106,6 +106,7 @@ header .mobile-btn {
     font-size: 30px;
     text-decoration: none;
     font-family: $header-font;
+    line-height: $header-height-sticky;
     &:hover {
         text-decoration: none;
     }

diff --git a/www/wp-content/themes/ation2016/src/styles/components/_work.scss b/www/wp-content/themes/ation2016/src/styles/components/_work.scss
@@ -6,7 +6,6 @@ $work-bar-box-shadow: 0px 4px 15px 0px $work-bar-box-shadow-color;
   background-color: $orange;
   color: white;
   text-align: center;
-  height: $work-bar-height;
   line-height: $work-bar-height;
   font-size: 18px;
   text-transform: uppercase;

diff --git a/www/wp-content/themes/ation2016/src/styles/type/_typography.scss b/www/wp-content/themes/ation2016/src/styles/type/_typography.scss
@@ -1,9 +1,6 @@
 $p-font-size: 18px;
 $p-color: $grey;
 
-$footer-font-size: 12px;
-$footer-link-color: $grey;
-
 $link-color: $orange;
 
 
@@ -42,20 +39,3 @@ a {
     }
 }
 
-.footer-links {
-    ul {
-        list-style-type: none;
-        margin: 0;
-        padding: 0;
-        li {
-            display: inline-block;
-            padding-right: 20px;
-            color: $p-color;
-            font-size: $footer-font-size;
-            line-height: ($footer-font-size * 2) + 12px;
-            a,a:hover {
-                color: $footer-link-color;
-            }
-        }
-    }
-}
diff --git a/www/wp-content/themes/ation2016/static/styles/site.css b/www/wp-content/themes/ation2016/static/styles/site.css
@@ -5850,19 +5850,6 @@ a {
   a:hover {
     color: #cc5b00; }
 
-.footer-links ul {
-  list-style-type: none;
-  margin: 0;
-  padding: 0; }
-  .footer-links ul li {
-    display: inline-block;
-    padding-right: 20px;
-    color: #a8a8a8;
-    font-size: 12px;
-    line-height: 36px; }
-    .footer-links ul li a, .footer-links ul li a:hover {
-      color: #a8a8a8; }
-
 .admin-bar header {
   top: 32px; }
 
@@ -5936,7 +5923,6 @@ html, body {
   background-color: #ff7200;
   color: white;
   text-align: center;
-  height: 60px;
   line-height: 60px;
   font-size: 18px;
   text-transform: uppercase;
@@ -6003,7 +5989,24 @@ html, body {
         margin-top: 0; }
 
 footer {
-  border-top: 1px solid #eeeeee; }
+  border-top: 1px solid #eeeeee;
+  background-color: #a8a8a8; }
+  footer .footer-links ul {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+    float: right; }
+    @media (max-width: 767px) {
+      footer .footer-links ul {
+        float: left; } }
+    footer .footer-links ul li {
+      display: inline-block;
+      padding-right: 20px;
+      color: white;
+      font-size: 12px;
+      line-height: 36px; }
+      footer .footer-links ul li a, footer .footer-links ul li a:hover {
+        color: white; }
 
 .mobile-menu {
   box-sizing: border-box;
@@ -6046,7 +6049,7 @@ footer {
       border-bottom: 1px solid white; }
       .mobile-menu > ul > li a {
         color: white;
-        padding: 10px 10px;
+        padding: 20px 10px;
         display: block;
         text-decoration: none; }
         .mobile-menu > ul > li a:hover {
@@ -6078,7 +6081,8 @@ body.mobile-active {
 header .mobile-btn {
   font-size: 30px;
   text-decoration: none;
-  font-family: "Source Sans Pro", sans-serif; }
+  font-family: "Source Sans Pro", sans-serif;
+  line-height: 70px; }
   header .mobile-btn:hover {
     text-decoration: none; }
 

diff --git a/www/wp-content/themes/ation2016/static/styles/site.min.css b/www/wp-content/themes/ation2016/static/styles/site.min.css
diff --git a/www/wp-content/themes/ation2016/templates/footer.twig b/www/wp-content/themes/ation2016/templates/footer.twig
@@ -8,7 +8,7 @@
             </ul>
         </div>
         <div class="footer-links col-sm-12 col-md-6">
-            <ul class="social pull-right">
+            <ul class="social">
                 <li><a href="https://vimeo.com/ation">Vimeo</a></li>
                 <li><a href="https://www.facebook.com/ATIONDM/">Facebook</a></li>
                 <li><a href="https://twitter.com/ATIONDM">Twitter</a></li>