diff --git a/index.html b/index.html
index e928d75..663182c 100644
--- a/index.html
+++ b/index.html
@@ -69,7 +69,8 @@ canvas { width: 100%; height: 100px; border-radius: 6px; display: block; }
.playlist { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.playlist-toolbar { display: flex; align-items: center; gap: 8px; padding: 8px 24px; border-bottom: 1px solid #272c42; flex-shrink: 0; flex-wrap: wrap; }
.playlist-toolbar .spacer { flex: 1; }
-.playlist-toolbar select { background: linear-gradient(to bottom, #272c42, #1e2132); border: 1px solid #6b7089; color: #c6c8d1; padding: 4px 8px; border-radius: 4px; font-size: 11px; cursor: pointer; outline: none; box-shadow: 0 2px 0 #161821, 0 3px 4px rgba(0,0,0,0.3); transition: transform .1s, box-shadow .1s; }
+.playlist-toolbar select { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3l3 3 3-3' stroke='%23c6c8d1' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 6px center / 8px no-repeat, linear-gradient(to bottom, #272c42, #1e2132); border: 1px solid #6b7089; color: #c6c8d1; padding: 4px 20px 4px 8px; border-radius: 4px; font-size: 11px; cursor: pointer; outline: none; box-shadow: 0 2px 0 #161821, 0 3px 4px rgba(0,0,0,0.3); transition: transform .1s, box-shadow .1s; -webkit-appearance: none; appearance: none; }
+.playlist-toolbar select:hover { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'%3E%3Cpath d='M2 3l3 3 3-3' stroke='%23c6c8d1' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 6px center / 8px no-repeat, linear-gradient(to bottom, #2e3348, #272c42); }
.playlist-header { display: grid; grid-template-columns: 36px minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) 60px 60px; gap: 8px; padding: 8px 24px; font-size: 10px; text-transform: uppercase; letter-spacing: .6px; color: #6b7089; border-bottom: 1px solid #272c42; flex-shrink: 0; background: linear-gradient(to bottom, #1e2132, #161821); }
.playlist-body { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 2px 0; position: relative; background: #101219; }
@@ -1409,11 +1410,24 @@ async function collectFiles(entry, files, paths, path, onFile) {
}
}
+let zoomLevel = 1;
document.addEventListener('keydown', (e) => {
if (e.target.tagName === 'INPUT' || e.target.tagName === 'SELECT') return;
if (e.code === 'Space') { e.preventDefault(); playBtn.click(); }
if (e.code === 'ArrowRight') nextBtn.click();
if (e.code === 'ArrowLeft') prevBtn.click();
+ if (e.ctrlKey || e.metaKey) {
+ if (e.key === '+' || e.code === 'NumpadAdd') {
+ e.preventDefault(); zoomLevel = Math.min(3, +(zoomLevel + 0.1).toFixed(1));
+ document.body.style.zoom = zoomLevel;
+ } else if (e.key === '-' || e.code === 'NumpadSubtract') {
+ e.preventDefault(); zoomLevel = Math.max(0.3, +(zoomLevel - 0.1).toFixed(1));
+ document.body.style.zoom = zoomLevel;
+ } else if ((e.key === '0' && !e.shiftKey) || e.code === 'Numpad0') {
+ e.preventDefault(); zoomLevel = 1;
+ document.body.style.zoom = '';
+ }
+ }
});
window.addEventListener('focus', () => {
diff --git a/noiz b/noiz
new file mode 100755
index 0000000..1e592a7
--- /dev/null
+++ b/noiz
@@ -0,0 +1,5 @@
+#!/usr/bin/env python3
+import webview
+webview.create_window( "noiz://", "./index.html", zoomable=True)
+webview.start()
+
diff --git a/noiz.py b/noiz.py
deleted file mode 100755
index 03afb92..0000000
--- a/noiz.py
+++ /dev/null
@@ -1,8 +0,0 @@
-#!/usr/bin/env python3
-import webview
-webview.create_window(
-"noiz://",
-"https://bsd.pm/noiz/"
-)
-webview.start()
-