Make WordPress Core

Changeset 46234


Ignore:
Timestamp:
09/22/2019 09:58:06 PM (5 years ago)
Author:
afercia
Message:

Accessibility: Twenty Nineteen: Improve the special pages headings.

Improves information provided by the headings, their alignment and spacing in the following special pages:

  • search page with and without search results
  • 404 page (no content)
  • archive pages

Props ianbelanger, kjellr, nrqsnchz, audrasjb.
Fixes #47140.

Location:
trunk/src/wp-content/themes/twentynineteen
Files:
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/src/wp-content/themes/twentynineteen/sass/site/primary/_archives.scss

    r44652 r46234  
    66
    77    @include media(tablet) {
    8         margin: 0 $size__site-margins $size__site-margins;
     8        margin: 0 $size__site-margins calc(3 * #{$size__spacing-unit});
    99    }
    1010
     
    2424        display: inherit;
    2525        clear: both;
    26 
    27         &:after {
    28             content: ".";
    29             font-weight: bold;
    30             color: $color__text-light;
    31         }
    3226    }
    3327}
    3428
    35 .archive .page-header .page-description {
     29.archive .page-header .page-description,
     30.search .page-header .page-description {
    3631    display: block;
    3732    color: $color__text-main;
     
    5146.no-results.not-found {
    5247
    53     .page-title,
    5448    .page-content {
    5549
  • trunk/src/wp-content/themes/twentynineteen/search.php

    r45942 r46234  
    2020            <header class="page-header">
    2121                <h1 class="page-title">
    22                     <?php _e( 'Search results for:', 'twentynineteen' ); ?>
     22                    <?php _e( 'Search results for: ', 'twentynineteen' ); ?>
     23                    <span class="page-description"><?php echo get_search_query(); ?></span>
    2324                </h1>
    24                 <div class="page-description"><?php echo get_search_query(); ?></div>
    2525            </header><!-- .page-header -->
    2626
  • trunk/src/wp-content/themes/twentynineteen/style-rtl.css

    r45920 r46234  
    49404940  .search .page-header,
    49414941  .error404 .page-header {
    4942     margin: 0 calc(10% + 60px) calc(10% + 60px);
     4942    margin: 0 calc(10% + 60px) calc(3 * 1rem);
    49434943  }
    49444944}
     
    49684968}
    49694969
    4970 .archive .page-header .search-term:after,
    4971 .archive .page-header .page-description:after,
    4972 .search .page-header .search-term:after,
    4973 .search .page-header .page-description:after,
    4974 .error404 .page-header .search-term:after,
    4975 .error404 .page-header .page-description:after {
    4976   content: ".";
    4977   font-weight: bold;
    4978   color: #767676;
    4979 }
    4980 
    4981 .archive .page-header .page-description {
     4970.archive .page-header .page-description,
     4971.search .page-header .page-description {
    49824972  display: block;
    49834973  color: #111;
     
    49924982
    49934983/* 404 & Not found */
    4994 .error-404.not-found .page-title,
    49954984.error-404.not-found .page-content,
    4996 .no-results.not-found .page-title,
    49974985.no-results.not-found .page-content {
    49984986  margin: calc(3 * 1rem) 1rem;
     
    50004988
    50014989@media only screen and (min-width: 768px) {
    5002   .error-404.not-found .page-title,
    50034990  .error-404.not-found .page-content,
    5004   .no-results.not-found .page-title,
    50054991  .no-results.not-found .page-content {
    50064992    margin: calc(3 * 1rem) calc(10% + 60px) calc(1rem / 2);
  • trunk/src/wp-content/themes/twentynineteen/style.css

    r45920 r46234  
    49464946  .search .page-header,
    49474947  .error404 .page-header {
    4948     margin: 0 calc(10% + 60px) calc(10% + 60px);
     4948    margin: 0 calc(10% + 60px) calc(3 * 1rem);
    49494949  }
    49504950}
     
    49744974}
    49754975
    4976 .archive .page-header .search-term:after,
    4977 .archive .page-header .page-description:after,
    4978 .search .page-header .search-term:after,
    4979 .search .page-header .page-description:after,
    4980 .error404 .page-header .search-term:after,
    4981 .error404 .page-header .page-description:after {
    4982   content: ".";
    4983   font-weight: bold;
    4984   color: #767676;
    4985 }
    4986 
    4987 .archive .page-header .page-description {
     4976.archive .page-header .page-description,
     4977.search .page-header .page-description {
    49884978  display: block;
    49894979  color: #111;
     
    49984988
    49994989/* 404 & Not found */
    5000 .error-404.not-found .page-title,
    50014990.error-404.not-found .page-content,
    5002 .no-results.not-found .page-title,
    50034991.no-results.not-found .page-content {
    50044992  margin: calc(3 * 1rem) 1rem;
     
    50064994
    50074995@media only screen and (min-width: 768px) {
    5008   .error-404.not-found .page-title,
    50094996  .error-404.not-found .page-content,
    5010   .no-results.not-found .page-title,
    50114997  .no-results.not-found .page-content {
    50124998    margin: calc(3 * 1rem) calc(10% + 60px) calc(1rem / 2);
Note: See TracChangeset for help on using the changeset viewer.