Changeset 8444

Timestamp:

03/11/2019 10:33:51 PM (7 years ago)

Author:

coffee2code

Message:

Jobs: Port over wporg footer responsive styles for footer columns (with minor adaptations).

Location:

sites/trunk/jobs.wordpress.net/public_html/wp-content/themes/jobswp

Files:

• functions.php (modified) (1 diff)
• style.css (modified) (5 diffs)

sites/trunk/jobs.wordpress.net/public_html/wp-content/themes/jobswp/functions.php

@@ -110 +110 @@
     wp_enqueue_style( 'dashicons' );
     wp_enqueue_style( 'open-sans' );
-    wp_enqueue_style( 'jobswp-style', get_stylesheet_uri(), array(), '20190307' );
+    wp_enqueue_style( 'jobswp-style', get_stylesheet_uri(), array(), '20190311' );
 
     wp_enqueue_script( 'jobswp-navigation', get_template_directory_uri() . '/js/navigation.js', array( 'jquery'), '20131107', true );

sites/trunk/jobs.wordpress.net/public_html/wp-content/themes/jobswp/style.css

@@ -1202 +1202 @@
 }
 
-#wporg-footer ul:first-child {
-    margin-left: 0;
+@media screen and (min-width:960px) {
+    #wporg-footer ul:first-child {
+        margin-left: 0;
+    }
+}
+
+@media screen and (min-width:561px) and (max-width:995px) {
+    #wporg-footer .wrapper {
+        max-width: 600px;
+    }
+
+    #wporg-footer ul:nth-child(3n+1) {
+        margin-left: 0;
+    }
+
+    #wporg-footer ul:nth-child(4n) {
+        clear: both;
+    }
+
+    #wporg-footer ul {
+        margin-left: 2%;
+        width: 32%;
+    }
+}
+
+@media screen and (max-width:560px) {
+    #wporg-footer .wrapper {
+        max-width: 360px;
+    }
+
+    #wporg-footer ul:nth-child(2n+1) {
+        margin-left: 0;
+    }
+
+    #wporg-footer ul:nth-child(odd) {
+        clear: both;
+    }
+
+    #wporg-footer ul {
+        margin-left: 4%;
+        width: 48%;
+    }
 }
 
@@ -1249 +1289 @@
 }
 .jobswp #wporg-footer .wrapper {
-    width: 100%;
+    margin: 0 auto;
     text-align: left;
 }
@@ -1263 +1303 @@
     padding-left: 0;
     margin-top: 0;
-    margin-left: 28px;
 }
 .jobswp #wporg-footer a:hover {
@@ -1270 +1309 @@
 .jobswp #wporg-footer a:visited {
     color: #4ca6cf;
+}
+
+@media only screen and (max-width: 767px) {
+    .jobswp #wporg-footer .wrapper {
+        width: 442px;
+    }
+}
+
+@media only screen and (max-width: 560px) {
+    .jobswp #wporg-footer .wrapper {
+        width: 285px;;
+    }
 }
 
@@ -1284 +1335 @@
     #subhead .wporg-link a {
         font-size: 0.78em;
-    }
-    #wporg-footer ul {
-        width: 110px;
     }
 }