Browse Source

feat(layouts/search): and placeholder and allow basic customization

adds default placeholder text to input and makes it configurable. also
allows input disablement and helpblock customization from content. uses
new search archetype to make setup easier and specify defaults.
Josh Habdas 1 year ago
parent
commit
e4df3a51f4
Signed by: Josh Habdas <jhabdas@protonmail.com> GPG Key ID: B148B31154C75A74
2 changed files with 14 additions and 2 deletions
  1. 10
    0
      archetypes/search.md
  2. 4
    2
      layouts/_default/search.html

+ 10
- 0
archetypes/search.md View File

@@ -0,0 +1,10 @@
1
++++
2
+title = "Search" # title of the page
3
+layout = "search" # sets the layout to use
4
+noindex = true # tell robots not to index
5
+[form]
6
+  helpblock = "Press <kbd>s</kbd> to focus input anytime."
7
+[form.input]
8
+  placeholder = "Enter search query…"
9
+  disabled = false
10
++++

+ 4
- 2
layouts/_default/search.html View File

@@ -16,8 +16,10 @@
16 16
       <section>
17 17
         <form v-on:submit.prevent class="form" action="{{ "search" | absURL }}">
18 18
           <fieldset class="form-group">
19
-            <input v-model="query" id="query" name="s" type="search" class="form-control" maxlength="32" autocomplete="off">
20
-            <div class="help-block">Press <kbd>s</kbd> to focus search input anytime.</div>
19
+            <input v-model="query" id="query" name="s" type="search" class="form-control" maxlength="32" autocomplete="off"{{ with .Params.form.input.placeholder }} placeholder="{{ . }}"{{ end }}{{ if eq .Params.form.input.disabled true }} disabled{{ end }}>
20
+            {{ with .Params.form.helpblock }}
21
+              <div class="help-block">{{ . | safeHTML }}</div>
22
+            {{ end }}
21 23
           </fieldset>
22 24
         </form>
23 25
       </section>

Loading…
Cancel
Save