[READ-ONLY] Mirror of https://github.com/probablykasper/ferrum. Music library app for Mac, Linux and Windows
ferrum.kasper.space
electron
linux
macos
music
music-library
music-player
napi
windows
Make sidebar not focusable by mouse
+16
-11
+1
CHANGELOG.md
+1
CHANGELOG.md
···
10
10
- Make time & volume sliders look ok
11
11
- Small design updates to tracklist header & filter textbox
12
12
- Respect user's locale time
13
+
- Make sidebar not focusable by mouse
13
14
- Fix dragging tracks to up next/autoplay queue boundary
14
15
- Fix button edge not clickable due to zoom
15
16
- Fix rearranging queue items not working when dragging the cover artwork
+9
-1
src/components/Sidebar.svelte
+9
-1
src/components/Sidebar.svelte
···
103
103
}
104
104
}}
105
105
/>
106
+
<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
106
107
<!-- svelte-ignore a11y-no-noninteractive-element-interactions -->
107
108
<nav
108
109
class="items"
109
110
tabindex="-1"
111
+
on:mousedown|preventDefault={() => {
112
+
if (document.activeElement === document.body) {
113
+
tracklist_actions.focus()
114
+
}
115
+
}}
110
116
on:keydown={(e) => {
111
117
if (e.key === 'Escape') {
112
118
e.preventDefault()
···
131
137
parent_id={null}
132
138
children={special_playlists_nav}
133
139
on_open={(item) => {
134
-
page.open_playlist('root', item.view_as ?? view_as_songs)
140
+
if ($page.id !== item.id || $page.viewAs !== item.view_as) {
141
+
page.open_playlist('root', item.view_as ?? view_as_songs)
142
+
}
135
143
}}
136
144
on_select_down={() => {
137
145
if ($track_lists_details_map.root.children && $track_lists_details_map.root.children[0]) {
+6
-10
src/components/SidebarItems.svelte
+6
-10
src/components/SidebarItems.svelte
···
82
82
if (has_showing_children(children[i].id)) {
83
83
select_first(children[i])
84
84
} else if (children[i + 1]) {
85
-
console.trace()
86
85
on_open(children[i + 1])
87
86
} else {
88
87
on_select_down()
···
150
149
{#each children as child_list, i}
151
150
{#if child_list.kind === 'folder'}
152
151
<div
153
-
class="item"
152
+
class="item rounded-r-[5px]"
154
153
style:padding-left={14 * level + 'px'}
155
154
class:active={$page.id === child_list.id}
156
155
draggable="true"
···
241
240
{:else if child_list.kind === 'playlist'}
242
241
<!-- svelte-ignore a11y-interactive-supports-focus -->
243
242
<div
244
-
class="item"
243
+
class="item rounded-r-[5px]"
245
244
role="button"
246
245
aria-label="playlist"
247
246
style:padding-left={14 * level + 'px'}
···
307
306
{:else}
308
307
<!-- svelte-ignore a11y-interactive-supports-focus -->
309
308
<div
310
-
class="item"
309
+
class="item rounded-r-[5px]"
311
310
role="link"
312
311
style:padding-left={14 * level + 'px'}
313
312
on:mousedown={() => on_open(child_list)}
···
325
324
326
325
<style lang="sass">
327
326
.item.active
328
-
// box-shadow: inset 2px 0px 0px 0px hsl(var(--hue), 70%, 60%)
329
-
// background: linear-gradient(90deg, hsl(var(--hue), 35%, 25%) 30%, transparent)
330
-
box-shadow: inset 2px 0px 0px 0px hsl(var(--hue), 30%, 60%)
331
-
background-image: linear-gradient(90deg, hsl(var(--hue), 20%, 25%) 30%, transparent 66.6666%)
327
+
box-shadow: inset 2px 0px 0px 0px hsl(var(--hue), 70%, 60%)
328
+
background-image: linear-gradient(90deg, hsl(var(--hue), 45%, 30%) 30%, transparent 66.6666%)
332
329
background-position: 0% 0%
333
330
:global(aside :focus)
334
331
.active
335
332
box-shadow: inset 2px 0px 0px 0px hsl(var(--hue), 70%, 60%)
336
-
background-image: linear-gradient(90deg, hsl(var(--hue), 45%, 30%) 30%, transparent 66.6666%)
337
-
background-position: 0% 0%
333
+
background-image: linear-gradient(90deg, hsl(var(--hue), 70%, 46%) 30%, transparent 66.6666%)
338
334
.item
339
335
display: flex
340
336
align-items: center