mirror of
https://github.com/placeAtlas/atlas.git
synced 2024-09-27 12:39:18 +02:00
More compact search bar and other fixes
This commit is contained in:
parent
c3e473179a
commit
c044528f8a
2 changed files with 13 additions and 8 deletions
|
@ -55,7 +55,7 @@ .navbar {
|
|||
}
|
||||
|
||||
.offcanvas {
|
||||
top: 3.7rem;
|
||||
top: 3.7rem !important;
|
||||
padding-left: env(safe-area-inset-left);
|
||||
}
|
||||
|
||||
|
@ -82,7 +82,6 @@ #linesCanvas {
|
|||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
/*width: calc(100% - 320px);*/
|
||||
width: 100%;
|
||||
z-index: -500;
|
||||
}
|
||||
|
@ -142,6 +141,10 @@ #highlightCanvas {
|
|||
image-rendering: pixelated;
|
||||
}
|
||||
|
||||
#searchList {
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
#objectsList {
|
||||
max-width: 300px;
|
||||
width: 100%;
|
||||
|
@ -186,6 +189,9 @@ @media (max-width: 750px) {
|
|||
#wrapper:not(.listHidden) > #closeObjectsListButton {
|
||||
display: none;
|
||||
}
|
||||
#wrapper:not(.listHidden) > #objectsListOverflowNotice {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 576px) {
|
||||
|
|
|
@ -213,10 +213,10 @@ <h5 class="offcanvas-title" id="offcanvasListLabel">Atlas Entries List</h5>
|
|||
</div>
|
||||
<div id="entriesListControls" class="d-flex flex-column gap-2 p-3 bg-secondary bg-opacity-10 rounded">
|
||||
<span id="atlasSize"></span>
|
||||
<input autofocus class="form-control" id="searchList" type="search" placeholder="Search…" autocomplete="off" spellcheck="false" aria-describedby="atlasSize">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<label for="sort">Sort:</label>
|
||||
<select class="form-select" id="sort" title="Sort entries">
|
||||
<div class="input-group">
|
||||
<input autofocus class="form-control" id="searchList" type="search" placeholder="Search…" autocomplete="off" spellcheck="false" aria-describedby="atlasSize">
|
||||
<label for="sort" class="visually-hidden">Sort entries</label>
|
||||
<select class="form-select" id="sort">
|
||||
<option selected value="shuffle">Random</option>
|
||||
<option value="relevant" id="relevantOption" disabled>Relevant</option>
|
||||
<option value="alphaAsc" label="↓ Alphabetical">Descending Alphabetical</option>
|
||||
|
@ -241,7 +241,6 @@ <h5 class="offcanvas-title" id="offcanvasListLabel">Atlas Entries List</h5>
|
|||
<button type="button" class="btn btn-secondary" id="zoomOutButton" title="Zoom out">
|
||||
<i class="bi bi-dash-lg" aria-hidden="true"></i>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
<div id="variantControls">
|
||||
<div class="input-group">
|
||||
|
@ -260,7 +259,7 @@ <h5 class="offcanvas-title" id="offcanvasListLabel">Atlas Entries List</h5>
|
|||
</datalist>
|
||||
</div>
|
||||
<div id="author" class="bg-body d-flex align-items-center justify-content-center py-1 px-2 rounded shadow" style="--bs-bg-opacity: .9;">
|
||||
<span style="font-size: 0.75rem;">Code owned by <a href="https://github.com/placeAtlas" target="_blank" rel="noopener noreferrer">Place Atlas</a>. Source on <a href="https://github.com/placeAtlas/atlas" target="_blank" rel="noopener noreferrer">GitHub</a>. Site powered by <a href="https://www.netlify.com" target="_blank" rel="noopener noreferrer">Netlify</a>.</span>
|
||||
<span style="font-size: 0.7rem;">Code by <a href="https://github.com/placeAtlas" target="_blank" rel="noopener noreferrer">Place Atlas</a>. Source on <a href="https://github.com/placeAtlas/atlas" target="_blank" rel="noopener noreferrer">GitHub</a>. Site powered by <a href="https://www.netlify.com" target="_blank" rel="noopener noreferrer">Netlify</a>.</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="offcanvas offcanvas-start bg-body" data-bs-scroll="true" data-bs-backdrop="false" tabindex="-1" id="offcanvasDraw" aria-labelledby="offcanvasDrawLabel">
|
||||
|
|
Loading…
Reference in a new issue