authorgravatar for ian@ianjohnson.devIan Johnson <ian@ianjohnson.dev> 2023-09-09 12:58:53-04:00
committergravatar for kappaloris@gmail.comLoris Cro <kappaloris@gmail.com> 2023-09-09 19:48:18+02:00
logd2014fe9713794f6cc0830301a1110d5e92d0ff0
treeb3b5318157fb17843b75f6a94f3aae73e0fac7e3
parent51d7700c8c8e81706e0d0313d853b8e989f8a4da

Autodoc: simplify search text on mobile

This prevents the placeholder text from spilling out of the search bar on smaller screens.

2 files changed, 20 insertions(+), 4 deletions(-)

lib/docs/index.html+18-3
......@@ -307,8 +307,14 @@
307307 #searchPlaceholder {
308308 position: absolute;
309309 pointer-events: none;
310 top: 5px;
311 left: 5px;
310 height: 100%;
311 display: flex;
312 align-items: center;
313 padding-left: 5px;
314 }
315
316 #searchPlaceholderTextMobile {
317 display: none;
312318 }
313319
314320 #dotsPopover:before {
......@@ -797,6 +803,12 @@
797803 display: inline-block;
798804 min-width: calc(100% - 2.8rem);
799805 }
806 #searchPlaceholderText {
807 display: none;
808 }
809 #searchPlaceholderTextMobile {
810 display: inline;
811 }
800812 }
801813 .banner {
802814 background-color: orange;
......@@ -994,7 +1006,10 @@
9941006 </div>
9951007 <div class="flex-right" style="padding-top: 0.5rem;overflow:visible;">
9961008 <div class="search-container" style="position:relative;">
997 <span id="searchPlaceholder"><!-- populated by setPrefSlashSearch --></span>
1009 <div id="searchPlaceholder">
1010 <span id="searchPlaceholderText"><!-- populated by setPrefSlashSearch --></span>
1011 <span id="searchPlaceholderTextMobile">Search</span>
1012 </div>
9981013 <input type="search" class="search" id="search" autocomplete="off" spellcheck="false" disabled>
9991014 <div id="dotsPopover">
10001015 Use spaces instead of dots. See $resource for more info.
lib/docs/main.js+2-1
......@@ -80,6 +80,7 @@ var scrollHistory = {};
8080 const domSearchKeys = document.getElementById("searchKeys");
8181 const domPrefsModal = document.getElementById("prefsModal");
8282 const domSearchPlaceholder = document.getElementById("searchPlaceholder");
83 const domSearchPlaceholderText = document.getElementById("searchPlaceholderText");
8384 const sourceFileUrlTemplate = "src/{{mod}}/{{file}}.html#L{{line}}"
8485 const domLangRefLink = document.getElementById("langRefLink");
8586
......@@ -4739,7 +4740,7 @@ Happy writing!
47394740 domPrefSlashSearch.checked = enabled;
47404741 const searchKeys = enabled ? "<kbd>/</kbd> or <kbd>s</kbd>" : "<kbd>s</kbd>";
47414742 domSearchKeys.innerHTML = searchKeys;
4742 domSearchPlaceholder.innerHTML = searchKeys + " to search, <kbd>?</kbd> for more options";
4743 domSearchPlaceholderText.innerHTML = searchKeys + " to search, <kbd>?</kbd> for more options";
47434744 }
47444745})();
47454746