Filter Articles with a Javascript Search (#772)

* for lugo changes

* quick search through recipes

* Update content/_index.md

Co-authored-by: Steven Hall <Hallzy.18@gmail.com>

* Update content/_index.md

Co-authored-by: Steven Hall <Hallzy.18@gmail.com>

* when searching, list one column, big results

* Update content/_index.md

Co-authored-by: Steven Hall <Hallzy.18@gmail.com>

* Update content/_index.md

Co-authored-by: Steven Hall <Hallzy.18@gmail.com>

* Update content/_index.md

Co-authored-by: Steven Hall <Hallzy.18@gmail.com>

* change for my naming

* remove for fix

* redundant

* hide tags in items so search sees tags

* last superficial changes

Co-authored-by: Steven Hall <Hallzy.18@gmail.com>
This commit is contained in:
Luke Smith
2022-05-26 23:58:53 +00:00
committed by GitHub
parent 0a837fb26a
commit b7f117cf4c
4 changed files with 101 additions and 4 deletions

View File

@@ -51,6 +51,7 @@ h1 {
h2 {
color: tomato ;
text-align: center ;
}
footer {
@@ -113,3 +114,46 @@ img[alt="XMR Logo"] {
@media (min-width: 100em) {
#artlist { column-count: 3 ;}
}
input#search {
all: unset;
background: #222;
color: #fff;
padding: 0.7rem 1rem;
border-radius: 5px;
width: 100%;
}
.search {
width: 400px;
max-width: 85vw;
position: relative;
margin: 0.5rem auto 1.2rem;
display: flex;
}
button.clear-search {
all: unset;
position: absolute;
right: 4px;
top: 5px;
height: 30px;
width: 30px;
color: #888;
cursor: pointer;
transition: color 180ms ease-in-out;
}
button.clear-search:hover {
color: #eee;
}
.matched-recipe {
font-size: x-large ;
}
.list-searched {
column-count: 1 !important ;
list-style: decimal ;
}