1
Fork 0

rustdoc: remove redundant div.search-container

This wrapper DIV was originally added in
89e1fb3223, when it allowed the search bar's
size to be calculated without using `calc()`. This `width` hack can be
removed using flexbox.
This commit is contained in:
Michael Howell 2022-10-27 13:36:27 -07:00
parent 126dbdc9c7
commit 509d8ad454
3 changed files with 24 additions and 31 deletions

View file

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

View file

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

View file

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