forked from coracle/flotilla
Jon Staab
1354 lines
37 KiB
HTML
1354 lines
37 KiB
HTML
<!doctype html>
|
|
<html lang="en" data-theme="light">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>Icon Gallery</title>
|
|
<link
|
|
href="https://cdn.jsdelivr.net/npm/daisyui@4.12.14/dist/full.min.css"
|
|
rel="stylesheet"
|
|
type="text/css" />
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<style>
|
|
.icon-container {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 1px;
|
|
}
|
|
img {
|
|
width: 24px;
|
|
height: 24px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="container mx-auto p-4">
|
|
<h1 class="mb-4 text-3xl font-bold">Icon Gallery</h1>
|
|
<div class="form-control mb-4">
|
|
<input
|
|
type="text"
|
|
id="searchInput"
|
|
placeholder="Search icons..."
|
|
class="input input-bordered w-full" />
|
|
</div>
|
|
<div id="iconContainer" class="icon-container"></div>
|
|
</div>
|
|
|
|
<script type="module">
|
|
import Fuse from "https://cdn.jsdelivr.net/npm/fuse.js@7.0.0/+esm"
|
|
|
|
const icons = [
|
|
"4k.svg",
|
|
"accessibility.svg",
|
|
"accumulator.svg",
|
|
"add-circle.svg",
|
|
"add-square.svg",
|
|
"add.svg",
|
|
"adhesive-plaster-2.svg",
|
|
"adhesive-plaster.svg",
|
|
"airbuds-case-charge.svg",
|
|
"airbuds-case-minimalistic.svg",
|
|
"airbuds-case-open.svg",
|
|
"airbuds-case.svg",
|
|
"airbuds-charge.svg",
|
|
"airbuds-check.svg",
|
|
"airbuds-left.svg",
|
|
"airbuds-remove.svg",
|
|
"airbuds-right.svg",
|
|
"airbuds.svg",
|
|
"alarm-add.svg",
|
|
"alarm-pause.svg",
|
|
"alarm-play.svg",
|
|
"alarm-remove.svg",
|
|
"alarm-sleep.svg",
|
|
"alarm-turn-off.svg",
|
|
"alarm.svg",
|
|
"album.svg",
|
|
"align-bottom.svg",
|
|
"align-horizonta-spacing.svg",
|
|
"align-horizontal-center.svg",
|
|
"align-left.svg",
|
|
"align-right.svg",
|
|
"align-top.svg",
|
|
"align-vertical-center.svg",
|
|
"align-vertical-spacing.svg",
|
|
"alt-arrow-down.svg",
|
|
"alt-arrow-left.svg",
|
|
"alt-arrow-right.svg",
|
|
"alt-arrow-up.svg",
|
|
"archive-down-1.svg",
|
|
"archive-down.svg",
|
|
"archive-up-1.svg",
|
|
"archive-up.svg",
|
|
"archive.svg",
|
|
"archived-minimalistic.svg",
|
|
"archived.svg",
|
|
"armchair-2.svg",
|
|
"armchair.svg",
|
|
"arrow-down.svg",
|
|
"arrow-left-down.svg",
|
|
"arrow-left-up.svg",
|
|
"arrow-left.svg",
|
|
"arrow-right-down.svg",
|
|
"arrow-right-up.svg",
|
|
"arrow-right.svg",
|
|
"arrow-to-down-left.svg",
|
|
"arrow-to-down-right.svg",
|
|
"arrow-to-top-left.svg",
|
|
"arrow-to-top-right.svg",
|
|
"arrow-up.svg",
|
|
"asteroid.svg",
|
|
"atom.svg",
|
|
"augmented-reality.svg",
|
|
"backpack.svg",
|
|
"backspace.svg",
|
|
"bacteria.svg",
|
|
"bag-2.svg",
|
|
"bag-3.svg",
|
|
"bag-4.svg",
|
|
"bag-5.svg",
|
|
"bag-check.svg",
|
|
"bag-cross.svg",
|
|
"bag-heart.svg",
|
|
"bag-music-2.svg",
|
|
"bag-music.svg",
|
|
"bag-smile.svg",
|
|
"bag.svg",
|
|
"balloon.svg",
|
|
"balls.svg",
|
|
"banknote-2.svg",
|
|
"banknote.svg",
|
|
"bar-chair.svg",
|
|
"basketball.svg",
|
|
"bath.svg",
|
|
"battery-charge-minimalistic.svg",
|
|
"battery-charge.svg",
|
|
"battery-full-minimalistic.svg",
|
|
"battery-full.svg",
|
|
"battery-half-minimalistic.svg",
|
|
"battery-half.svg",
|
|
"battery-low-minimalistic.svg",
|
|
"battery-low.svg",
|
|
"bed-1.svg",
|
|
"bed.svg",
|
|
"bedside-table-2.svg",
|
|
"bedside-table-3.svg",
|
|
"bedside-table-4.svg",
|
|
"bedside-table.svg",
|
|
"bell-bing.svg",
|
|
"bell-off.svg",
|
|
"bell.svg",
|
|
"benzene-ring.svg",
|
|
"bicycling-round.svg",
|
|
"bicycling.svg",
|
|
"bill-1.svg",
|
|
"bill-check.svg",
|
|
"bill-cross.svg",
|
|
"bill-list.svg",
|
|
"bill.svg",
|
|
"black-hole-2.svg",
|
|
"black-hole-3.svg",
|
|
"black-hole.svg",
|
|
"bluetooth-circle.svg",
|
|
"bluetooth-square.svg",
|
|
"bluetooth-wave.svg",
|
|
"bluetooth.svg",
|
|
"body-shape-minimalistic.svg",
|
|
"body-shape.svg",
|
|
"body.svg",
|
|
"bolt-circle.svg",
|
|
"bolt.svg",
|
|
"bomb-2.svg",
|
|
"bomb-minimalistic.svg",
|
|
"bomb.svg",
|
|
"bone-broken.svg",
|
|
"bone-crack.svg",
|
|
"bone.svg",
|
|
"bones.svg",
|
|
"bonfire.svg",
|
|
"book-2.svg",
|
|
"book-bookmark-minimalistic.svg",
|
|
"book-bookmark.svg",
|
|
"book-minimalistic.svg",
|
|
"book.svg",
|
|
"bookmark-circle.svg",
|
|
"bookmark-opened.svg",
|
|
"bookmark-square-minimalistic.svg",
|
|
"bookmark-square.svg",
|
|
"bookmark.svg",
|
|
"boombox.svg",
|
|
"bottle.svg",
|
|
"bowling.svg",
|
|
"box-minimalistic.svg",
|
|
"box.svg",
|
|
"branching-paths-down.svg",
|
|
"branching-paths-up.svg",
|
|
"broom.svg",
|
|
"bug-minimalistic.svg",
|
|
"bug.svg",
|
|
"buildings-2.svg",
|
|
"buildings-3.svg",
|
|
"buildings.svg",
|
|
"bus.svg",
|
|
"calculator-minimalistic.svg",
|
|
"calculator.svg",
|
|
"calendar-add.svg",
|
|
"calendar-date.svg",
|
|
"calendar-mark.svg",
|
|
"calendar-minimalistic.svg",
|
|
"calendar-search.svg",
|
|
"calendar.svg",
|
|
"call-cancel-rounded.svg",
|
|
"call-cancel.svg",
|
|
"call-chat-rounded.svg",
|
|
"call-chat.svg",
|
|
"call-dropped-rounded.svg",
|
|
"call-dropped.svg",
|
|
"call-medicine-rounded.svg",
|
|
"call-medicine.svg",
|
|
"camera-add.svg",
|
|
"camera-minimalistic.svg",
|
|
"camera-rotate.svg",
|
|
"camera-square.svg",
|
|
"camera.svg",
|
|
"card-2.svg",
|
|
"card-recive.svg",
|
|
"card-search.svg",
|
|
"card-send.svg",
|
|
"card-transfer.svg",
|
|
"card.svg",
|
|
"cardholder.svg",
|
|
"cart-2.svg",
|
|
"cart-3.svg",
|
|
"cart-4.svg",
|
|
"cart-5.svg",
|
|
"cart-check.svg",
|
|
"cart-cross.svg",
|
|
"cart-large-2.svg",
|
|
"cart-large-3.svg",
|
|
"cart-large-4.svg",
|
|
"cart-large-minimalistic.svg",
|
|
"cart-large.svg",
|
|
"cart-plus.svg",
|
|
"cart.svg",
|
|
"case-minimalistic.svg",
|
|
"case-round-minimalistic.svg",
|
|
"case-round.svg",
|
|
"case.svg",
|
|
"cash-out.svg",
|
|
"cassette-2.svg",
|
|
"cassette.svg",
|
|
"cat.svg",
|
|
"chair-2.svg",
|
|
"chair.svg",
|
|
"chandelier.svg",
|
|
"chart-2.svg",
|
|
"chart-square.svg",
|
|
"chart.svg",
|
|
"chat-dots.svg",
|
|
"chat-line.svg",
|
|
"chat-round-call.svg",
|
|
"chat-round-check.svg",
|
|
"chat-round-dots.svg",
|
|
"chat-round-like.svg",
|
|
"chat-round-line.svg",
|
|
"chat-round-money.svg",
|
|
"chat-round-unread.svg",
|
|
"chat-round-video.svg",
|
|
"chat-round.svg",
|
|
"chat-square-2.svg",
|
|
"chat-square-arrow.svg",
|
|
"chat-square-call.svg",
|
|
"chat-square-check.svg",
|
|
"chat-square-code.svg",
|
|
"chat-square-like.svg",
|
|
"chat-square.svg",
|
|
"chat-unread.svg",
|
|
"check-circle.svg",
|
|
"check-read.svg",
|
|
"check-square.svg",
|
|
"check.svg",
|
|
"checklist-minimalistic.svg",
|
|
"checklist.svg",
|
|
"chef-hat-heart.svg",
|
|
"chef-hat-minimalistic.svg",
|
|
"chef-het.svg",
|
|
"circle-bottom-down.svg",
|
|
"circle-bottom-up.svg",
|
|
"circle-top-down.svg",
|
|
"circle-top-up.svg",
|
|
"city.svg",
|
|
"clapperboard-edit.svg",
|
|
"clapperboard-open-play.svg",
|
|
"clapperboard-open.svg",
|
|
"clapperboard-play.svg",
|
|
"clapperboard-text.svg",
|
|
"clapperboard.svg",
|
|
"clipboard-add.svg",
|
|
"clipboard-check.svg",
|
|
"clipboard-heart.svg",
|
|
"clipboard-list.svg",
|
|
"clipboard-remove.svg",
|
|
"clipboard-text.svg",
|
|
"clipboard.svg",
|
|
"clock-circle.svg",
|
|
"clock-square.svg",
|
|
"close-circle.svg",
|
|
"close-square.svg",
|
|
"close.svg",
|
|
"closet-2.svg",
|
|
"closet.svg",
|
|
"cloud-bolt-minimalistic.svg",
|
|
"cloud-bolt.svg",
|
|
"cloud-check.svg",
|
|
"cloud-download.svg",
|
|
"cloud-file.svg",
|
|
"cloud-minus.svg",
|
|
"cloud-plus.svg",
|
|
"cloud-rain.svg",
|
|
"cloud-snowfall-minimalistic.svg",
|
|
"cloud-snowfall.svg",
|
|
"cloud-storage.svg",
|
|
"cloud-storm.svg",
|
|
"cloud-sun-1.svg",
|
|
"cloud-sun.svg",
|
|
"cloud-upload.svg",
|
|
"cloud-waterdrop.svg",
|
|
"cloud-waterdrops.svg",
|
|
"cloud.svg",
|
|
"clouds.svg",
|
|
"cloudy-moon.svg",
|
|
"clound-cross.svg",
|
|
"code-2.svg",
|
|
"code-circle.svg",
|
|
"code-file.svg",
|
|
"code-scan.svg",
|
|
"code-square.svg",
|
|
"code.svg",
|
|
"colour-tuneing.svg",
|
|
"command.svg",
|
|
"compass-big.svg",
|
|
"compass-square.svg",
|
|
"compass.svg",
|
|
"component-1.svg",
|
|
"condicioner-2.svg",
|
|
"condicioner.svg",
|
|
"confetti-minimalistic.svg",
|
|
"confetti.svg",
|
|
"confounded-circle.svg",
|
|
"confounded-square.svg",
|
|
"copy.svg",
|
|
"copyright.svg",
|
|
"corkscrew.svg",
|
|
"cosmetic.svg",
|
|
"course-up.svg",
|
|
"cpu-bolt.svg",
|
|
"cpu.svg",
|
|
"creative-commons.svg",
|
|
"crop-minimalistic.svg",
|
|
"crop.svg",
|
|
"crown-line.svg",
|
|
"crown-minimalistic.svg",
|
|
"crown-star.svg",
|
|
"crown.svg",
|
|
"cup-1.svg",
|
|
"cup-first.svg",
|
|
"cup-hot.svg",
|
|
"cup-music.svg",
|
|
"cup-paper.svg",
|
|
"cup-star.svg",
|
|
"cup.svg",
|
|
"cursor-square.svg",
|
|
"cursor.svg",
|
|
"danger-circle.svg",
|
|
"danger-square.svg",
|
|
"danger-triangle.svg",
|
|
"danger.svg",
|
|
"database.svg",
|
|
"delivery.svg",
|
|
"devices.svg",
|
|
"diagram-down.svg",
|
|
"diagram-up.svg",
|
|
"dialog-2.svg",
|
|
"dialog.svg",
|
|
"diploma-verified.svg",
|
|
"diploma.svg",
|
|
"diskette.svg",
|
|
"dislike.svg",
|
|
"display.svg",
|
|
"dna.svg",
|
|
"document-1.svg",
|
|
"document-add.svg",
|
|
"document-medicine.svg",
|
|
"document-text.svg",
|
|
"document.svg",
|
|
"documents-minimalistic.svg",
|
|
"documents.svg",
|
|
"dollar-minimalistic.svg",
|
|
"dollar.svg",
|
|
"donut-bitton.svg",
|
|
"donut.svg",
|
|
"double-alt-arrow-down.svg",
|
|
"double-alt-arrow-left.svg",
|
|
"double-alt-arrow-right.svg",
|
|
"double-alt-arrow-up.svg",
|
|
"download-minimalistic.svg",
|
|
"download-square.svg",
|
|
"download-twice-square.svg",
|
|
"download.svg",
|
|
"dropper-2.svg",
|
|
"dropper-3.svg",
|
|
"dropper-minimalistic-2.svg",
|
|
"dropper-minimalistic.svg",
|
|
"dropper.svg",
|
|
"dumbbell-large-minimalistic.svg",
|
|
"dumbbell-large.svg",
|
|
"dumbbell-small.svg",
|
|
"dumbbell.svg",
|
|
"dumbbells-2.svg",
|
|
"dumbbells.svg",
|
|
"earth.svg",
|
|
"electric-refueling.svg",
|
|
"emoji-funny-circle.svg",
|
|
"emoji-funny-square.svg",
|
|
"end-call-rounded.svg",
|
|
"end-call.svg",
|
|
"eraser-circle.svg",
|
|
"eraser-square.svg",
|
|
"eraser.svg",
|
|
"euro.svg",
|
|
"exit.svg",
|
|
"explicit.svg",
|
|
"export.svg",
|
|
"expressionless-circle.svg",
|
|
"expressionless-square.svg",
|
|
"eye-closed.svg",
|
|
"eye-scan.svg",
|
|
"eye.svg",
|
|
"face-scan-circle.svg",
|
|
"face-scan-square.svg",
|
|
"facemask-circle.svg",
|
|
"facemask-square.svg",
|
|
"feed.svg",
|
|
"ferris-wheel.svg",
|
|
"figma-file.svg",
|
|
"figma.svg",
|
|
"file-check.svg",
|
|
"file-corrupted.svg",
|
|
"file-download.svg",
|
|
"file-favourite.svg",
|
|
"file-left.svg",
|
|
"file-remove.svg",
|
|
"file-right.svg",
|
|
"file-send.svg",
|
|
"file-smile.svg",
|
|
"file-text.svg",
|
|
"file.svg",
|
|
"filter.svg",
|
|
"filters.svg",
|
|
"fire-minimalistic.svg",
|
|
"fire-square.svg",
|
|
"fire.svg",
|
|
"flag-2.svg",
|
|
"flag.svg",
|
|
"flame.svg",
|
|
"flashlight-on.svg",
|
|
"flashlight.svg",
|
|
"flip-horizontal.svg",
|
|
"flip-vertical.svg",
|
|
"floor-lamp-minimalistic.svg",
|
|
"floor-lamp.svg",
|
|
"fog.svg",
|
|
"folder-2.svg",
|
|
"folder-add.svg",
|
|
"folder-check.svg",
|
|
"folder-cloud.svg",
|
|
"folder-error.svg",
|
|
"folder-move.svg",
|
|
"folder-open.svg",
|
|
"folder-path-connect.svg",
|
|
"folder-security.svg",
|
|
"folder-with-files.svg",
|
|
"folder.svg",
|
|
"football.svg",
|
|
"forbidden-circle.svg",
|
|
"forbidden.svg",
|
|
"forward-1.svg",
|
|
"forward-2.svg",
|
|
"forward.svg",
|
|
"fridge.svg",
|
|
"fuel.svg",
|
|
"full-screen-circle.svg",
|
|
"full-screen-square.svg",
|
|
"full-screen.svg",
|
|
"gallery-add.svg",
|
|
"gallery-check.svg",
|
|
"gallery-circle.svg",
|
|
"gallery-download.svg",
|
|
"gallery-edit.svg",
|
|
"gallery-favourite.svg",
|
|
"gallery-minimalistic.svg",
|
|
"gallery-remove.svg",
|
|
"gallery-round.svg",
|
|
"gallery-send.svg",
|
|
"gallery-wide.svg",
|
|
"gallery.svg",
|
|
"gameboy.svg",
|
|
"gamepad-charge.svg",
|
|
"gamepad-minimalistic.svg",
|
|
"gamepad-no-charge.svg",
|
|
"gamepad-old.svg",
|
|
"gamepad.svg",
|
|
"garage.svg",
|
|
"gas-station.svg",
|
|
"ghost-smile.svg",
|
|
"ghost.svg",
|
|
"gift.svg",
|
|
"glasses.svg",
|
|
"global.svg",
|
|
"globus.svg",
|
|
"golf.svg",
|
|
"gps.svg",
|
|
"graph-down-new.svg",
|
|
"graph-down.svg",
|
|
"graph-new-up.svg",
|
|
"graph-new.svg",
|
|
"graph-up.svg",
|
|
"graph.svg",
|
|
"hamburger-menu.svg",
|
|
"hand-heart.svg",
|
|
"hand-money.svg",
|
|
"hand-pills.svg",
|
|
"hand-shake.svg",
|
|
"hand-stars.svg",
|
|
"hanger-2.svg",
|
|
"hanger.svg",
|
|
"hashtag-chat.svg",
|
|
"hashtag-circle.svg",
|
|
"hashtag-square.svg",
|
|
"hashtag.svg",
|
|
"headphones-round-sound.svg",
|
|
"headphones-round.svg",
|
|
"headphones-square-sound.svg",
|
|
"headphones-square.svg",
|
|
"health.svg",
|
|
"heart-angle.svg",
|
|
"heart-broken.svg",
|
|
"heart-lock.svg",
|
|
"heart-pulse-2.svg",
|
|
"heart-pulse.svg",
|
|
"heart-shine.svg",
|
|
"heart-unlock.svg",
|
|
"heart.svg",
|
|
"hearts.svg",
|
|
"help.svg",
|
|
"high-definition.svg",
|
|
"high-quality.svg",
|
|
"hiking-minimalistic.svg",
|
|
"hiking-round.svg",
|
|
"hiking.svg",
|
|
"history-2.svg",
|
|
"history-3.svg",
|
|
"history.svg",
|
|
"home-1.svg",
|
|
"home-2.svg",
|
|
"home-add-angle.svg",
|
|
"home-add.svg",
|
|
"home-angle-2.svg",
|
|
"home-angle.svg",
|
|
"home-smile-angle.svg",
|
|
"home-smile.svg",
|
|
"home-wifi-angle.svg",
|
|
"home-wifi.svg",
|
|
"home.svg",
|
|
"hospital.svg",
|
|
"hourglass-line.svg",
|
|
"hourglass.svg",
|
|
"import.svg",
|
|
"inbox-archive.svg",
|
|
"inbox-in.svg",
|
|
"inbox-line.svg",
|
|
"inbox-out.svg",
|
|
"inbox-unread.svg",
|
|
"inbox.svg",
|
|
"incognito.svg",
|
|
"incoming-call-rounded.svg",
|
|
"incoming-call.svg",
|
|
"infinity.svg",
|
|
"info-circle.svg",
|
|
"info-square.svg",
|
|
"iphone.svg",
|
|
"jar-of-pills-2.svg",
|
|
"jar-of-pills.svg",
|
|
"key-minimalistic-2.svg",
|
|
"key-minimalistic-square-2.svg",
|
|
"key-minimalistic-square-3.svg",
|
|
"key-minimalistic-square.svg",
|
|
"key-minimalistic.svg",
|
|
"key-square-2.svg",
|
|
"key-square.svg",
|
|
"key.svg",
|
|
"keyboard.svg",
|
|
"kick-scooter.svg",
|
|
"ladle.svg",
|
|
"lamp.svg",
|
|
"layers-minimalistic.svg",
|
|
"layers.svg",
|
|
"leaf.svg",
|
|
"letter-opened.svg",
|
|
"letter-unread.svg",
|
|
"letter.svg",
|
|
"library.svg",
|
|
"lightbulb-bolt.svg",
|
|
"lightbulb-minimalistic.svg",
|
|
"lightbulb.svg",
|
|
"lightning.svg",
|
|
"like.svg",
|
|
"link-broken-minimalistic.svg",
|
|
"link-broken.svg",
|
|
"link-circle.svg",
|
|
"link-minimalistic-2.svg",
|
|
"link-minimalistic.svg",
|
|
"link-round-angle.svg",
|
|
"link-round.svg",
|
|
"link-square.svg",
|
|
"link.svg",
|
|
"list-arrow-down-minimalistic.svg",
|
|
"list-arrow-down.svg",
|
|
"list-arrow-up-minimalistic.svg",
|
|
"list-arrow-up.svg",
|
|
"list-check-minimalistic.svg",
|
|
"list-check.svg",
|
|
"list-cross-minimalistic.svg",
|
|
"list-cross.svg",
|
|
"list-down.svg",
|
|
"list-heart-minimalistic.svg",
|
|
"list-heart.svg",
|
|
"list-up-minimalistic-1.svg",
|
|
"list-up-minimalistic.svg",
|
|
"list-up.svg",
|
|
"list.svg",
|
|
"lock-keyhole-minimalistic-unlocked.svg",
|
|
"lock-keyhole-minimalistic.svg",
|
|
"lock-keyhole-unlocked.svg",
|
|
"lock-keyhole.svg",
|
|
"lock-password-unlocked.svg",
|
|
"lock-password.svg",
|
|
"lock-unlocked.svg",
|
|
"lock.svg",
|
|
"login-2.svg",
|
|
"login-3.svg",
|
|
"login.svg",
|
|
"logout-2.svg",
|
|
"logout-3.svg",
|
|
"logout.svg",
|
|
"magic-stick-2.svg",
|
|
"magic-stick-3.svg",
|
|
"magic-stick.svg",
|
|
"magnet-wave.svg",
|
|
"magnet.svg",
|
|
"magnifer-bug-rounded.svg",
|
|
"magnifer-bug.svg",
|
|
"magnifer-minimalistic.svg",
|
|
"magnifer-rounded.svg",
|
|
"magnifer-zoom-in-minimalistic.svg",
|
|
"magnifer-zoom-in-rounded.svg",
|
|
"magnifer-zoom-in.svg",
|
|
"magnifer-zoom-out-minimalistic.svg",
|
|
"magnifer-zoom-out-rounded.svg",
|
|
"magnifer-zoom-out.svg",
|
|
"magnifer.svg",
|
|
"magnifier-bug-minimalistic.svg",
|
|
"magnifier-bug-rounded.svg",
|
|
"magnifier-bug.svg",
|
|
"magnifier-minimalistic.svg",
|
|
"magnifier-rounded.svg",
|
|
"magnifier-zoom-in-minimalistic.svg",
|
|
"magnifier-zoom-in-rounded.svg",
|
|
"magnifier-zoom-in.svg",
|
|
"magnifier-zoom-out-minimalistic.svg",
|
|
"magnifier-zoom-out-rounded.svg",
|
|
"magnifier-zoom-out.svg",
|
|
"magnifier.svg",
|
|
"mailbox.svg",
|
|
"map-arrow-down.svg",
|
|
"map-arrow-left.svg",
|
|
"map-arrow-right.svg",
|
|
"map-arrow-square.svg",
|
|
"map-arrow-up.svg",
|
|
"map-point-add.svg",
|
|
"map-point-favourite.svg",
|
|
"map-point-hospital.svg",
|
|
"map-point-remove.svg",
|
|
"map-point-rotate.svg",
|
|
"map-point-school.svg",
|
|
"map-point-search.svg",
|
|
"map-point-wave.svg",
|
|
"map-point.svg",
|
|
"map.svg",
|
|
"mask-happly.svg",
|
|
"mask-sad.svg",
|
|
"masks.svg",
|
|
"maximize-square-2.svg",
|
|
"maximize-square-3.svg",
|
|
"maximize-square-minimalistic.svg",
|
|
"maximize-square.svg",
|
|
"maximize.svg",
|
|
"medal-ribbon-star.svg",
|
|
"medal-ribbon.svg",
|
|
"medal-ribbons-star.svg",
|
|
"medal-star-circle.svg",
|
|
"medal-star-square.svg",
|
|
"medal-star.svg",
|
|
"medical-kit.svg",
|
|
"meditation-round.svg",
|
|
"meditation.svg",
|
|
"men.svg",
|
|
"mention-circle.svg",
|
|
"mention-square.svg",
|
|
"menu-dots-2.svg",
|
|
"menu-dots-circle-2.svg",
|
|
"menu-dots-circle.svg",
|
|
"menu-dots-square-2.svg",
|
|
"menu-dots-square.svg",
|
|
"menu-dots.svg",
|
|
"microphone-2.svg",
|
|
"microphone-3.svg",
|
|
"microphone-large.svg",
|
|
"microphone.svg",
|
|
"minimize-square-2.svg",
|
|
"minimize-square-3.svg",
|
|
"minimize-square-minimalistic.svg",
|
|
"minimize-square.svg",
|
|
"minimize.svg",
|
|
"minus-circle.svg",
|
|
"minus-square.svg",
|
|
"minus.svg",
|
|
"mirror-1.svg",
|
|
"mirror-left.svg",
|
|
"mirror-right.svg",
|
|
"mirror.svg",
|
|
"money-bag.svg",
|
|
"monitor-camera.svg",
|
|
"monitor-smartphone.svg",
|
|
"monitor.svg",
|
|
"moon-fog.svg",
|
|
"moon-sleep.svg",
|
|
"moon-stars.svg",
|
|
"moon.svg",
|
|
"mouse-circle.svg",
|
|
"mouse-minimalistic.svg",
|
|
"mouse.svg",
|
|
"multiple-forward-left.svg",
|
|
"multiple-forward-right.svg",
|
|
"music-library-2.svg",
|
|
"music-library.svg",
|
|
"music-note-2.svg",
|
|
"music-note-3.svg",
|
|
"music-note-4.svg",
|
|
"music-note-slider-2.svg",
|
|
"music-note-slider.svg",
|
|
"music-note.svg",
|
|
"music-notes.svg",
|
|
"muted.svg",
|
|
"notebook-1.svg",
|
|
"notebook-2-1.svg",
|
|
"notebook-2.svg",
|
|
"notebook-bookmark.svg",
|
|
"notebook-minimalistic-1.svg",
|
|
"notebook-minimalistic.svg",
|
|
"notebook-square.svg",
|
|
"notebook.svg",
|
|
"notes-minimalistic.svg",
|
|
"notes.svg",
|
|
"notification-lines-remove.svg",
|
|
"notification-remove.svg",
|
|
"notification-unread-lines.svg",
|
|
"notification-unread.svg",
|
|
"object-scan.svg",
|
|
"outgoing-call-rounded.svg",
|
|
"outgoing-call.svg",
|
|
"oven-mitts-minimalistic.svg",
|
|
"oven-mitts.svg",
|
|
"paint-roller.svg",
|
|
"palette-round.svg",
|
|
"palette.svg",
|
|
"panorama.svg",
|
|
"paper-bin.svg",
|
|
"paperclip-2.svg",
|
|
"paperclip-rounded-2.svg",
|
|
"paperclip-rounded.svg",
|
|
"paperclip.svg",
|
|
"paragraph-spacing.svg",
|
|
"passport-minimalistic.svg",
|
|
"passport.svg",
|
|
"password-minimalistic-input.svg",
|
|
"password-minimalistic.svg",
|
|
"password.svg",
|
|
"pause-circle.svg",
|
|
"pause.svg",
|
|
"paw.svg",
|
|
"pen-2.svg",
|
|
"pen-new-round.svg",
|
|
"pen-new-square.svg",
|
|
"pen.svg",
|
|
"people-nearby.svg",
|
|
"perfume.svg",
|
|
"phone-calling-rounded.svg",
|
|
"phone-calling.svg",
|
|
"phone-rounded.svg",
|
|
"phone.svg",
|
|
"pie-chart-2.svg",
|
|
"pie-chart-3.svg",
|
|
"pie-chart.svg",
|
|
"pill.svg",
|
|
"pills-2.svg",
|
|
"pills-3.svg",
|
|
"pills.svg",
|
|
"pin-circle.svg",
|
|
"pin-list.svg",
|
|
"pin.svg",
|
|
"pip-2.svg",
|
|
"pip.svg",
|
|
"pipette.svg",
|
|
"plain-2.svg",
|
|
"plain-3.svg",
|
|
"plain.svg",
|
|
"plane-2.svg",
|
|
"plane-3.svg",
|
|
"plane.svg",
|
|
"planet-2.svg",
|
|
"planet-3.svg",
|
|
"planet-4.svg",
|
|
"planet.svg",
|
|
"plate.svg",
|
|
"play-circle.svg",
|
|
"play-stream.svg",
|
|
"play.svg",
|
|
"playback-speed.svg",
|
|
"playlist-2.svg",
|
|
"playlist-minimalistic-2.svg",
|
|
"playlist-minimalistic-3.svg",
|
|
"playlist-minimalistic.svg",
|
|
"playlist.svg",
|
|
"plug-circle.svg",
|
|
"plus,-minus.svg",
|
|
"podcast.svg",
|
|
"point-on-map-perspective.svg",
|
|
"point-on-map.svg",
|
|
"posts-carousel-horizontal.svg",
|
|
"posts-carousel-vertical.svg",
|
|
"power.svg",
|
|
"presentation-graph.svg",
|
|
"printer-2.svg",
|
|
"printer-minimalistic.svg",
|
|
"printer.svg",
|
|
"programming.svg",
|
|
"projector.svg",
|
|
"property.svg",
|
|
"pulse-2.svg",
|
|
"pulse.svg",
|
|
"qr-code.svg",
|
|
"question-circle.svg",
|
|
"question-square.svg",
|
|
"quit-full-screen-circle.svg",
|
|
"quit-full-screen-square.svg",
|
|
"quit-full-screen.svg",
|
|
"quit-pip.svg",
|
|
"radar-2.svg",
|
|
"radar.svg",
|
|
"radial-blur.svg",
|
|
"radio-minimalistic.svg",
|
|
"radio.svg",
|
|
"ranking.svg",
|
|
"recive-square.svg",
|
|
"recive-twice-square.svg",
|
|
"record-1.svg",
|
|
"record-2.svg",
|
|
"record-circle-1.svg",
|
|
"record-circle.svg",
|
|
"record-square.svg",
|
|
"record.svg",
|
|
"reel-2.svg",
|
|
"reel.svg",
|
|
"refresh-circle-2.svg",
|
|
"refresh-circle.svg",
|
|
"refresh-square-2.svg",
|
|
"refresh-square.svg",
|
|
"refresh.svg",
|
|
"remote-controller-2.svg",
|
|
"remote-controller-minimalistic.svg",
|
|
"remote-controller.svg",
|
|
"remove-folder.svg",
|
|
"reorder-1.svg",
|
|
"reorder.svg",
|
|
"repeat-one-minimalistic.svg",
|
|
"repeat-one.svg",
|
|
"repeat.svg",
|
|
"reply-2.svg",
|
|
"reply.svg",
|
|
"restart.svg",
|
|
"revote.svg",
|
|
"rewind-10-seconds-back.svg",
|
|
"rewind-10-seconds-forward.svg",
|
|
"rewind-15-seconds-back.svg",
|
|
"rewind-15-seconds-forward.svg",
|
|
"rewind-5-seconds-back.svg",
|
|
"rewind-5-seconds-forward.svg",
|
|
"rewind-back-circle.svg",
|
|
"rewind-back.svg",
|
|
"rewind-forward-circle.svg",
|
|
"rewind-forward.svg",
|
|
"rocket-2.svg",
|
|
"rocket.svg",
|
|
"rolling-pin.svg",
|
|
"round-alt-arrow-down.svg",
|
|
"round-alt-arrow-left.svg",
|
|
"round-alt-arrow-right.svg",
|
|
"round-alt-arrow-up.svg",
|
|
"round-arrow-down.svg",
|
|
"round-arrow-left-down.svg",
|
|
"round-arrow-left-up.svg",
|
|
"round-arrow-left.svg",
|
|
"round-arrow-right-down.svg",
|
|
"round-arrow-right-up.svg",
|
|
"round-arrow-right.svg",
|
|
"round-arrow-up.svg",
|
|
"round-double-alt-arrow-down.svg",
|
|
"round-double-alt-arrow-left.svg",
|
|
"round-double-alt-arrow-right.svg",
|
|
"round-double-alt-arrow-up.svg",
|
|
"round-graph.svg",
|
|
"round-sort-horizontal.svg",
|
|
"round-sort-vertical.svg",
|
|
"round-transfer-diagonal.svg",
|
|
"round-transfer-horizontal.svg",
|
|
"round-transfer-vertical.svg",
|
|
"route.svg",
|
|
"routing-2.svg",
|
|
"routing-3.svg",
|
|
"routing.svg",
|
|
"ruble.svg",
|
|
"rugby.svg",
|
|
"ruler-angular.svg",
|
|
"ruler-cross-pen.svg",
|
|
"ruler-pen.svg",
|
|
"ruler.svg",
|
|
"running-2.svg",
|
|
"running-round.svg",
|
|
"running.svg",
|
|
"sad-circle.svg",
|
|
"sad-square.svg",
|
|
"safe-2.svg",
|
|
"safe-circle.svg",
|
|
"safe-square.svg",
|
|
"sale-square.svg",
|
|
"sale.svg",
|
|
"satellite.svg",
|
|
"scale.svg",
|
|
"scanner-2.svg",
|
|
"scanner.svg",
|
|
"scissors-square.svg",
|
|
"scissors.svg",
|
|
"scooter.svg",
|
|
"screen-share.svg",
|
|
"screencast-2.svg",
|
|
"screencast.svg",
|
|
"sd-card.svg",
|
|
"send-square.svg",
|
|
"send-twice-square.svg",
|
|
"server-2.svg",
|
|
"server-minimalistic.svg",
|
|
"server-path.svg",
|
|
"server-square-cloud.svg",
|
|
"server-square-update.svg",
|
|
"server-square.svg",
|
|
"server.svg",
|
|
"settings-minimalistic.svg",
|
|
"settings.svg",
|
|
"share-circle.svg",
|
|
"share.svg",
|
|
"shield-check.svg",
|
|
"shield-cross.svg",
|
|
"shield-keyhole-minimalistic.svg",
|
|
"shield-keyhole.svg",
|
|
"shield-minimalistic.svg",
|
|
"shield-minus.svg",
|
|
"shield-network.svg",
|
|
"shield-plus.svg",
|
|
"shield-star.svg",
|
|
"shield-up.svg",
|
|
"shield-user.svg",
|
|
"shield-warning.svg",
|
|
"shield.svg",
|
|
"shock-absorber.svg",
|
|
"shop-2.svg",
|
|
"shop-minimalistic.svg",
|
|
"shop.svg",
|
|
"shuffle.svg",
|
|
"sidebar-code.svg",
|
|
"sidebar-minimalistic.svg",
|
|
"siderbar.svg",
|
|
"signpost-2.svg",
|
|
"signpost.svg",
|
|
"sim-card-minimalistic.svg",
|
|
"sim-card.svg",
|
|
"sim-cards.svg",
|
|
"siren-rounded.svg",
|
|
"siren.svg",
|
|
"skateboard.svg",
|
|
"skateboarding-round.svg",
|
|
"skateboarding.svg",
|
|
"skip-next.svg",
|
|
"skip-previous.svg",
|
|
"skirt.svg",
|
|
"slash-circle.svg",
|
|
"slash-square.svg",
|
|
"sledgehammer.svg",
|
|
"sleeping-circle.svg",
|
|
"sleeping-square.svg",
|
|
"slider-horizontal.svg",
|
|
"slider-minimalistic-horizontal.svg",
|
|
"slider-vertical-minimalistic.svg",
|
|
"slider-vertical.svg",
|
|
"smart-home-angle.svg",
|
|
"smart-home.svg",
|
|
"smart-speaker-2.svg",
|
|
"smart-speaker-minimalistic.svg",
|
|
"smart-speaker.svg",
|
|
"smart-vacuum-cleaner-2.svg",
|
|
"smart-vacuum-cleaner.svg",
|
|
"smartphone-2.svg",
|
|
"smartphone-rotate-2.svg",
|
|
"smartphone-rotate-angle.svg",
|
|
"smartphone-rotate-orientation.svg",
|
|
"smartphone-update.svg",
|
|
"smartphone-vibration.svg",
|
|
"smartphone.svg",
|
|
"smile-circle.svg",
|
|
"smile-square.svg",
|
|
"snowflake.svg",
|
|
"socket.svg",
|
|
"sofa-2.svg",
|
|
"sofa-3.svg",
|
|
"sofa.svg",
|
|
"sort-1.svg",
|
|
"sort-by-alphabet.svg",
|
|
"sort-by-time.svg",
|
|
"sort-from-bottom-to-top.svg",
|
|
"sort-from-top-to-bottom.svg",
|
|
"sort-horizontal.svg",
|
|
"sort-vertical.svg",
|
|
"sort.svg",
|
|
"soundwave-1.svg",
|
|
"soundwave-2.svg",
|
|
"soundwave.svg",
|
|
"speaker-minimalistic.svg",
|
|
"speaker.svg",
|
|
"special-effects.svg",
|
|
"spedometer-low.svg",
|
|
"spedometer-max.svg",
|
|
"spedometer-middle.svg",
|
|
"square-academic-cap-2.svg",
|
|
"square-academic-cap.svg",
|
|
"square-alt-arrow-down.svg",
|
|
"square-alt-arrow-left.svg",
|
|
"square-alt-arrow-right.svg",
|
|
"square-alt-arrow-up.svg",
|
|
"square-arrow-down.svg",
|
|
"square-arrow-left-down.svg",
|
|
"square-arrow-left-up.svg",
|
|
"square-arrow-left.svg",
|
|
"square-arrow-right-down.svg",
|
|
"square-arrow-right-up.svg",
|
|
"square-arrow-right.svg",
|
|
"square-arrow-up.svg",
|
|
"square-bottom-down.svg",
|
|
"square-bottom-up.svg",
|
|
"square-double-alt-arrow-down.svg",
|
|
"square-double-alt-arrow-left.svg",
|
|
"square-double-alt-arrow-right.svg",
|
|
"square-double-alt-arrow-up.svg",
|
|
"square-forward.svg",
|
|
"square-share-line.svg",
|
|
"square-sort-horizontal.svg",
|
|
"square-sort-vertical.svg",
|
|
"square-top-down.svg",
|
|
"square-top-up.svg",
|
|
"square-transfer-horizontal.svg",
|
|
"square-transfer-vertical.svg",
|
|
"ssd-round.svg",
|
|
"ssd-square.svg",
|
|
"star-1.svg",
|
|
"star-angle.svg",
|
|
"star-circle.svg",
|
|
"star-fall-2.svg",
|
|
"star-fall-minimalistic-2.svg",
|
|
"star-fall-minimalistic.svg",
|
|
"star-fall.svg",
|
|
"star-rainbow.svg",
|
|
"star-ring.svg",
|
|
"star-rings.svg",
|
|
"star-shine.svg",
|
|
"star.svg",
|
|
"stars-1.svg",
|
|
"stars-line.svg",
|
|
"stars-minimalistic.svg",
|
|
"stars.svg",
|
|
"station-minimalistic.svg",
|
|
"station.svg",
|
|
"stethoscope.svg",
|
|
"sticker-circle.svg",
|
|
"sticker-smile-circle-2.svg",
|
|
"sticker-smile-circle.svg",
|
|
"sticker-smile-square.svg",
|
|
"sticker-square.svg",
|
|
"stop-circle.svg",
|
|
"stop.svg",
|
|
"stopwatch-pause.svg",
|
|
"stopwatch-play.svg",
|
|
"stopwatch.svg",
|
|
"stream.svg",
|
|
"streets-map-point.svg",
|
|
"streets-navigation.svg",
|
|
"streets.svg",
|
|
"stretching-round.svg",
|
|
"stretching.svg",
|
|
"structure.svg",
|
|
"subtitles.svg",
|
|
"suitcase-lines.svg",
|
|
"suitcase-tag.svg",
|
|
"suitcase.svg",
|
|
"sun-2.svg",
|
|
"sun-fog.svg",
|
|
"sun.svg",
|
|
"sunrise.svg",
|
|
"sunset.svg",
|
|
"suspension-bolt.svg",
|
|
"suspension-cross.svg",
|
|
"suspension.svg",
|
|
"swimming.svg",
|
|
"syringe.svg",
|
|
"t-shirt.svg",
|
|
"tablet.svg",
|
|
"tag-horizontal.svg",
|
|
"tag-price.svg",
|
|
"tag.svg",
|
|
"target.svg",
|
|
"tea-cup.svg",
|
|
"telescope.svg",
|
|
"temperature.svg",
|
|
"tennis-2.svg",
|
|
"tennis.svg",
|
|
"test-tube-minimalistic.svg",
|
|
"test-tube.svg",
|
|
"text-bold-circle.svg",
|
|
"text-bold-square.svg",
|
|
"text-bold.svg",
|
|
"text-circle.svg",
|
|
"text-cross-circle.svg",
|
|
"text-cross-square.svg",
|
|
"text-cross.svg",
|
|
"text-field-focus.svg",
|
|
"text-field.svg",
|
|
"text-italic-circle.svg",
|
|
"text-italic-square.svg",
|
|
"text-italic.svg",
|
|
"text-selection.svg",
|
|
"text-square-2.svg",
|
|
"text-square.svg",
|
|
"text-underline-circle.svg",
|
|
"text-underline-cross.svg",
|
|
"text-underline.svg",
|
|
"text.svg",
|
|
"thermometer.svg",
|
|
"three-squares.svg",
|
|
"ticker-star.svg",
|
|
"ticket-sale.svg",
|
|
"ticket.svg",
|
|
"to-pip.svg",
|
|
"tornado-small.svg",
|
|
"tornado.svg",
|
|
"traffic-economy.svg",
|
|
"traffic.svg",
|
|
"tram.svg",
|
|
"transfer-horizontal.svg",
|
|
"transfer-vertical.svg",
|
|
"translation-2.svg",
|
|
"translation.svg",
|
|
"transmission-circle.svg",
|
|
"transmission-square.svg",
|
|
"transmission.svg",
|
|
"trash-bin-2.svg",
|
|
"trash-bin-minimalistic-2.svg",
|
|
"trash-bin-minimalistic.svg",
|
|
"trash-bin.svg",
|
|
"treadmill-round.svg",
|
|
"treadmill.svg",
|
|
"trellis.svg",
|
|
"tuning-2.svg",
|
|
"tuning-3.svg",
|
|
"tuning-4.svg",
|
|
"tuning-square-2.svg",
|
|
"tuning-square.svg",
|
|
"tuning.svg",
|
|
"turntable-minimalistic.svg",
|
|
"turntable-music-note.svg",
|
|
"turntable.svg",
|
|
"tv.svg",
|
|
"ufo-2.svg",
|
|
"ufo-3.svg",
|
|
"ufo.svg",
|
|
"umbrella.svg",
|
|
"undo-left-round-square.svg",
|
|
"undo-left-round.svg",
|
|
"undo-left-square.svg",
|
|
"undo-left.svg",
|
|
"undo-right-round-1.svg",
|
|
"undo-right-round.svg",
|
|
"undo-right-square.svg",
|
|
"undo-right.svg",
|
|
"unread.svg",
|
|
"upload-minimalistic.svg",
|
|
"upload-square.svg",
|
|
"upload-track-2.svg",
|
|
"upload-track.svg",
|
|
"upload-twice-square.svg",
|
|
"upload.svg",
|
|
"usb-1.svg",
|
|
"usb-circle.svg",
|
|
"usb-square.svg",
|
|
"usb.svg",
|
|
"user-block-rounded.svg",
|
|
"user-block.svg",
|
|
"user-check-rounded.svg",
|
|
"user-check.svg",
|
|
"user-circle.svg",
|
|
"user-cross-rounded.svg",
|
|
"user-cross.svg",
|
|
"user-hand-up.svg",
|
|
"user-hands.svg",
|
|
"user-heart-rounded.svg",
|
|
"user-heart.svg",
|
|
"user-id.svg",
|
|
"user-minus-rounded.svg",
|
|
"user-minus.svg",
|
|
"user-plus-rounded.svg",
|
|
"user-plus.svg",
|
|
"user-rounded.svg",
|
|
"user-speak-rounded.svg",
|
|
"user-speak.svg",
|
|
"user.svg",
|
|
"users-group-rounded.svg",
|
|
"users-group-two-rounded.svg",
|
|
"verified-check.svg",
|
|
"video-frame-2.svg",
|
|
"video-frame-cut-2.svg",
|
|
"video-frame-cut.svg",
|
|
"video-frame-play-horizontal.svg",
|
|
"video-frame-play-vertical.svg",
|
|
"video-frame-replace.svg",
|
|
"video-frame.svg",
|
|
"video-library.svg",
|
|
"videocamera-add.svg",
|
|
"videocamera-record.svg",
|
|
"videocamera.svg",
|
|
"vinyl-record.svg",
|
|
"virus.svg",
|
|
"volleyball-2.svg",
|
|
"volleyball.svg",
|
|
"volume-cross.svg",
|
|
"volume-knob.svg",
|
|
"volume-loud.svg",
|
|
"volume-small.svg",
|
|
"volume.svg",
|
|
"wad-of-money.svg",
|
|
"walking-round.svg",
|
|
"walking.svg",
|
|
"wallet-2.svg",
|
|
"wallet-money.svg",
|
|
"wallet.svg",
|
|
"wallpaper.svg",
|
|
"washing-machine-minimalistic.svg",
|
|
"washing-machine.svg",
|
|
"watch-round.svg",
|
|
"watch-square-minimalistic-charge.svg",
|
|
"watch-square-minimalistic.svg",
|
|
"watch-square.svg",
|
|
"water-sun.svg",
|
|
"water.svg",
|
|
"waterdrop.svg",
|
|
"waterdrops.svg",
|
|
"weigher.svg",
|
|
"wheel-angle.svg",
|
|
"wheel.svg",
|
|
"whisk.svg",
|
|
"wi-fi-router-minimalistic.svg",
|
|
"wi-fi-router-round.svg",
|
|
"wi-fi-router.svg",
|
|
"widget-2.svg",
|
|
"widget-3.svg",
|
|
"widget-4.svg",
|
|
"widget-5.svg",
|
|
"widget-6.svg",
|
|
"widget-add.svg",
|
|
"widget.svg",
|
|
"wifi-router-minimalistic.svg",
|
|
"wifi-router-round.svg",
|
|
"wifi-router.svg",
|
|
"wind.svg",
|
|
"window-frame.svg",
|
|
"wineglass-triangle.svg",
|
|
"wineglass.svg",
|
|
"winrar.svg",
|
|
"wireless-charge.svg",
|
|
"women.svg",
|
|
"xxx.svg",
|
|
"zip-file.svg",
|
|
]
|
|
|
|
const iconData = icons.map(icon => ({
|
|
name: icon.replace(".svg", "").replace(/-/g, " "),
|
|
slug: icon.replace(".svg", ""),
|
|
src: icon,
|
|
}))
|
|
|
|
const fuse = new Fuse(iconData, {
|
|
keys: ["name"],
|
|
threshold: 0.3,
|
|
})
|
|
|
|
function renderIcons(data) {
|
|
const container = document.getElementById("iconContainer")
|
|
container.innerHTML = ""
|
|
|
|
data.forEach(({slug, src}) => {
|
|
const item = document.createElement("div")
|
|
item.className = "icon-item tooltip"
|
|
item.setAttribute("data-tip", slug)
|
|
|
|
const img = document.createElement("img")
|
|
img.src = src
|
|
|
|
item.appendChild(img)
|
|
container.appendChild(item)
|
|
})
|
|
}
|
|
|
|
const searchInput = document.getElementById("searchInput")
|
|
searchInput.addEventListener("input", e => {
|
|
const searchTerm = e.target.value.trim()
|
|
|
|
if (searchTerm === "") {
|
|
renderIcons(iconData)
|
|
} else {
|
|
const results = fuse.search(searchTerm)
|
|
renderIcons(results.map(result => result.item))
|
|
}
|
|
})
|
|
|
|
renderIcons(iconData)
|
|
</script>
|
|
</body>
|
|
</html>
|