From 975812c7833377b23b06e6c55dc383a6ab5ea36b Mon Sep 17 00:00:00 2001
From: Andrea Fercia <afercia@git.wordpress.org>
Date: Sun, 22 Sep 2019 21:58:06 +0000
Subject: [PATCH] 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.


git-svn-id: https://develop.svn.wordpress.org/trunk@46234 602fd350-edb4-49c9-b593-d223f7449a82
---
 .../sass/site/primary/_archives.scss          | 12 +++--------
 .../themes/twentynineteen/search.php          |  4 ++--
 .../themes/twentynineteen/style-rtl.css       | 20 +++----------------
 .../themes/twentynineteen/style.css           | 20 +++----------------
 4 files changed, 11 insertions(+), 45 deletions(-)

diff --git a/src/wp-content/themes/twentynineteen/sass/site/primary/_archives.scss b/src/wp-content/themes/twentynineteen/sass/site/primary/_archives.scss
index c040c27b35..a3cb801d3f 100644
--- a/src/wp-content/themes/twentynineteen/sass/site/primary/_archives.scss
+++ b/src/wp-content/themes/twentynineteen/sass/site/primary/_archives.scss
@@ -5,7 +5,7 @@
 	margin: $size__spacing-unit $size__spacing-unit calc(3 * #{$size__spacing-unit});
 
 	@include media(tablet) {
-		margin: 0 $size__site-margins $size__site-margins;
+		margin: 0 $size__site-margins calc(3 * #{$size__spacing-unit});
 	}
 
 	.page-title {
@@ -23,16 +23,11 @@
 	.page-description {
 		display: inherit;
 		clear: both;
-
-		&:after {
-			content: ".";
-			font-weight: bold;
-			color: $color__text-light;
-		}
 	}
 }
 
-.archive .page-header .page-description {
+.archive .page-header .page-description,
+.search .page-header .page-description {
 	display: block;
 	color: $color__text-main;
 	font-size: 1em;
@@ -50,7 +45,6 @@
 .error-404.not-found,
 .no-results.not-found {
 
-	.page-title,
 	.page-content {
 
 		margin: calc(3 * #{$size__spacing-unit}) #{$size__spacing-unit};
diff --git a/src/wp-content/themes/twentynineteen/search.php b/src/wp-content/themes/twentynineteen/search.php
index 0191775041..84091a2f27 100644
--- a/src/wp-content/themes/twentynineteen/search.php
+++ b/src/wp-content/themes/twentynineteen/search.php
@@ -19,9 +19,9 @@ get_header();
 
 			<header class="page-header">
 				<h1 class="page-title">
-					<?php _e( 'Search results for:', 'twentynineteen' ); ?>
+					<?php _e( 'Search results for: ', 'twentynineteen' ); ?>
+					<span class="page-description"><?php echo get_search_query(); ?></span>
 				</h1>
-				<div class="page-description"><?php echo get_search_query(); ?></div>
 			</header><!-- .page-header -->
 
 			<?php
diff --git a/src/wp-content/themes/twentynineteen/style-rtl.css b/src/wp-content/themes/twentynineteen/style-rtl.css
index f9c7c41acc..0fca6f6b95 100644
--- a/src/wp-content/themes/twentynineteen/style-rtl.css
+++ b/src/wp-content/themes/twentynineteen/style-rtl.css
@@ -4939,7 +4939,7 @@ body.page .main-navigation {
   .archive .page-header,
   .search .page-header,
   .error404 .page-header {
-    margin: 0 calc(10% + 60px) calc(10% + 60px);
+    margin: 0 calc(10% + 60px) calc(3 * 1rem);
   }
 }
 
@@ -4967,18 +4967,8 @@ body.page .main-navigation {
   clear: both;
 }
 
-.archive .page-header .search-term:after,
-.archive .page-header .page-description:after,
-.search .page-header .search-term:after,
-.search .page-header .page-description:after,
-.error404 .page-header .search-term:after,
-.error404 .page-header .page-description:after {
-  content: ".";
-  font-weight: bold;
-  color: #767676;
-}
-
-.archive .page-header .page-description {
+.archive .page-header .page-description,
+.search .page-header .page-description {
   display: block;
   color: #111;
   font-size: 1em;
@@ -4991,17 +4981,13 @@ body.page .main-navigation {
 }
 
 /* 404 & Not found */
-.error-404.not-found .page-title,
 .error-404.not-found .page-content,
-.no-results.not-found .page-title,
 .no-results.not-found .page-content {
   margin: calc(3 * 1rem) 1rem;
 }
 
 @media only screen and (min-width: 768px) {
-  .error-404.not-found .page-title,
   .error-404.not-found .page-content,
-  .no-results.not-found .page-title,
   .no-results.not-found .page-content {
     margin: calc(3 * 1rem) calc(10% + 60px) calc(1rem / 2);
   }
diff --git a/src/wp-content/themes/twentynineteen/style.css b/src/wp-content/themes/twentynineteen/style.css
index 7835272d92..075f41819e 100644
--- a/src/wp-content/themes/twentynineteen/style.css
+++ b/src/wp-content/themes/twentynineteen/style.css
@@ -4945,7 +4945,7 @@ body.page .main-navigation {
   .archive .page-header,
   .search .page-header,
   .error404 .page-header {
-    margin: 0 calc(10% + 60px) calc(10% + 60px);
+    margin: 0 calc(10% + 60px) calc(3 * 1rem);
   }
 }
 
@@ -4973,18 +4973,8 @@ body.page .main-navigation {
   clear: both;
 }
 
-.archive .page-header .search-term:after,
-.archive .page-header .page-description:after,
-.search .page-header .search-term:after,
-.search .page-header .page-description:after,
-.error404 .page-header .search-term:after,
-.error404 .page-header .page-description:after {
-  content: ".";
-  font-weight: bold;
-  color: #767676;
-}
-
-.archive .page-header .page-description {
+.archive .page-header .page-description,
+.search .page-header .page-description {
   display: block;
   color: #111;
   font-size: 1em;
@@ -4997,17 +4987,13 @@ body.page .main-navigation {
 }
 
 /* 404 & Not found */
-.error-404.not-found .page-title,
 .error-404.not-found .page-content,
-.no-results.not-found .page-title,
 .no-results.not-found .page-content {
   margin: calc(3 * 1rem) 1rem;
 }
 
 @media only screen and (min-width: 768px) {
-  .error-404.not-found .page-title,
   .error-404.not-found .page-content,
-  .no-results.not-found .page-title,
   .no-results.not-found .page-content {
     margin: calc(3 * 1rem) calc(10% + 60px) calc(1rem / 2);
   }