docs: Queue icon

This commit is contained in:
Phan An 2024-06-27 23:35:12 +02:00
parent fd3e70d568
commit 2feaf522a8
4 changed files with 7 additions and 3 deletions

View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path class="" fill="currentColor" d="M24 56c0-13.3 10.7-24 24-24H80c13.3 0 24 10.7 24 24V176h16c13.3 0 24 10.7 24 24s-10.7 24-24 24H40c-13.3 0-24-10.7-24-24s10.7-24 24-24H56V80H48C34.7 80 24 69.3 24 56zM86.7 341.2c-6.5-7.4-18.3-6.9-24 1.2L51.5 357.9c-7.7 10.8-22.7 13.3-33.5 5.6s-13.3-22.7-5.6-33.5l11.1-15.6c23.7-33.2 72.3-35.6 99.2-4.9c21.3 24.4 20.8 60.9-1.1 84.7L86.8 432H120c13.3 0 24 10.7 24 24s-10.7 24-24 24H32c-9.5 0-18.2-5.6-22-14.4s-2.1-18.9 4.3-25.9l72-78c5.3-5.8 5.4-14.6 .3-20.5zM224 64H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32zm0 160H480c17.7 0 32 14.3 32 32s-14.3 32-32 32H224c-17.7 0-32-14.3-32-32s14.3-32 32-32z"></path></svg>

After

Width:  |  Height:  |  Size: 834 B

Binary file not shown.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.7 KiB

View file

@ -50,15 +50,16 @@ To play in order instead of shuffling, hold down <kbd>Alt/Option</kbd> while cli
When a song is playing, you can control playback using the buttons at the bottom of the screen as well as
rewind/fast-forward the song by clicking and dragging the progress bar.
![Footer controls](../assets/img/interface/footer.webp)
![Footer controls](../assets/img/interface/footer.avif)
From the same area, you also can:
* <InterfaceIcon :src="heartIcon" alt="Heart" /> like/unlike the current song
* <InterfaceIcon :src="volumeIcon" alt="Volume" /> control the volume
* <InterfaceIcon :src="repeatIcon" alt="Repeat" /> switch between repeat modes
* <InterfaceIcon :src="slidersIcon" alt="Sliders" /> show the equalizer
* <InterfaceIcon :src="queueIcon" alt="Queue" /> toggle the Queue screen
* <InterfaceIcon :src="boltIcon" alt="Bolt" /> show the visualizer
* <InterfaceIcon :src="slidersIcon" alt="Sliders" /> show the equalizer
* <InterfaceIcon :src="volumeIcon" alt="Volume" /> control the volume
* <InterfaceIcon :src="expandIcon" alt="Expand" /> toggle full-screen mode
Right-clicking the footer area brings up context menu for the currently playing song.
@ -131,6 +132,7 @@ Koel has a number of keyboard shortcuts to make it easier to navigate and contro
Note that these shortcuts are only triggered when the focus is not on an input field (including the volume control and the music track)
or a textarea.
* <kbd>q</kbd> toggle the Queue screen
* <kbd>f</kbd> puts the focus into the search box and triggers the instant search screen
* <kbd>Enter</kbd> plays a song. If multiple songs are being selected, <kbd>Enter</kbd> adds them to the bottom of the queue, <kbd>Shift</kbd>+<kbd>Enter</kbd> queues them to top. Adding a <kbd>Cmd</kbd> or <kbd>Ctrl</kbd> into the combo plays the first selected song right away.
* <kbd>Space</kbd> toggles playback
@ -154,6 +156,7 @@ import expandIcon from '../assets/icons/expand.svg'
import filterIcon from '../assets/icons/filter.svg'
import heartIcon from '../assets/icons/heart.svg'
import plusIcon from '../assets/icons/plus-circle.svg'
import queueIcon from '../assets/icons/queue.svg'
import repeatIcon from '../assets/icons/repeat.svg'
import shuffleIcon from '../assets/icons/shuffle.svg'
import slidersIcon from '../assets/icons/sliders.svg'