Rollup merge of #103663 - notriddle:notriddle/search-container, r=GuillaumeGomez

rustdoc: remove redundant CSS/DOM `div.search-container`

Preview: https://notriddle.com/notriddle-rustdoc-demos/search-container/test_dingus/fn.test.html

This wrapper DIV was originally added in 89e1fb3, when it allowed the search bar's size to be calculated without using `calc()`. This `width` hack can be        removed	using flexbox.

Author: matthiaskrgr

src/librustdoc/html/static/css/rustdoc.css

@@ -683,13 +683,16 @@ nav.sub {
 	display: flex;
 	align-items: center;
 }
-nav.sub form {
+.search-form {
+	position: relative;
+	display: flex;
+	height: 34px;
 	flex-grow: 1;
 }
 .source nav.sub {
 	margin: 0 0 15px 0;
 }
-.source nav.sub form {
+.source .search-form {
 	margin-left: 32px;
 }
 
@@ -780,11 +783,6 @@ table,
 	padding-right: 1.25rem;
 }
 
-.search-container {
-	position: relative;
-	display: flex;
-	height: 34px;
-}
 .search-results-title {
 	margin-top: 0;
 	white-space: nowrap;
@@ -860,15 +858,12 @@ so that we can apply CSS-filters to change the arrow color in themes */
 	   -webkit-appearance: textfield for search inputs. That
 	   causes rounded corners and no border on iOS Safari. */
 	-webkit-appearance: none;
-	/* Override Normalize.css: we have margins and do
-	 not want to overflow */
-	box-sizing: border-box !important;
 	outline: none;
 	border: 1px solid var(--border-color);
 	border-radius: 2px;
 	padding: 8px;
 	font-size: 1rem;
-	width: 100%;
+	flex-grow: 1;
 	background-color: var(--button-background-color);
 	color: var(--search-color);
 }
@@ -1957,7 +1952,7 @@ in storage.js
 		flex-direction: column;
 	}
 
-	nav.sub form {
+	.search-form {
 		align-self: stretch;
 	}
 

src/librustdoc/html/static/js/main.js

@@ -932,7 +932,7 @@ function loadCss(cssFileName) {
      * Hide all the popover menus.
      */
     window.hidePopoverMenus = function() {
-        onEachLazy(document.querySelectorAll(".search-container .popover"), elem => {
+        onEachLazy(document.querySelectorAll(".search-form .popover"), elem => {
             elem.style.display = "none";
         });
     };

src/librustdoc/html/templates/page.html

@@ -115,24 +115,22 @@ <h2></h2> {#- -#}
                 </a> {#- -#}
                 {%- endif -%}
                 <form class="search-form"> {#- -#}
-                    <div class="search-container"> {#- -#}
-                        <span></span> {#- This empty span is a hacky fix for Safari - See #93184 -#}
-                        <input {# -#}
-                            class="search-input" {# -#}
-                            name="search" {# -#}
-                            autocomplete="off" {# -#}
-                            spellcheck="false" {# -#}
-                            placeholder="Click or press ‘S’ to search, ‘?’ for more options…" {# -#}
-                            type="search"> {#- -#}
-                        <div id="help-button" title="help" tabindex="-1"> {#- -#}
-                            <a href="{{page.root_path|safe}}help.html">?</a> {#- -#}
-                        </div> {#- -#}
-                        <div id="settings-menu" tabindex="-1"> {#- -#}
-                            <a href="{{page.root_path|safe}}settings.html" title="settings"> {#- -#}
-                                <img width="22" height="22" alt="Change settings" {# -#}
-                                 src="{{static_root_path|safe}}wheel{{page.resource_suffix}}.svg"> {#- -#}
-                            </a> {#- -#}
-                        </div> {#- -#}
+                    <span></span> {#- This empty span is a hacky fix for Safari - See #93184 -#}
+                    <input {# -#}
+                        class="search-input" {# -#}
+                        name="search" {# -#}
+                        autocomplete="off" {# -#}
+                        spellcheck="false" {# -#}
+                        placeholder="Click or press ‘S’ to search, ‘?’ for more options…" {# -#}
+                        type="search"> {#- -#}
+                    <div id="help-button" title="help" tabindex="-1"> {#- -#}
+                        <a href="{{page.root_path|safe}}help.html">?</a> {#- -#}
+                    </div> {#- -#}
+                    <div id="settings-menu" tabindex="-1"> {#- -#}
+                        <a href="{{page.root_path|safe}}settings.html" title="settings"> {#- -#}
+                            <img width="22" height="22" alt="Change settings" {# -#}
+                             src="{{static_root_path|safe}}wheel{{page.resource_suffix}}.svg"> {#- -#}
+                        </a> {#- -#}
                     </div> {#- -#}
                 </form> {#- -#}
             </nav> {#- -#}