Making WordPress.org

Changeset 8206


Ignore:
Timestamp:
02/05/2019 09:55:07 PM (6 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)
Location:
sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer
Files:
2 edited

Legend:

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

    r8203 r8206  
    533533        }
    534534
     535        .widget-title {
     536            line-height: 60px;
     537            line-height: 6rem;
     538        }
     539
     540        &.search-guide {
     541            border-top: 2px solid #efefef;
     542        }
     543
    535544        @media ( max-width: 974px ) {
    536545            width: 640px;
     
    561570        }
    562571        &.search-guide {
    563             border-top: 2px solid #efefef;
    564572            padding-top: 60px;
    565573            padding-top: 6rem;
     
    575583            font-size: 25px;
    576584            font-size: 2.5rem;
    577             line-height: 60px;
    578             line-height: 6rem;
     585            line-height: 20px;
     586            line-height: 2rem;
    579587            .dashicons {
    580588                color: #222;
     
    822830                padding-right: 1.3em;
    823831                input {
     832                    margin-bottom: 6px;
    824833                    padding-left: 0.5em;
     834                    vertical-align: middle;
    825835                }
    826836            }
    827837            label:last-child {
    828838                border-right-width: 0;
     839            }
     840
     841            @media ( max-width: 688px ) {
     842                span {
     843                    display: block;
     844                }
     845
     846                label {
     847                    margin-left: 0;
     848                    margin-right: 1em;
     849                    width: 130px;
     850
     851                    &:last-child {
     852                        margin-right: 0;
     853                        padding-right: 0;
     854                        width: initial;
     855                    }
     856                }
    829857            }
    830858        }
     
    928956    }
    929957    .horizontal-list {
    930         display: inline;
     958        display: block;
     959        width: 100%;
    931960        list-style-type: none;
    932961        margin: 0;
    933962        padding: 0;
     963        text-align: center;
    934964    }
    935965    .horizontal-list li {
     
    23342364            }
    23352365        }
     2366        #content-area {
     2367            padding-left: 2%;
     2368        }
    23362369
    23372370        &.archive, &.search {
     
    23582391            .sourcefile {
    23592392                float: left;
     2393            }
     2394        }
     2395        #content-area {
     2396            @media (max-width: 43em) {
     2397                padding-left: 2%;
    23602398            }
    23612399        }
  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/stylesheets/main.css

    r8203 r8206  
    876876}
    877877
     878.devhub-wrap .home-landing .section .widget-title {
     879  line-height: 60px;
     880  line-height: 6rem;
     881}
     882
     883.devhub-wrap .home-landing .section.search-guide {
     884  border-top: 2px solid #efefef;
     885}
     886
    878887@media (max-width: 974px) {
    879888  .devhub-wrap .home-landing .section {
     
    907916
    908917.devhub-wrap .section.search-guide {
    909   border-top: 2px solid #efefef;
    910918  padding-top: 60px;
    911919  padding-top: 6rem;
     
    920928  font-size: 25px;
    921929  font-size: 2.5rem;
    922   line-height: 60px;
    923   line-height: 6rem;
     930  line-height: 20px;
     931  line-height: 2rem;
    924932}
    925933
     
    11901198
    11911199.devhub-wrap .searchform .search-post-type label input {
     1200  margin-bottom: 6px;
    11921201  padding-left: 0.5em;
     1202  vertical-align: middle;
    11931203}
    11941204
    11951205.devhub-wrap .searchform .search-post-type label:last-child {
    11961206  border-right-width: 0;
     1207}
     1208
     1209@media (max-width: 688px) {
     1210  .devhub-wrap .searchform .search-post-type span {
     1211    display: block;
     1212  }
     1213  .devhub-wrap .searchform .search-post-type label {
     1214    margin-left: 0;
     1215    margin-right: 1em;
     1216    width: 130px;
     1217  }
     1218  .devhub-wrap .searchform .search-post-type label:last-child {
     1219    margin-right: 0;
     1220    padding-right: 0;
     1221    width: initial;
     1222  }
    11971223}
    11981224
     
    13061332
    13071333.devhub-wrap .horizontal-list {
    1308   display: inline;
     1334  display: block;
     1335  width: 100%;
    13091336  list-style-type: none;
    13101337  margin: 0;
    13111338  padding: 0;
     1339  text-align: center;
    13121340}
    13131341
     
    27082736    width: 100%;
    27092737  }
     2738  .devhub-wrap #content-area {
     2739    padding-left: 2%;
     2740  }
    27102741  .devhub-wrap.archive .meta, .devhub-wrap.search .meta {
    27112742    font-size: 100%;
     
    27232754  .devhub-wrap.archive .sourcefile, .devhub-wrap.search .sourcefile {
    27242755    float: left;
     2756  }
     2757}
     2758
     2759@media (min-width: 43em) and (max-width: 43em) {
     2760  .devhub-wrap #content-area {
     2761    padding-left: 2%;
    27252762  }
    27262763}
Note: See TracChangeset for help on using the changeset viewer.