Changeset 38996 for trunk/src/wp-content/themes/twentyseventeen/inc/color-patterns.php

Timestamp:

10/28/2016 05:37:50 PM (8 years ago)

Author:

davidakennedy

Message:

Twenty Seventeen: Fix broken and crowded pagination navigation on small screens

• Hides page numbers visually at smaller screen sizes.
• Reduced padding around .wrap class on smaller screens.
• Fixed issue with the page numbers not displaying the underline on :hover. This has been updated in the custom colors files, too.

Props laurelfulford, caspie.

Fixes #38394.

File:

• trunk/src/wp-content/themes/twentyseventeen/inc/color-patterns.php (modified) (3 diffs)

trunk/src/wp-content/themes/twentyseventeen/inc/color-patterns.php

@@ -71 +71 @@
 .colors-custom .post-navigation a:focus,
 .colors-custom .post-navigation a:hover,
+.colors-custom .pagination a:not(.prev):not(.next):focus,
+.colors-custom .pagination a:not(.prev):not(.next):hover,
+.colors-custom .comments-pagination a:not(.prev):not(.next):focus,
+.colors-custom .comments-pagination a:not(.prev):not(.next):hover,
 .colors-custom .logged-in-as a:focus,
 .colors-custom .logged-in-as a:hover,
@@ -181 +185 @@
 .colors-custom .post-navigation a:focus,
 .colors-custom .post-navigation a:hover,
-.colors-custom .pagination a:focus,
-.colors-custom .pagination a:hover,
-.colors-custom .comments-pagination a:focus,
-.colors-custom .comments-pagination a:hover,
+.colors-custom .pagination a:not(.prev):not(.next):focus,
+.colors-custom .pagination a:not(.prev):not(.next):hover,
+.colors-custom .comments-pagination a:not(.prev):not(.next):focus,
+.colors-custom .comments-pagination a:not(.prev):not(.next):hover,
 .colors-custom .logged-in-as a:focus,
 .colors-custom .logged-in-as a:hover,
@@ -478 +482 @@
 .colors-custom .wp_widget_tag_cloud a:hover,
 .colors-custom .entry-footer .edit-link a.post-edit-link:focus,
-.colors-custom .entry-footer .edit-link a.post-edit-link:hover,
-.colors-custom .prev.page-numbers:focus,
-.colors-custom .prev.page-numbers:hover,
-.colors-custom .next.page-numbers:focus,
-.colors-custom .next.page-numbers:hover {
+.colors-custom .entry-footer .edit-link a.post-edit-link:hover {
     -webkit-box-shadow: none !important;
     box-shadow: none !important;