git.iko.soy/urbit.org
on master help sign in
Merge pull request #361 from urbit/feat/search-hinting

urbit.org: change search hotkey, add hint

commit00dfc18f008530e36bd6530f4051d249ef4ac6c2 authormatildepark <matilde@tlon.io> dateMon 17 Feb 2020, 15:37 (7 years ago) parent78fcf19975e8e1
4 files changed+69−15
compare with master
unifiedsplit
sass/_main.scss−4 static/scripts.js+6−3 templates/partials/navigation-docs.html+35−5 templates/partials/navigation-search.html+28−3
sass/_main.scss−4
@@ -314,10 +314,6 @@ nav.previous, nav.next {
314314 // min-width: 110px;
315315 text-align: left;
316316 background: transparent;
317− span#search-icon {
318− display: inline-block;
319− transform: translate(-4px, 2px) rotate(-45deg);
320− }
321317 span.search-slash {
322318 font-size: 0.75em;
323319 position: absolute;
static/scripts.js+6−3
@@ -15,8 +15,11 @@ function initHotKeys() {
1515 document.body.classList.remove('has-active-search-window');
1616 }
1717
18− // / to open toggle window
19− if (key === '/' || key === 'Period' || key === 58) {
18+ // Ctrl or Meta + / to open toggle window
19+ if (
20+ (event.getModifierState("Control") || event.getModifierState("Meta")) &&
21+ (key === '/' || key === 'Period' || key === 58)
22+ ) {
2023 if (bodyEl.classList.contains('has-active-search-window')) {
2124 // if it's already open don't do anything!
2225 } else {
@@ -232,6 +235,7 @@ function initSearch() {
232235 var searchWindow = document.getElementById('search-window');
233236 var searchActive = bodyEl.classList.contains('has-active-search-window');
234237
238+
235239 if (toggleSearchWindow !== null) {
236240 toggleSearchWindow.onclick = function () {
237241 inputReset.style.display = "none";
@@ -325,7 +329,6 @@ function initSearch() {
325329if (document.readyState === "complete" ||
326330 (document.readyState !== "loading" && !document.documentElement.doScroll)
327331) {
328− initToggleSearchWindow();
329332} else {
330333 document.addEventListener("DOMContentLoaded", function () {
331334 initSearch();
templates/partials/navigation-docs.html+35−5
@@ -1,4 +1,30 @@
11<!-- First nav is desktop-specific. Second nav is dropdown version for mobile. -->
2+
3+{% set sectionTitle = "urbit.org" %}
4+{% if page %}
5+ {% if "docs" in page.components %}
6+ {% set sectionTitle = "Docs" %}
7+ {% endif %}
8+ {% if "updates" in page.components %}
9+ {% set sectionTitle = "Updates" %}
10+ {% endif %}
11+ {% if "blog" in page.components %}
12+ {% set sectionTitle = "Blog" %}
13+ {% endif %}
14+{% endif %}
15+
16+{% if section %}
17+ {% if "docs" in section.components %}
18+ {% set sectionTitle = "Docs" %}
19+ {% endif %}
20+ {% if "updates" in section.components %}
21+ {% set sectionTitle = "Updates" %}
22+ {% endif %}
23+ {% if "blog" in section.components %}
24+ {% set sectionTitle = "Blog" %}
25+ {% endif %}
26+{% endif %}
27+
228{% block content %}
329<nav class="bg-gray5 dn db-xl pt4 full-left no-break docs pr4">
430 <a class="gray3" href="{{config.base_url}}">Urbit</a>
@@ -6,9 +32,11 @@
632 <a href="{{config.base_url}}/docs/">
733 Documentation
834 </a>
9− <button id="js-search-window-toggle" class="mt2 mb4 dn db-m db-l db-xl" type="button" style="outline:none">
10− <span id="search-icon" class="f3 gray3">⚲</span><span class="ml3 gray2">Search</span>
11− </button>
35+<button id="js-search-window-toggle" class="pointer pa0 pv3 dn db-m db-l db-xl bw-0 relative" type="button"
36+ style="outline:none">
37+ <span class="dib pv1 v-mid gray3">Search {{sectionTitle}}</span>
38+ <span class="ml1 pa1 dib v-mid ba br1 b--gray3 gray3 f7" id="keyhint">Ctrl + /</span>
39+</button>
1240 <ul class="lh-copy">
1341 <li class="ml2 mt1"><a href="/using/install">Install -> </a></li>
1442 <li class="ml2 mt1"><a href="/using/operations/">Operations Manual -></a></li>
@@ -140,8 +168,10 @@
140168 {% endif %}
141169 {% endfor %}
142170 </select>
143− <button id="js-search-window-toggle" class="mt4 mb4 dn db-m db-l db-xl" type="button" style="outline:none">
144− <span id="search-icon" class="f3 gray3">⚲</span><span class="ml3 gray2">Search</span>
171+ <button id="js-search-window-toggle" class="pointer pa0 pt3 dn db-m db-l db-xl bw-0 relative" type="button"
172+ style="outline:none">
173+ <span class="pv1 dib v-mid gray3">Search {{sectionTitle}}</span>
174+ <span class="ml1 pa1 dib v-mid ba br1 b--gray3 gray3 f7" id="keyhint">Ctrl + /</span>
145175 </button>
146176</nav>
147177{% endblock content %}
templates/partials/navigation-search.html+28−3
@@ -1,4 +1,29 @@
1−<button id="js-search-window-toggle" class="pointer mt2 dn db-m db-l db-xl bw-0 mb3" type="button" style="outline:none">
2− <span id="search-icon" class="f3 gray3">⚲</span>
3− <span class="gray3">Search</span>
1+{% set sectionTitle = "urbit.org" %}
2+{% if page %}
3+ {% if "docs" in page.components %}
4+ {% set sectionTitle = "Docs" %}
5+ {% endif %}
6+ {% if "updates" in page.components %}
7+ {% set sectionTitle = "Updates" %}
8+ {% endif %}
9+ {% if "blog" in page.components %}
10+ {% set sectionTitle = "Blog" %}
11+ {% endif %}
12+{% endif %}
13+
14+{% if section %}
15+ {% if "docs" in section.components %}
16+ {% set sectionTitle = "Docs" %}
17+ {% endif %}
18+ {% if "updates" in section.components %}
19+ {% set sectionTitle = "Updates" %}
20+ {% endif %}
21+ {% if "blog" in section.components %}
22+ {% set sectionTitle = "Blog" %}
23+ {% endif %}
24+{% endif %}
25+
26+<button id="js-search-window-toggle" class="pointer pa0 pt3 dn db-m db-l db-xl bw-0 relative" type="button" style="outline:none">
27+ <span class="pv1 dib v-mid gray3">Search {{sectionTitle}}</span>
28+ <span class="ml1 pa1 dib v-mid ba br1 b--gray3 gray3 f7" id="keyhint">Ctrl + /</span>
429</button>