Pick themes on settings page, not every page

This hides the paintbrush icon on most pages by default, in preference
for the settings on the settings page.  When loading from a local file,
and not in mobile view, continue to show the theme picker. That's
because some browsers limit access to localStorage from file:/// URLs,
so choosing a theme from settings.html doesn't take effect.
This commit is contained in:
Jacob Hoffman-Andrews 2022-01-05 22:20:26 -05:00
parent ad46af2471
commit c4b994ff80
3 changed files with 12 additions and 12 deletions

View File

@ -1755,6 +1755,12 @@ details.rustdoc-toggle[open] > summary.hideme::after {
padding-top: 0px; padding-top: 0px;
} }
/* Space is at a premium on mobile, so remove the theme-picker icon. */
#theme-picker {
display: none;
width: 0;
}
.rustdoc { .rustdoc {
flex-direction: column; flex-direction: column;
} }
@ -1873,12 +1879,6 @@ details.rustdoc-toggle[open] > summary.hideme::after {
height: 100%; height: 100%;
} }
nav.sub {
width: calc(100% - 32px);
margin-left: 32px;
margin-bottom: 10px;
}
.source nav:not(.sidebar).sub { .source nav:not(.sidebar).sub {
margin-left: 32px; margin-left: 32px;
} }
@ -2075,11 +2075,6 @@ details.rustdoc-toggle[open] > summary.hideme::after {
border: 0; border: 0;
} }
#crate-search + .search-input {
width: calc(100% + 71px);
margin-left: -36px;
}
#theme-picker, #settings-menu { #theme-picker, #settings-menu {
padding: 5px; padding: 5px;
width: 31px; width: 31px;

View File

@ -129,10 +129,15 @@ function hideThemeButtonState() {
// Set up the theme picker list. // Set up the theme picker list.
(function () { (function () {
if (!document.location.href.startsWith("file:///")) {
return;
}
var themeChoices = getThemesElement(); var themeChoices = getThemesElement();
var themePicker = getThemePickerElement(); var themePicker = getThemePickerElement();
var availableThemes = getVar("themes").split(","); var availableThemes = getVar("themes").split(",");
removeClass(themeChoices.parentElement, "hidden");
function switchThemeButtonState() { function switchThemeButtonState() {
if (themeChoices.style.display === "block") { if (themeChoices.style.display === "block") {
hideThemeButtonState(); hideThemeButtonState();

View File

@ -96,7 +96,7 @@
{%- endif -%} {%- endif -%}
</a> {#- -#} </a> {#- -#}
<nav class="sub"> {#- -#} <nav class="sub"> {#- -#}
<div class="theme-picker"> {#- -#} <div class="theme-picker hidden"> {#- -#}
<button id="theme-picker" aria-label="Pick another theme!" aria-haspopup="menu" title="themes"> {#- -#} <button id="theme-picker" aria-label="Pick another theme!" aria-haspopup="menu" title="themes"> {#- -#}
<img width="18" height="18" alt="Pick another theme!" {# -#} <img width="18" height="18" alt="Pick another theme!" {# -#}
src="{{static_root_path|safe}}brush{{page.resource_suffix}}.svg"> {#- -#} src="{{static_root_path|safe}}brush{{page.resource_suffix}}.svg"> {#- -#}