Design tweaks on docs
This commit is contained in:
parent
2c538d3776
commit
6100a430c4
|
@ -5,6 +5,7 @@
|
||||||
|
|
||||||
input {
|
input {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
padding: 0.5rem;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -14,17 +15,33 @@
|
||||||
background: white;
|
background: white;
|
||||||
color: black;
|
color: black;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
width: 100%;
|
|
||||||
box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.5);
|
box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.5);
|
||||||
max-height: 500px;
|
max-height: 500px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
width: 150%;
|
||||||
|
right: 0;
|
||||||
|
|
||||||
&__items {
|
&__items {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin-top: 1rem;
|
||||||
|
border-bottom: 1px solid #ccc;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
|
||||||
|
&:first-of-type {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
&__item {
|
&__item {
|
||||||
margin-bottom: 1rem;
|
margin-bottom: 1rem;
|
||||||
font-size: 0.9rem;
|
|
||||||
|
a {
|
||||||
|
font-size: 1.2rem;
|
||||||
|
display: inline-block;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -156,6 +156,11 @@ function initSearch() {
|
||||||
}
|
}
|
||||||
|
|
||||||
var results = index.search(term, options);
|
var results = index.search(term, options);
|
||||||
|
if (results.length === 0) {
|
||||||
|
$searchResults.style.display = "none";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
currentTerm = term;
|
currentTerm = term;
|
||||||
for (var i = 0; i < Math.min(results.length, MAX_ITEMS); i++) {
|
for (var i = 0; i < Math.min(results.length, MAX_ITEMS); i++) {
|
||||||
var item = document.createElement("li");
|
var item = document.createElement("li");
|
||||||
|
|
|
@ -20,7 +20,7 @@
|
||||||
<a class="white" href="https://github.com/Keats/gutenberg" class="nav-link">GitHub</a>
|
<a class="white" href="https://github.com/Keats/gutenberg" class="nav-link">GitHub</a>
|
||||||
|
|
||||||
<div class="search-container">
|
<div class="search-container">
|
||||||
<input id="search" type="search" placeholder="Search the docs">
|
<input id="search" type="search" placeholder="🔎 Search the docs">
|
||||||
|
|
||||||
<div class="search-results">
|
<div class="search-results">
|
||||||
<div class="search-results__items"></div>
|
<div class="search-results__items"></div>
|
||||||
|
|
Loading…
Reference in New Issue