diff --git a/index.html b/index.html index aa153e1..15a4a67 100644 --- a/index.html +++ b/index.html @@ -5252,48 +5252,12 @@ - + -
+

About Monochrome

diff --git a/js/accounts/auth.js b/js/accounts/auth.js index 27fb1bd..8a422f6 100644 --- a/js/accounts/auth.js +++ b/js/accounts/auth.js @@ -31,7 +31,7 @@ export class AuthManager { this.user = await auth.get(); this.updateUI(this.user); this.authListeners.forEach((listener) => listener(this.user)); - } catch (error) { + } catch { this.user = null; this.updateUI(null); } diff --git a/js/app.js b/js/app.js index 7126174..0b04ba7 100644 --- a/js/app.js +++ b/js/app.js @@ -2983,8 +2983,6 @@ function showCustomizeShortcutsModal() { let recordingAction = null; let recordingTimeout = null; - const shortcuts = keyboardShortcuts.getShortcuts(); - const formatKey = (key) => { if (!key) return 'none'; const keyMap = { diff --git a/js/metadata.js b/js/metadata.js index 70e591f..1cb84af 100644 --- a/js/metadata.js +++ b/js/metadata.js @@ -1385,9 +1385,9 @@ function createStringAtom(type, value, truncateType = true) { function createUserAtom(namespace, name, value) { const encoder = new TextEncoder(); - const dashBytes = encoder.encode('----'); // User-defined atom type + encoder.encode('----'); // User-defined atom type const namespaceBytes = encoder.encode(namespace); - const meanBytes = encoder.encode('mean'); // Standard 'mean' atom for namespace + encoder.encode('mean'); // Standard 'mean' atom for namespace const nameBytes = encoder.encode(name); const valueBytes = encoder.encode('\x00\x00\x00\x01\x00\x00\x00\x00' + value); diff --git a/js/qobuz-api.js b/js/qobuz-api.js index 806d196..ef0245c 100644 --- a/js/qobuz-api.js +++ b/js/qobuz-api.js @@ -331,12 +331,12 @@ export class QobuzAPI { } // Similar/recommendation methods - async getSimilarArtists(artistId) { + async getSimilarArtists(_artistId) { // Qobuz doesn't have a direct similar artists endpoint in this simplified API return []; } - async getSimilarAlbums(albumId) { + async getSimilarAlbums(_albumId) { // Qobuz doesn't have a direct similar albums endpoint in this simplified API return []; } diff --git a/js/settings.js b/js/settings.js index 41a3914..b9fcf4f 100644 --- a/js/settings.js +++ b/js/settings.js @@ -35,7 +35,6 @@ import { musicProviderSettings, analyticsSettings, modalSettings, - keyboardShortcuts, } from './storage.js'; import { audioContextManager, EQ_PRESETS } from './audio-context.js'; import { getButterchurnPresets } from './visualizers/butterchurn.js'; diff --git a/styles.css b/styles.css index e779837..330d605 100644 --- a/styles.css +++ b/styles.css @@ -381,18 +381,6 @@ body { width: 100%; } -img { - max-width: 100%; - display: block; - background-color: var(--muted); - border: none; -} - -a { - color: inherit; - text-decoration: none; -} - .text-link { color: var(--primary); text-decoration: underline; @@ -499,6 +487,75 @@ kbd { margin: var(--space-2); } +/* Base Elements */ +a { + color: inherit; + text-decoration: none; + transition: color var(--transition-fast); +} + +svg { + display: block; + vertical-align: middle; +} + +img { + max-width: 100%; + display: block; + background-color: var(--muted); + border: none; +} + +button { + font-family: inherit; + font-size: inherit; + color: inherit; + background: none; + border: none; + padding: 0; + cursor: pointer; + transition: all var(--transition-fast); +} + +button:disabled { + cursor: not-allowed; + opacity: 0.5; +} + +input, +select, +textarea { + font-family: inherit; + font-size: inherit; + color: inherit; + background: none; + border: 1px solid var(--border); + border-radius: var(--radius-sm); + padding: var(--space-2) var(--space-3); + outline: none; + transition: all var(--transition-fast); +} + +input:focus, +select:focus, +textarea:focus { + border-color: var(--primary); + box-shadow: 0 0 0 2px rgb(var(--highlight-rgb) / 0.2); +} + +span { + display: inline-block; +} + +li { + list-style: none; +} + +ul { + padding: 0; + margin: 0; +} + .m-3 { margin: var(--space-3); } @@ -964,23 +1021,6 @@ kbd { margin-top: -0.5rem; } -.sidebar-nav.bottom { - margin: 0; - padding: 0; -} - -.sidebar-nav.bottom .nav-item a { - padding: 0.5rem 0.75rem; - gap: 0.5rem; - font-size: 0.8125rem; - font-weight: 500; -} - -.sidebar-nav.bottom .nav-item a svg { - width: 17px; - height: 17px; -} - .main-content { grid-area: main; overflow-y: auto; @@ -1134,6 +1174,23 @@ kbd { flex-shrink: 0; } +.sidebar-nav.bottom { + margin: 0; + padding: 0; +} + +.sidebar-nav.bottom .nav-item a { + padding: 0.5rem 0.75rem; + gap: 0.5rem; + font-size: 0.8125rem; + font-weight: 500; +} + +.sidebar-nav.bottom .nav-item a svg { + width: 17px; + height: 17px; +} + .pinned-items-header { font-size: 0.75rem; text-transform: uppercase; @@ -1772,6 +1829,17 @@ input[type='search']::-webkit-search-cancel-button { cursor: pointer; } +.card-like-btn:hover, +.card-menu-btn:hover, +.edit-playlist-btn:hover, +.delete-playlist-btn:hover { + background: rgb(0, 0, 0, 0.7) !important; + transform: scale(1.1) rotate(5deg) !important; + + /* Playful rotation */ + border-color: rgb(255, 255, 255, 0.3) !important; +} + .card:hover .card-like-btn, .card:hover .card-menu-btn, .card-like-btn.active, @@ -1784,17 +1852,6 @@ input[type='search']::-webkit-search-cancel-button { /* Slight delay for staggered feel */ } -.card-like-btn:hover, -.card-menu-btn:hover, -.edit-playlist-btn:hover, -.delete-playlist-btn:hover { - background: rgb(0, 0, 0, 0.7) !important; - transform: scale(1.1) rotate(5deg) !important; - - /* Playful rotation */ - border-color: rgb(255, 255, 255, 0.3) !important; -} - .card-like-btn.active { color: #ef4444 !important; } @@ -6878,6 +6935,13 @@ textarea:focus { box-shadow: 0 0 0 3px rgb(var(--highlight-rgb), 0.2); } +.search-bar input:focus, +.track-list-search-input:focus { + outline: none; + border-color: var(--ring); + box-shadow: 0 0 0 3px rgb(var(--highlight-rgb) / 0.2); +} + .modal.active .modal-content { animation: pop-in var(--transition-normal) var(--ease-out-back); box-shadow: var(--shadow-2xl);