additional search tweaks

This commit is contained in:
John Bowdre 2024-01-15 18:12:56 -06:00
parent a292270b11
commit a70c866dd0
5 changed files with 14 additions and 21 deletions

View file

@ -5,7 +5,10 @@ function displayResults (results, store) {
for (const n in results) {
const item = store[results[n].ref];
resultList += '<li><a href="' + item.url + '">' + item.title + '</a></li>'
resultList += '<p>' + item.content.substring(0, 150) + '...</p>'
if (item.description)
resultList += '<p>' + item.description + '</p>'
else
resultList += '<p>' + item.content.substring(0, 150) + '...</p>'
}
searchResults.innerHTML = resultList;
} else {

View file

@ -1,5 +1,5 @@
<form id="search"
action='{{ with .GetPage "/search" }}{{ .Permalink }}{{ end }}' method="get">
<input type="search" id="search-query" name="query" placeholder="Looking for something?" aria-label="search text">
<input type="input" id="search-query" name="query" placeholder="grep -i" aria-label="search text">
<button type="submit" aria-label="search button"><i class="fa-solid fa-magnifying-glass"></i></button>
</form>

View file

@ -5,6 +5,7 @@
"title": "{{ .Title }}",
"tags": [{{ range .Params.Tags }}"{{ . }}",{{ end }}],
"content": {{ .Content | plainify }},
"description": {{ .Description | plainify }},
"url": "{{ .Permalink }}"
},
{{ end }}

View file

@ -1,6 +1,6 @@
{{ define "main" }}
{{ partial "search-form.html" . }}
<br>
<ul id="results">
<li>
Enter a keyword above to search this site.

View file

@ -223,42 +223,31 @@ form {
display: flex;
flex-direction: row;
border-radius: 0.25rem;
margin: 0.25rem;
height: 1.5rem;
outline: 0.25rem solid var(--bg);
}
input {
flex-grow: 2;
border: none;
background-color: var(--off-bg);
/* border-radius: 0.25rem; */
color: var(--off-fg);
height: 1.5rem;
border-radius: 0.25rem;
padding-left: 0.5rem;
font-family: var(--font-monospace);
}
input:focus {
outline: none;
}
input:placeholder-shown {
font-style: italic;
}
form:focus-within {
outline: 1px solid var(--logo);
/* border-radius: 0.25rem; */
}
/* form input {
border-radius: 0.25rem;
margin: 0.25rem;
background-color: var(--off-bg);
} */
form button {
/* border-radius: 0.25rem;
margin: 0.25rem; */
outline: none;
border: none;
background-color: var(--off-bg);
color: var(--logo);
color: var(--link);
}