diff --git a/index.html b/index.html index fe600e0..7173669 100644 --- a/index.html +++ b/index.html @@ -1964,174 +1964,147 @@

Settings

-
- - - - - - -
-
-
-
-
-
- Theme - Choose your preferred color scheme -
+
+
+
+
+ Theme + Choose your preferred color scheme
-
-
System
-
Light
-
Dark
-
Black
-
Ocean
-
Purple
-
Forest
-
Mocha
-
Machiatto
-
Frappé
-
Latte
-
Custom
+
+
+
System
+
Light
+
Dark
+
Black
+
Ocean
+
Purple
+
Forest
+
Mocha
+
Machiatto
+
Frappé
+
Latte
+
Custom
+
+
+

Custom Theme

+
+
+ +
-
-

Custom Theme

-
-
- - -
+
+
+
+ Waveform Seekbar + Show a visual waveform of the track in the progress bar (Experimental)
-
-
- Waveform Seekbar - Show a visual waveform of the track in the progress bar - (Experimental) -
- + +
+
+
+ Smooth Scrolling + Provides a smoother scrolling experience with Lenis (Experimental)
-
-
- Smooth Scrolling - Provides a smoother scrolling experience with Lenis (Experimental) -
- + +
+
+
+ Album Cover Background + Use the album cover as a blurred background on album pages and as primary + color
-
-
- Album Cover Background - Use the album cover as a blurred background on album pages and as primary - color -
- + +
+
+
+ Full-screen Visualizer + Enable particle visualizer in full-screen mode
-
-
- Full-screen Visualizer - Enable particle visualizer in full-screen mode -
- + +
+
+
+ Visualizer Style + Select the visualization style
-
-
- Visualizer Style - Select the visualization style -
- + +
+
+
+ Visualizer Mode + Choose how the visualizer is displayed in full-screen
-
-
- Visualizer Mode - Choose how the visualizer is displayed in full-screen -
- + +
+
+
+ Smart Intensity Switching + Automatically adjust visualizer intensity based on song energy
-
-
- Smart Intensity Switching - Automatically adjust visualizer intensity based on song energy -
- + +
+
+
+ Visualizer Sensitivity + Adjust the intensity of the visualizer effects. + Warning: High sensitivity may cause flashing lights and rapid motion, which + can trigger seizures in people with photosensitive epilepsy.
-
-
- Visualizer Sensitivity - Adjust the intensity of the visualizer effects. - Warning: High sensitivity may cause flashing lights and rapid motion, - which can trigger seizures in people with photosensitive - epilepsy. -
-
- - 60% -
+
+ + 60%
-
-
-
-
-
-
- ListenBrainz Scrobbling - Submit listens to ListenBrainz (requires User Token) -
-
@@ -2291,119 +2264,107 @@ >Submit listens to ListenBrainz (requires User Token)
- +
- -
-
-
- Last.fm Scrobbling - Connect your Last.fm account to scrobble tracks -
-
- -
-
- - - - -
-
-
-
-
-
- Streaming Quality - Quality for streaming playback -
- + +
+
+
+ Last.fm Scrobbling + Connect your Last.fm account to scrobble tracks
-
-
- Download Quality - Quality for track downloads -
- +
+
-
-
- Cover Art Size - Size for downloaded/embedded cover art -
- +
+ + + +
+
+
+ Streaming Quality + Quality for streaming playback +
+ +
+
+
+ Download Quality + Quality for track downloads +
+ +
+
+
+ Cover Art Size + Size for downloaded/embedded cover art +
+ +
+
+
+ Show Quality Badges + Display "HD" badge for Hi-Res tracks
-
-
- Gapless Playback - Play audio without interruption between tracks -
-
-
-
- ReplayGain Mode - Normalize volume across tracks -
- + +
+
+
+ ReplayGain Mode + Normalize volume across tracks
-
-
- ReplayGain Pre-Amp - Adjust gain manually (dB) -
- + +
+
+
+ ReplayGain Pre-Amp + Adjust gain manually (dB)
+ +
- -
-
- Equalizer - 16-band parametric equalizer for fine audio control -
- + +
+
+ Equalizer + 16-band parametric equalizer for fine audio control
+ +
- -
-
-
-
-
-
-
-
- Now Playing View Mode - Choose what shows when you click the album art -
- -
- -
-
- Compact Artists - Show artist cards in a compact, horizontal layout -
- -
-
-
- Compact Albums - Show album cards in a compact, horizontal layout -
- -
-
-
-
-
-
-
-
-
- Zipped Bulk Downloads - Download multiple tracks as a single ZIP file (requires browser - support) -
- -
-
-
- Download Lyrics - Include .lrc files when downloading tracks/albums -
- -
-
-
- Romaji Lyrics - Convert Japanese lyrics to Romaji (Latin characters) -
- -
-
-
- Filename Template - Customize download filenames. Available: {trackNumber}, {artist}, {title}, - {album} -
- -
-
-
- ZIP Folder Template - Customize album folder names. Available: {albumTitle}, {albumArtist}, - {year} -
- -
-
-
- Generate M3U - Include M3U playlist files in downloads -
- -
-
-
- Generate M3U8 - Include extended M3U8 playlist files in downloads -
- -
-
-
- Generate CUE - Include CUE sheets for gapless playback in downloads -
- -
-
-
- Generate NFO - Include NFO files for media center compatibility -
- -
-
-
- Generate JSON - Include JSON files with rich metadata -
- -
-
-
- Relative Paths - Use relative paths in playlist files -
- -
-
-
-
-
-
-
-
-
- Keyboard Shortcuts - View available keyboard shortcuts -
- -
- -
-
- Cache - Stores API responses to reduce requests -
- -
-
-
- Backup & Restore - Export or import your library and history as JSON -
-
- - - -
-
-
-
- ADVANCED: Custom Database/Auth - Configure custom PocketBase and Firebase instances -
- -
-
-
-
- API Instances - Manage and prioritize API instances. Automatically sorted by - speed. -
-
-
    + +
    + +
    + + 0 + 25 +
    +
    + + 0 + 40 +
    +
    + + 0 + 63 +
    +
    + + 0 + 100 +
    +
    + + 0 + 160 +
    +
    + + 0 + 250 +
    +
    + + 0 + 400 +
    +
    + + 0 + 630 +
    +
    + + 0 + 1K +
    +
    + + 0 + 1.6K +
    +
    + + 0 + 2.5K +
    +
    + + 0 + 4K +
    +
    + + 0 + 6.3K +
    +
    + + 0 + 10K +
    +
    + + 0 + 16K +
    +
    + + 0 + 20K +
    +
    + +
    + +30 dB + 0 dB + -30 dB +
    +
    +
    + +
    +
    +
    + Now Playing View Mode + Choose what shows when you click the album art +
    + +
    + +
    +
    + Compact Artists + Show artist cards in a compact, horizontal layout +
    + +
    +
    +
    + Compact Albums + Show album cards in a compact, horizontal layout +
    + +
    +
    + +
    +
    +
    + Zipped Bulk Downloads + Download multiple tracks as a single ZIP file (requires browser support) +
    + +
    +
    +
    + Download Lyrics + Include .lrc files when downloading tracks/albums +
    + +
    +
    +
    + Romaji Lyrics + Convert Japanese lyrics to Romaji (Latin characters) +
    + +
    +
    +
    + Filename Template + Customize download filenames. Available: {trackNumber}, {artist}, {title}, + {album} +
    + +
    +
    +
    + ZIP Folder Template + Customize album folder names. Available: {albumTitle}, {albumArtist}, + {year} +
    + +
    +
    +
    + Generate M3U + Include M3U playlist files in downloads +
    + +
    +
    +
    + Generate M3U8 + Include extended M3U8 playlist files in downloads +
    + +
    +
    +
    + Generate CUE + Include CUE sheets for gapless playback in downloads +
    + +
    +
    +
    + Generate NFO + Include NFO files for media center compatibility +
    + +
    +
    +
    + Generate JSON + Include JSON files with rich metadata +
    + +
    +
    +
    + Relative Paths + Use relative paths in playlist files +
    + +
    +
    + +
    +
    +
    + Keyboard Shortcuts + View available keyboard shortcuts +
    + +
    + +
    +
    + Cache + Stores API responses to reduce requests +
    + +
    +
    +
    + Backup & Restore + Export or import your library and history as JSON +
    +
    + + + +
    +
    +
    +
    + ADVANCED: Custom Database/Auth + Configure custom PocketBase and Firebase instances +
    + +
    +
    +
    +
    + API Instances + Manage and prioritize API instances. Automatically sorted by speed. +
    + +
    +
      diff --git a/js/ui-interactions.js b/js/ui-interactions.js index f2fd1be..5d43030 100644 --- a/js/ui-interactions.js +++ b/js/ui-interactions.js @@ -473,19 +473,6 @@ export function initializeUIInteractions(player, api, ui) { }); }); - // Settings tabs - document.querySelectorAll('.settings-tab').forEach((tab) => { - tab.addEventListener('click', () => { - document.querySelectorAll('.settings-tab').forEach((t) => t.classList.remove('active')); - document.querySelectorAll('.settings-tab-content').forEach((c) => c.classList.remove('active')); - - tab.classList.add('active'); - - const contentId = `settings-tab-${tab.dataset.tab}`; - document.getElementById(contentId)?.classList.add('active'); - }); - }); - // Tooltip for truncated text let tooltipEl = document.getElementById('custom-tooltip'); if (!tooltipEl) { diff --git a/styles.css b/styles.css index 6620248..1ef7b15 100644 --- a/styles.css +++ b/styles.css @@ -890,55 +890,6 @@ input[type='search']::-webkit-search-cancel-button { /* Use standardized animation */ } -/* Settings Tabs */ -.settings-tabs { - display: flex; - gap: var(--spacing-xs); - margin-bottom: var(--spacing-lg); - border-bottom: 1px solid var(--border); - flex-wrap: wrap; -} - -.settings-tab { - background: transparent; - border: none; - color: var(--muted-foreground); - padding: var(--spacing-sm) var(--spacing-lg); - cursor: pointer; - font-size: 1rem; - font-weight: 500; - border-bottom: 2px solid transparent; - border-radius: var(--radius-sm) var(--radius-sm) 0 0; - transition: - color var(--transition-fast), - background-color var(--transition-fast), - transform var(--transition-fast); - position: relative; -} - -.settings-tab:hover { - color: var(--foreground); - background-color: rgb(var(--highlight-rgb), 0.05); -} - -.settings-tab:active { - transform: translateY(1px); -} - -.settings-tab.active { - color: var(--foreground); - border-bottom-color: var(--highlight); -} - -.settings-tab-content { - display: none; -} - -.settings-tab-content.active { - display: block; - animation: fade-in-slide-up 0.4s var(--ease-out-back); -} - .card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));