Changeset 8206 for sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

Timestamp:

02/05/2019 09:55:07 PM (8 years ago)

Author:

coffee2code

Message:

Developer: Miscellaneous Code Reference landing page UI tweaks.

• Reduce padding within widget headers
• Remove border above search form
• Center horizontal list of topics
• Move search filter checkboxes onto separate line from label on smaller viewports
• Ensure consistent margin between sections and left of viewport
• Vertically center checkboxes with labels in form (and also in search slide-down panel)

File:

• sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss (modified) (7 diffs)

sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

@@ -533 +533 @@
                 }
 
+                .widget-title {
+                        line-height: 60px;
+                        line-height: 6rem;
+                }
+
+                &.search-guide {
+                        border-top: 2px solid #efefef;
+                }
+
                 @media ( max-width: 974px ) {
                         width: 640px;
@@ -561 +570 @@
                 }
                 &.search-guide {
-                        border-top: 2px solid #efefef;
                         padding-top: 60px;
                         padding-top: 6rem;
@@ -575 +583 @@
                         font-size: 25px;
                         font-size: 2.5rem;
-                        line-height: 60px;
-                        line-height: 6rem;
+                        line-height: 20px;
+                        line-height: 2rem;
                         .dashicons {
                                 color: #222;
@@ -822 +830 @@
                                 padding-right: 1.3em;
                                 input {
+                                        margin-bottom: 6px;
                                         padding-left: 0.5em;
+                                        vertical-align: middle;
                                 }
                         }
                         label:last-child {
                                 border-right-width: 0;
+                        }
+
+                        @media ( max-width: 688px ) {
+                                span {
+                                        display: block;
+                                }
+
+                                label {
+                                        margin-left: 0;
+                                        margin-right: 1em;
+                                        width: 130px;
+
+                                        &:last-child {
+                                                margin-right: 0;
+                                                padding-right: 0;
+                                                width: initial;
+                                        }
+                                }
                         }
                 }
@@ -928 +956 @@
         }
         .horizontal-list {
-                display: inline;
+                display: block;
+                width: 100%;
                 list-style-type: none;
                 margin: 0;
                 padding: 0;
+                text-align: center;
         }
         .horizontal-list li {
@@ -2334 +2364 @@
                         }
                 }
+                #content-area {
+                        padding-left: 2%;
+                }
 
                 &.archive, &.search {
@@ -2358 +2391 @@
                         .sourcefile {
                                 float: left;
+                        }
+                }
+                #content-area {
+                        @media (max-width: 43em) {
+                                padding-left: 2%;
                         }
                 }