ivabus/www
1
0
Fork 0
mirror of https://github.com/ivabus/www synced 2024-09-20 03:50:46 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #365 from teaxyz/display-number-of-packages

Browse source 
Display Number of Packages
This commit is contained in:
Thomas Smith 2023-05-24 10:54:22 +02:00 committed by GitHub
parent d3b314e3ec bb7407203c
commit 26473a9586
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
src/layouts/partials/package-grid.html
View file

@ -5,7 +5,6 @@
<div class="row">
<div class="col">
{{- partial "search-menu.html" "searchTermDesktop" -}}
<hr>
<div class="package-grid">
@ -94,6 +93,7 @@
overflow: hidden;
}
</style>
<script language="javascript" type="module">
import Fuse from 'https://cdn.jsdelivr.net/npm/fuse.js@6.6.2/dist/fuse.esm.js'
@ -109,6 +109,11 @@
const grid = document.getElementById('packageGrid');
const packagesCache = Array.from(grid.children).filter((e) => e.dataset && e.dataset.name);
// get reference to search input and set its placeholder
const searchInput = document.getElementById('searchTermDesktop');
searchInput.placeholder = `Search ${packagesCache.length} packages`;
const packagesIndex = new Fuse(packagesCache.map((p) => p.dataset), {
keys: ["name", "maintainer", "description"],
minMatchCharLength: 3,

6
src/layouts/partials/search-menu.html
View file

@ -5,7 +5,8 @@
<div class="icon">
<i class="icon-search-icon"></i>
</div>
<input id="{{- . -}}" type="search" placeholder="search_" />
<!-- Save the input element to a variable to be able to refer to it later -->
<input id="{{- . -}}" type="search" placeholder="Search packages" />
</div>
{{- partial "sort-dropdown.html" -}}
</div>
@ -13,7 +14,6 @@
</section>
<style>
.icon-search-icon{
font-size: 30px;
color: #949494;
@ -38,7 +38,7 @@
color:#00ffd0;
text-transform:uppercase;
margin-bottom: -5px;
min-width: 60%;
min-width: 100%;
padding: 0px;
background-color: #1a1a1a !important;
border: none;