+28 -6

src/components/Modal.svelte

Reviewed

··· 83 83 e.preventDefault() 84 84 } 85 85 } 86 86 + 87 87 + // Prevent clicks where the mousedown or mouseup happened on a child element. This could've 88 88 + // been solved with a non-parent backdrop element, but that interferes with text selection. 89 89 + let clickable = true 86 90 </script> 87 91 88 88 - <div class="container" on:keydown> 89 89 - <div class="backdrop" on:click={onCancel} on:mousedown|preventDefault /> 92 92 + <svelte:body 93 93 + on:click={() => { 94 94 + clickable = true 95 95 + }} 96 96 + /> 97 97 + 98 98 + <div 99 99 + class="modal" 100 100 + on:keydown 101 101 + on:click={() => { 102 102 + if (clickable) { 103 103 + onCancel() 104 104 + } 105 105 + }} 106 106 + > 90 107 <svelte:element 91 108 this={tag} 92 109 class="box" ··· 94 111 use:focusTrap 95 112 tabindex="-1" 96 113 on:keydown|self={boxKeydown} 114 114 + on:mousedown={() => { 115 115 + clickable = false 116 116 + }} 117 117 + on:mouseup={() => { 118 118 + clickable = false 119 119 + }} 97 120 > 98 121 {#if title !== null} 99 122 <h3>{title}</h3> ··· 108 131 </div> 109 132 110 133 <style lang="sass"> 111 111 - .backdrop 134 134 + h3 135 135 + margin-bottom: 15px 136 136 + .modal 112 137 background-color: rgba(#000000, 0.5) 113 138 outline: none 114 114 - h3 115 115 - margin-bottom: 15px 116 116 - .backdrop, .container 117 139 position: fixed 118 140 user-select: text 119 141 z-index: 90

+1 -1

src/components/Queue.svelte

Reviewed

··· 63 63 return newItems 64 64 } 65 65 66 66 - let virtualList: VirtualList<typeof items[number]> 66 66 + let virtualList: VirtualList<(typeof items)[number]> 67 67 68 68 const selection = newSelection({ 69 69 getItemCount: () => getQueueLength(),

+7 -2

src/components/TrackInfo.svelte

Reviewed

··· 380 380 </div> 381 381 {/if} 382 382 </div> 383 383 - <div> 383 383 + <div class="text"> 384 384 <div class="name">{name}</div> 385 385 <div class="artist">{artist}</div> 386 386 </div> ··· 464 464 width: 450px 465 465 .header 466 466 display: flex 467 467 - align-items: center 467 467 + align-items: stretch 468 468 min-height: $cover-size 469 469 &.has-subtitle 470 470 margin-bottom: 7px 471 471 .spacer 472 472 height: 15px 473 473 + .text 474 474 + flex-grow: 1 475 475 + display: flex 476 476 + flex-direction: column 477 477 + justify-content: center 473 478 .name 474 479 font-size: 18px 475 480 font-weight: 500

+1 -1

src/electron/main.ts

Reviewed

··· 44 44 45 45 app.whenReady().then(async () => { 46 46 let mainWindow: BrowserWindow | null = new BrowserWindow({ 47 47 - width: 1300, 47 47 + width: 1305, 48 48 height: 1000, 49 49 minWidth: 850, 50 50 minHeight: 400,