diff --git a/lib/docs/index.html b/lib/docs/index.html
index 4d2fda7f1c7b..f9c2954a3a65 100644
--- a/lib/docs/index.html
+++ b/lib/docs/index.html
@@ -25,9 +25,10 @@
--search-bg-color-focus: #ffffff;
--search-sh-color: rgba(0, 0, 0, 0.18);
--help-sh-color: rgba(0, 0, 0, 0.75);
+ --help-bg-color: #aaa;
}
- html, body { margin: 0; padding:0; height: 100%; }
+ html, body { margin: 0; padding: 0; height: 100%; }
a {
text-decoration: none;
@@ -190,11 +191,11 @@
box-shadow: 0 0.3em 1em 0.125em var(--search-sh-color);
}
- .docs .search::placeholder {
- font-size: 1rem;
- font-family: var(--ui);
- color: var(--tx-color);
- opacity: 0.5;
+ #searchPlaceholder {
+ position: absolute;
+ pointer-events: none;
+ top: 5px;
+ left: 5px;
}
.docs a {
@@ -207,9 +208,9 @@
.docs pre {
font-family: var(--mono);
- font-size:1em;
- background-color:#F5F5F5;
- padding:1em;
+ font-size: 1em;
+ background-color: #F5F5F5;
+ padding: 1em;
overflow-x: auto;
}
@@ -225,7 +226,7 @@
border-bottom: 0.0625rem dashed;
}
- .docs h2 {
+ .docs h2 {
font-size: 1.3em;
margin: 0.5em 0;
padding: 0;
@@ -294,7 +295,7 @@
padding: 1px 1em;
}
- /* help dialog */
+ /* help modal */
.help-modal {
display: flex;
width: 100%;
@@ -308,13 +309,13 @@
backdrop-filter: blur(0.3em);
}
- .help-modal > .dialog {
+ .help-modal > .modal {
max-width: 97vw;
max-height: 97vh;
overflow: auto;
font-size: 1rem;
color: #fff;
- background-color: #333;
+ background-color: var(--help-bg-color);
border: 0.125rem solid #000;
box-shadow: 0 0.5rem 2.5rem 0.3rem var(--help-sh-color);
}
@@ -335,7 +336,7 @@
margin-right: 0.5em;
}
- .help-modal kbd {
+ kbd {
display: inline-block;
padding: 0.3em 0.2em;
font-size: 1.2em;
@@ -348,16 +349,16 @@
border-bottom-color: #c6cbd1;
border: solid 0.0625em;
border-radius: 0.1875em;
- box-shadow: inset 0 -0.0625em 0 #c6cbd1;
+ box-shadow: inset 0 -0.2em 0 #c6cbd1;
cursor: default;
}
- #listFns dt {
- font-family: var(--mono);
- }
- .argBreaker {
- display: none;
- }
+ #listFns dt {
+ font-family: var(--mono);
+ }
+ .argBreaker {
+ display: none;
+ }
/* tokens */
.tok-kw {
@@ -391,7 +392,6 @@
/* dark mode */
@media (prefers-color-scheme: dark) {
-
:root {
--tx-color: #bbb;
--bg-color: #111;
@@ -408,6 +408,7 @@
--search-bg-color-focus: #000;
--search-sh-color: rgba(255, 255, 255, 0.28);
--help-sh-color: rgba(142, 142, 142, 0.5);
+ --help-bg-color: #333;
}
.docs pre {
@@ -457,7 +458,6 @@
.tok-type {
color: #68f;
}
-
}
@media only screen and (max-width: 750px) {
@@ -544,7 +544,7 @@
@@ -555,43 +555,43 @@
-
+
Main Package
@@ -606,16 +606,19 @@ Dependencies
Zig Version
-
-
-
-
+
+
+
+
-
+
-
+
Keyboard Shortcuts
-
- ?
- Show this help dialog
-
- Esc
- Clear focus; close this dialog
+
- ?
- Show this help modal
+
- Esc
- Clear focus; close this modal
- s
- Focus the search field
- ↑
- Move up in search results
- ↓
- Move down in search results
diff --git a/lib/docs/main.js b/lib/docs/main.js
index 1b15183046fd..f171326b2ea0 100644
--- a/lib/docs/main.js
+++ b/lib/docs/main.js
@@ -3,53 +3,54 @@
var zigAnalysis;
(function () {
- let domStatus = document.getElementById("status");
- let domSectNav = document.getElementById("sectNav");
- let domListNav = document.getElementById("listNav");
- let domSectMainPkg = document.getElementById("sectMainPkg");
- let domSectPkgs = document.getElementById("sectPkgs");
- let domListPkgs = document.getElementById("listPkgs");
- let domSectTypes = document.getElementById("sectTypes");
- let domListTypes = document.getElementById("listTypes");
- let domSectTests = document.getElementById("sectTests");
- let domListTests = document.getElementById("listTests");
- let domSectNamespaces = document.getElementById("sectNamespaces");
- let domListNamespaces = document.getElementById("listNamespaces");
- let domSectErrSets = document.getElementById("sectErrSets");
- let domListErrSets = document.getElementById("listErrSets");
- let domSectFns = document.getElementById("sectFns");
- let domListFns = document.getElementById("listFns");
- let domSectFields = document.getElementById("sectFields");
- let domListFields = document.getElementById("listFields");
- let domSectGlobalVars = document.getElementById("sectGlobalVars");
- let domListGlobalVars = document.getElementById("listGlobalVars");
- let domSectValues = document.getElementById("sectValues");
- let domListValues = document.getElementById("listValues");
- let domFnProto = document.getElementById("fnProto");
- let domFnProtoCode = document.getElementById("fnProtoCode");
- let domSectParams = document.getElementById("sectParams");
- let domListParams = document.getElementById("listParams");
- let domTldDocs = document.getElementById("tldDocs");
- let domSectFnErrors = document.getElementById("sectFnErrors");
- let domListFnErrors = document.getElementById("listFnErrors");
- let domTableFnErrors = document.getElementById("tableFnErrors");
- let domFnErrorsAnyError = document.getElementById("fnErrorsAnyError");
- let domFnExamples = document.getElementById("fnExamples");
- // let domListFnExamples = (document.getElementById("listFnExamples"));
- let domFnNoExamples = document.getElementById("fnNoExamples");
- let domDeclNoRef = document.getElementById("declNoRef");
- let domSearch = document.getElementById("search");
- let domSectSearchResults = document.getElementById("sectSearchResults");
- let domSectSearchAllResultsLink = document.getElementById("sectSearchAllResultsLink");
-
- let domListSearchResults = document.getElementById("listSearchResults");
- let domSectSearchNoResults = document.getElementById("sectSearchNoResults");
- let domSectInfo = document.getElementById("sectInfo");
- // let domTdTarget = (document.getElementById("tdTarget"));
- let domPrivDeclsBox = document.getElementById("privDeclsBox");
- let domTdZigVer = document.getElementById("tdZigVer");
- let domHdrName = document.getElementById("hdrName");
- let domHelpModal = document.getElementById("helpDialog");
+ const domStatus = document.getElementById("status");
+ const domSectNav = document.getElementById("sectNav");
+ const domListNav = document.getElementById("listNav");
+ const domSectMainPkg = document.getElementById("sectMainPkg");
+ const domSectPkgs = document.getElementById("sectPkgs");
+ const domListPkgs = document.getElementById("listPkgs");
+ const domSectTypes = document.getElementById("sectTypes");
+ const domListTypes = document.getElementById("listTypes");
+ const domSectTests = document.getElementById("sectTests");
+ const domListTests = document.getElementById("listTests");
+ const domSectNamespaces = document.getElementById("sectNamespaces");
+ const domListNamespaces = document.getElementById("listNamespaces");
+ const domSectErrSets = document.getElementById("sectErrSets");
+ const domListErrSets = document.getElementById("listErrSets");
+ const domSectFns = document.getElementById("sectFns");
+ const domListFns = document.getElementById("listFns");
+ const domSectFields = document.getElementById("sectFields");
+ const domListFields = document.getElementById("listFields");
+ const domSectGlobalVars = document.getElementById("sectGlobalVars");
+ const domListGlobalVars = document.getElementById("listGlobalVars");
+ const domSectValues = document.getElementById("sectValues");
+ const domListValues = document.getElementById("listValues");
+ const domFnProto = document.getElementById("fnProto");
+ const domFnProtoCode = document.getElementById("fnProtoCode");
+ const domSectParams = document.getElementById("sectParams");
+ const domListParams = document.getElementById("listParams");
+ const domTldDocs = document.getElementById("tldDocs");
+ const domSectFnErrors = document.getElementById("sectFnErrors");
+ const domListFnErrors = document.getElementById("listFnErrors");
+ const domTableFnErrors = document.getElementById("tableFnErrors");
+ const domFnErrorsAnyError = document.getElementById("fnErrorsAnyError");
+ const domFnExamples = document.getElementById("fnExamples");
+ // const domListFnExamples = (document.getElementById("listFnExamples"));
+ const domFnNoExamples = document.getElementById("fnNoExamples");
+ const domDeclNoRef = document.getElementById("declNoRef");
+ const domSearch = document.getElementById("search");
+ const domSectSearchResults = document.getElementById("sectSearchResults");
+ const domSectSearchAllResultsLink = document.getElementById("sectSearchAllResultsLink");
+
+ const domListSearchResults = document.getElementById("listSearchResults");
+ const domSectSearchNoResults = document.getElementById("sectSearchNoResults");
+ const domSectInfo = document.getElementById("sectInfo");
+ // const domTdTarget = (document.getElementById("tdTarget"));
+ const domPrivDeclsBox = document.getElementById("privDeclsBox");
+ const domTdZigVer = document.getElementById("tdZigVer");
+ const domHdrName = document.getElementById("hdrName");
+ const domHelpModal = document.getElementById("helpModal");
+ const domSearchPlaceholder = document.getElementById("searchPlaceholder");
let searchTimer = null;
let searchTrimResults = true;
@@ -104,7 +105,15 @@ var zigAnalysis;
// map of decl index to list of comptime fn calls
// let nodesToCallsMap = indexNodesToCalls();
+ domSearch.disabled = false;
domSearch.addEventListener("keydown", onSearchKeyDown, false);
+ domSearch.addEventListener("focus", ev => {
+ domSearchPlaceholder.classList.add("hidden");
+ });
+ domSearch.addEventListener("blur", ev => {
+ if (domSearch.value.length == 0)
+ domSearchPlaceholder.classList.remove("hidden");
+ });
domSectSearchAllResultsLink.addEventListener('click', onClickSearchShowAllResults, false);
function onClickSearchShowAllResults(ev) {
ev.preventDefault();
@@ -112,7 +121,7 @@ var zigAnalysis;
searchTrimResults = false;
onHashChange();
}
-
+
domPrivDeclsBox.addEventListener(
"change",
function () {
@@ -142,6 +151,12 @@ var zigAnalysis;
location.hash = "#root";
}
+ // make the modal disappear if you click outside it
+ domHelpModal.addEventListener("click", ev => {
+ if (ev.target.className == "help-modal")
+ domHelpModal.classList.add("hidden");
+ });
+
window.addEventListener("hashchange", onHashChange, false);
window.addEventListener("keydown", onWindowKeyDown, false);
onHashChange();
@@ -2628,6 +2643,10 @@ var zigAnalysis;
updateCurNav();
if (domSearch.value !== curNavSearch) {
domSearch.value = curNavSearch;
+ if (domSearch.value.length == 0)
+ domSearchPlaceholder.classList.remove("hidden");
+ else
+ domSearchPlaceholder.classList.add("hidden");
}
render();
if (imFeelingLucky) {
@@ -2749,7 +2768,7 @@ var zigAnalysis;
});
}
- // Generic fun/ction
+ // Generic function
if (value.kind == typeKinds.Fn && value.generic_ret != null) {
let resolvedVal = resolveValue({ expr: value.generic_ret });
if ("type" in resolvedVal.expr) {
@@ -3343,12 +3362,11 @@ var zigAnalysis;
return operatorCompare(a.decl.name, b.decl.name);
});
-
- var searchTrimmed = false
- var searchTrimResultsMaxItems = 200
+ let searchTrimmed = false;
+ const searchTrimResultsMaxItems = 200;
if (searchTrimResults && matchedItems.length > searchTrimResultsMaxItems) {
- matchedItems = matchedItems.slice(0, searchTrimResultsMaxItems)
- searchTrimmed = true
+ matchedItems = matchedItems.slice(0, searchTrimResultsMaxItems);
+ searchTrimmed = true;
}
// Build up the list of search results