MyFavMirrors/owntone-server
1
0
Fork 0
mirror of https://github.com/owntone/owntone-server.git synced 2025-01-14 00:05:03 -05:00
Code Issues Packages Projects Releases Wiki Activity

[web] Revert icon changes (fixes ignored size attribute)

Browse Source
This commit is contained in:
chme 2022-06-15 19:24:51 +02:00
parent c020905f2e
commit 58c6b2891c
65 changed files with 350 additions and 256 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web-src/src/components/DropdownMenu.vue
View File

@ -12,7 +12,7 @@
@click="is_active = !is_active"
>
<span v-text="option.name" />
<mdicon class="icon" name="chevron-down" size="16" />
<span class="icon"><mdicon name="chevron-down" size="16" /></span>
</button>
</div>
<div id="dropdown-menu" class="dropdown-menu" role="menu">

4
web-src/src/components/ListAlbums.vue
View File

@ -38,7 +38,9 @@
</div>
<div class="media-right" style="padding-top: 0.7rem">
<a @click.prevent.stop="open_dialog(album.item)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</div>
</div>

4
web-src/src/components/ListArtists.vue
View File

@ -19,7 +19,9 @@
</div>
<div class="media-right">
<a @click.prevent.stop="open_dialog(artist.item)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</div>
</div>

4
web-src/src/components/ListComposers.vue
View File

@ -19,7 +19,9 @@
</div>
<div class="media-right">
<a @click.prevent.stop="open_dialog(composer.item)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</div>
</div>

10
web-src/src/components/ListDirectories.vue
View File

@ -5,7 +5,9 @@
@click="open_parent_directory()"
>
<figure class="media-left fd-has-action">
<mdicon class="icon" name="subdirectory-arrow-left" size="16" />
<span class="icon"
><mdicon name="subdirectory-arrow-left" size="16"
/></span>
</figure>
<div class="media-content fd-has-action is-clipped">
<h1 class="title is-6">..</h1>
@ -17,7 +19,7 @@
<template v-for="directory in directories" :key="directory.path">
<div class="media" @click="open_directory(directory)">
<figure class="media-left fd-has-action">
<mdicon class="icon" name="folder" size="16" />
<span class="icon"><mdicon name="folder" size="16" /></span>
</figure>
<div class="media-content fd-has-action is-clipped">
<h1
@ -28,7 +30,9 @@
</div>
<div class="media-right">
<a @click.prevent.stop="open_dialog(directory)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</div>
</div>

4
web-src/src/components/ListGenres.vue
View File

@ -15,7 +15,9 @@
</div>
<div class="media-right">
<a @click.prevent.stop="open_dialog(genre.item)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</div>
</div>

8
web-src/src/components/ListItemQueueItem.vue
View File

@ -1,11 +1,9 @@
<template>
<div v-if="is_next || !show_only_next_items" class="media">
<div v-if="edit_mode" class="media-left">
<mdicon
class="icon has-text-grey fd-is-movable handle"
name="drag-horizontal"
size="16"
/>
<span class="icon has-text-grey fd-is-movable handle"
><mdicon name="drag-horizontal" size="16"
/></span>
</div>
<div class="media-content fd-has-action is-clipped" @click="play">
<h1

8
web-src/src/components/ListPlaylists.vue
View File

@ -7,14 +7,18 @@
@click="open_playlist(playlist.item)"
>
<figure class="media-left fd-has-action">
<mdicon class="icon" :name="icon_name(playlist.item)" size="16" />
<span class="icon"
><mdicon :name="icon_name(playlist.item)" size="16"
/></span>
</figure>
<div class="media-content fd-has-action is-clipped">
<h1 class="title is-6" v-text="playlist.item.name" />
</div>
<div class="media-right">
<a @click.prevent.stop="open_dialog(playlist.item)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</div>
</div>

6
web-src/src/components/ListTracks.vue
View File

@ -8,7 +8,7 @@
@click="play_track(index, track)"
>
<figure v-if="show_icon" class="media-left fd-has-action">
<mdicon class="icon" name="file-outline" size="16" />
<span class="icon"><mdicon name="file-outline" size="16" /></span>
</figure>
<div class="media-content fd-has-action is-clipped">
<h1
@ -29,7 +29,9 @@
</div>
<div class="media-right">
<a @click.prevent.stop="open_dialog(track)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</div>
</div>

6
web-src/src/components/ModalDialog.vue
View File

@ -11,7 +11,7 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="$emit('close')">
<mdicon class="icon" name="cancel" size="16" />
<span class="icon"><mdicon name="cancel" size="16" /></span>
<span
class="is-size-7"
v-text="close_action ? close_action : t('dialog.cancel')"
@ -22,7 +22,7 @@
class="card-footer-item has-background-danger has-text-white has-text-weight-bold"
@click="$emit('delete')"
>
<mdicon class="icon" name="delete" size="16" />
<span class="icon"><mdicon name="delete" size="16" /></span>
<span class="is-size-7" v-text="delete_action" />
</a>
<a
@ -30,7 +30,7 @@
class="card-footer-item has-background-info has-text-white has-text-weight-bold"
@click="$emit('ok')"
>
<mdicon class="icon" name="check" size="16" />
<span class="icon"><mdicon name="check" size="16" /></span>
<span class="is-size-7" v-text="ok_action" />
</a>
</footer>

12
web-src/src/components/ModalDialogAddRss.vue
View File

@ -18,7 +18,9 @@
:placeholder="$t('dialog.add.rss.placeholder')"
:disabled="loading"
/>
<mdicon class="icon is-left" name="rss" size="16" />
<span class="icon is-left"
><mdicon name="rss" size="16"
/></span>
</p>
<p class="help" v-text="$t('dialog.add.rss.help')" />
</div>
@ -26,7 +28,7 @@
</div>
<footer v-if="loading" class="card-footer">
<a class="card-footer-item button is-loading">
<mdicon class="icon" name="web" size="16" />
<span class="icon"><mdicon name="web" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.add.rss.processing')"
@ -38,14 +40,16 @@
class="card-footer-item has-text-danger"
@click="$emit('close')"
>
<mdicon class="icon" name="cancel" size="16" />
<span class="icon"><mdicon name="cancel" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.add.rss.cancel')" />
</a>
<a
class="card-footer-item has-background-info has-text-white has-text-weight-bold"
@click="add_stream"
>
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.add.rss.add')" />
</a>
</footer>

14
web-src/src/components/ModalDialogAddUrlStream.vue
View File

@ -18,14 +18,16 @@
:placeholder="$t('dialog.add.stream.placeholder')"
:disabled="loading"
/>
<mdicon class="icon is-left" name="web" size="16" />
<span class="icon is-left"
><mdicon name="web" size="16"
/></span>
</p>
</div>
</form>
</div>
<footer v-if="loading" class="card-footer">
<a class="card-footer-item has-text-dark">
<mdicon class="icon" name="web" size="16" />
<span class="icon"><mdicon name="web" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.add.stream.loading')"
@ -37,21 +39,23 @@
class="card-footer-item has-text-danger"
@click="$emit('close')"
>
<mdicon class="icon" name="cancel" size="16" />
<span class="icon"><mdicon name="cancel" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.add.stream.cancel')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="add_stream">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.add.stream.add')" />
</a>
<a
class="card-footer-item has-background-info has-text-white has-text-weight-bold"
@click="play"
>
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.add.stream.play')" />
</a>
</footer>

10
web-src/src/components/ModalDialogAlbum.vue
View File

@ -88,15 +88,19 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.album.add')" />
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.album.add-next')" />
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.album.play')" />
</a>
</footer>

10
web-src/src/components/ModalDialogArtist.vue
View File

@ -40,15 +40,19 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.artist.add')" />
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.artist.add-next')" />
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.artist.play')" />
</a>
</footer>

10
web-src/src/components/ModalDialogComposer.vue
View File

@ -39,18 +39,22 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.composer.add')" />
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.composer.add-next')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.composer.play')" />
</a>
</footer>

10
web-src/src/components/ModalDialogDirectory.vue
View File

@ -10,18 +10,22 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.directory.add')" />
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.directory.add-next')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.directory.play')" />
</a>
</footer>

10
web-src/src/components/ModalDialogGenre.vue
View File

@ -33,15 +33,19 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.genre.add')" />
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.genre.add-next')" />
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.genre.play')" />
</a>
</footer>

10
web-src/src/components/ModalDialogPlaylist.vue
View File

@ -33,18 +33,22 @@
</div>
<footer v-if="!playlist.folder" class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.playlist.add')" />
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.playlist.add-next')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.playlist.play')" />
</a>
</footer>

12
web-src/src/components/ModalDialogPlaylistSave.vue
View File

@ -18,14 +18,16 @@
placeholder="Playlist name"
:disabled="loading"
/>
<mdicon class="icon is-left" name="file-music" size="16" />
<span class="icon is-left"
><mdicon name="file-music" size="16"
/></span>
</p>
</div>
</form>
</div>
<footer v-if="loading" class="card-footer">
<a class="card-footer-item has-text-dark">
<mdicon class="icon" name="web" size="16" />
<span class="icon"><mdicon name="web" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.playlist.save.saving')"
@ -37,7 +39,7 @@
class="card-footer-item has-text-danger"
@click="$emit('close')"
>
<mdicon class="icon" name="cancel" size="16" />
<span class="icon"><mdicon name="cancel" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.playlist.save.cancel')"
@ -47,7 +49,9 @@
class="card-footer-item has-background-info has-text-white has-text-weight-bold"
@click="save"
>
<mdicon class="icon" name="content-save" size="16" />
<span class="icon"
><mdicon name="content-save" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.playlist.save.save')"

4
web-src/src/components/ModalDialogQueueItem.vue
View File

@ -137,14 +137,14 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="remove">
<mdicon class="icon" name="delete" size="16" />
<span class="icon"><mdicon name="delete" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.queue-item.remove')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.queue-item.play')" />
</a>
</footer>

4
web-src/src/components/ModalDialogRemotePairing.vue
View File

@ -30,7 +30,7 @@
class="card-footer-item has-text-danger"
@click="$emit('close')"
>
<mdicon class="icon" name="cancel" size="16" />
<span class="icon"><mdicon name="cancel" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.remote-pairing.cancel')"
@ -40,7 +40,7 @@
class="card-footer-item has-background-info has-text-white has-text-weight-bold"
@click="kickoff_pairing"
>
<mdicon class="icon" name="cellphone" size="16" />
<span class="icon"><mdicon name="cellphone" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.remote-pairing.pair')"

10
web-src/src/components/ModalDialogTrack.vue
View File

@ -168,15 +168,19 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.track.add')" />
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span class="is-size-7" v-text="$t('dialog.track.add-next')" />
</a>
<a class="card-footer-item has-text-dark" @click="play_track">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span class="is-size-7" v-text="$t('dialog.track.play')" />
</a>
</footer>

79
web-src/src/components/NavbarBottom.vue
View File

@ -12,7 +12,7 @@
<div class="navbar-brand fd-expanded">
<!-- Link to queue -->
<navbar-item-link to="/" exact>
<mdicon class="icon" name="playlist-play" size="24" />
<span class="icon"><mdicon name="playlist-play" size="24" /></span>
</navbar-item-link>
<!-- Now playing artist/title (not visible on "now playing" page) -->
<router-link
@ -71,11 +71,11 @@
class="navbar-item fd-margin-left-auto is-hidden-desktop"
@click="show_player_menu = !show_player_menu"
>
<mdicon
class="icon"
:name="show_player_menu ? 'chevron-down' : 'chevron-up'"
size="18"
/>
<span class="icon"
><mdicon
:name="show_player_menu ? 'chevron-down' : 'chevron-up'"
size="18"
/></span>
</a>
<!-- Player menu dropup menu (only visible on desktop) -->
<div
@ -86,11 +86,11 @@
class="navbar-link is-arrowless"
@click="show_player_menu = !show_player_menu"
>
<mdicon
class="icon"
:name="show_player_menu ? 'chevron-down' : 'chevron-up'"
size="18"
/>
<span class="icon"
><mdicon
:name="show_player_menu ? 'chevron-down' : 'chevron-up'"
size="18"
/></span>
</a>
<div
class="navbar-dropdown is-right is-boxed"
@ -105,11 +105,11 @@
class="button is-white is-small"
@click="toggle_mute_volume"
>
<mdicon
class="icon"
:name="player.volume > 0 ? 'volume-high' : 'volume-off'"
size="18"
/>
<span class="icon"
><mdicon
:name="player.volume > 0 ? 'volume-high' : 'volume-off'"
size="18"
/></span>
</a>
</div>
<div class="level-item fd-expanded">
@ -145,17 +145,15 @@
<a
class="button is-white is-small"
:class="{ 'is-loading': loading }"
>
<span
><span
class="icon fd-has-action"
:class="{
'has-text-grey-light': !playing && !loading,
'is-loading': loading
}"
@click="togglePlay"
>
<mdicon name="broadcast" size="18" />
</span>
><mdicon name="broadcast" size="18"
/></span>
</a>
</div>
<div class="level-item fd-expanded">
@ -169,13 +167,12 @@
href="stream.mp3"
style="margin-left: 5px"
target="_blank"
>
<mdicon
class="icon"
name="open-in-new"
size="16"
style="vertical-align: middle"
/>
><span class="icon"
><mdicon
name="open-in-new"
size="16"
style="vertical-align: middle"
/></span>
</a>
</p>
<Slider
@ -231,11 +228,11 @@
<div class="level-left fd-expanded">
<div class="level-item" style="flex-grow: 0">
<a class="button is-white is-small" @click="toggle_mute_volume">
<mdicon
class="icon"
:name="player.volume > 0 ? 'volume-high' : 'volume-off'"
size="18"
/>
<span class="icon"
><mdicon
:name="player.volume > 0 ? 'volume-high' : 'volume-off'"
size="18"
/></span>
</a>
</div>
<div class="level-item fd-expanded">
@ -278,8 +275,7 @@
'is-loading': loading
}"
@click="togglePlay"
>
<mdicon name="broadcast" size="16" />
><mdicon name="radio-tower" size="16" />
</span>
</a>
</div>
@ -294,13 +290,12 @@
href="stream.mp3"
style="margin-left: 5px"
target="_blank"
>
<mdicon
class="icon"
name="open-in-new"
size="16"
style="vertical-align: middle"
/>
><span class="icon"
><mdicon
name="open-in-new"
size="16"
style="vertical-align: middle"
/></span>
</a>
</p>
<Slider

5
web-src/src/components/NavbarItemOutput.vue
View File

@ -8,9 +8,8 @@
class="icon fd-has-action"
:class="{ 'has-text-grey-light': !output.selected }"
@click="set_enabled"
>
<mdicon :name="type_class" size="18" :title="output.type" />
</span>
><mdicon :name="type_class" size="18" :title="output.type"
/></span>
</a>
</div>
<div class="level-item fd-expanded">

36
web-src/src/components/NavbarTop.vue
View File

@ -7,25 +7,25 @@
>
<div class="navbar-brand">
<navbar-item-link v-if="is_visible_playlists" to="/playlists">
<mdicon class="icon" name="music-box-multiple" size="16" />
<span class="icon"><mdicon name="music-box-multiple" size="16" /></span>
</navbar-item-link>
<navbar-item-link v-if="is_visible_music" to="/music">
<mdicon class="icon" name="music" size="16" />
<span class="icon"><mdicon name="music" size="16" /></span>
</navbar-item-link>
<navbar-item-link v-if="is_visible_podcasts" to="/podcasts">
<mdicon class="icon" name="podcast" size="16" />
<span class="icon"><mdicon name="microphone" size="16" /></span>
</navbar-item-link>
<navbar-item-link v-if="is_visible_audiobooks" to="/audiobooks">
<mdicon class="icon" name="book-open-variant" size="16" />
<span class="icon"><mdicon name="book-open-variant" size="16" /></span>
</navbar-item-link>
<navbar-item-link v-if="is_visible_radio" to="/radio">
<mdicon class="icon" name="radio-tower" size="16" />
<span class="icon"><mdicon name="radio" size="16" /></span>
</navbar-item-link>
<navbar-item-link v-if="is_visible_files" to="/files">
<mdicon class="icon" name="folder-open" size="16" />
<span class="icon"><mdicon name="folder-open" size="16" /></span>
</navbar-item-link>
<navbar-item-link v-if="is_visible_search" to="/search">
<mdicon class="icon" name="magnify" size="16" />
<span class="icon"><mdicon name="magnify" size="16" /></span>
</navbar-item-link>
<div
class="navbar-burger"
@ -47,7 +47,9 @@
@click="on_click_outside_settings"
>
<a class="navbar-link is-arrowless">
<mdicon class="icon is-hidden-touch" name="menu" size="24" />
<span class="icon is-hidden-touch"
><mdicon name="menu" size="24"
/></span>
<span
class="is-hidden-desktop has-text-weight-bold"
v-text="$t('navigation.title')"
@ -55,11 +57,13 @@
</a>
<div class="navbar-dropdown is-right">
<navbar-item-link to="/playlists">
<mdicon class="icon" name="music-box-multiple" size="16" />
<span class="icon"
><mdicon name="music-box-multiple" size="16"
/></span>
<b v-text="$t('navigation.playlists')" />
</navbar-item-link>
<navbar-item-link to="/music" exact>
<mdicon class="icon" name="music" size="16" />
<span class="icon"><mdicon name="music" size="16" /></span>
<b v-text="$t('navigation.music')" />
</navbar-item-link>
<navbar-item-link to="/music/artists">
@ -87,23 +91,25 @@
/>
</navbar-item-link>
<navbar-item-link to="/podcasts">
<mdicon class="icon" name="podcast" size="16" />
<span class="icon"><mdicon name="microphone" size="16" /></span>
<b v-text="$t('navigation.podcasts')" />
</navbar-item-link>
<navbar-item-link to="/audiobooks">
<mdicon class="icon" name="book-open-variant" size="16" />
<span class="icon"
><mdicon name="book-open-variant" size="16"
/></span>
<b v-text="$t('navigation.audiobooks')" />
</navbar-item-link>
<navbar-item-link to="/radio">
<mdicon class="icon" name="radio-tower" size="16" />
<span class="icon"><mdicon name="radio" size="16" /></span>
<b v-text="$t('navigation.radio')" />
</navbar-item-link>
<navbar-item-link to="/files">
<mdicon class="icon" name="folder-open" size="16" />
<span class="icon"><mdicon name="folder-open" size="16" /></span>
<b v-text="$t('navigation.files')" />
</navbar-item-link>
<navbar-item-link to="/search">
<mdicon class="icon" name="magnify" size="16" />
<span class="icon"><mdicon name="magnify" size="16" /></span>
<b v-text="$t('navigation.search')" />
</navbar-item-link>
<hr class="fd-navbar-divider" />

2
web-src/src/components/PlayerButtonConsume.vue
View File

@ -1,6 +1,6 @@
<template>
<a :class="{ 'is-warning': is_consume }" @click="toggle_consume_mode">
<mdicon class="icon" name="fire" :size="icon_size" />
<span class="icon"><mdicon name="fire" :size="icon_size" /></span>
</a>
</template>

2
web-src/src/components/PlayerButtonNext.vue
View File

@ -1,6 +1,6 @@
<template>
<a :disabled="disabled" @click="play_next">
<mdicon class="icon" name="skip-forward" :size="icon_size" />
<span class="icon"><mdicon name="skip-forward" :size="icon_size" /></span>
</a>
</template>

2
web-src/src/components/PlayerButtonPlayPause.vue
View File

@ -1,6 +1,6 @@
<template>
<a :disabled="disabled" @click="toggle_play_pause">
<mdicon class="icon" :name="icon_name" :size="icon_size" />
<span class="icon"><mdicon :name="icon_name" :size="icon_size" /></span>
</a>
</template>

2
web-src/src/components/PlayerButtonPrevious.vue
View File

@ -1,6 +1,6 @@
<template>
<a :disabled="disabled" @click="play_previous">
<mdicon class="icon" name="skip-backward" :size="icon_size" />
<span class="icon"><mdicon name="skip-backward" :size="icon_size" /></span>
</a>
</template>

2
web-src/src/components/PlayerButtonRepeat.vue
View File

@ -1,6 +1,6 @@
<template>
<a :class="{ 'is-warning': !is_repeat_off }" @click="toggle_repeat_mode">
<mdicon class="icon" :name="icon_name" :size="icon_size" />
<span class="icon"><mdicon :name="icon_name" :size="icon_size" /></span>
</a>
</template>

2
web-src/src/components/PlayerButtonSeekBack.vue
View File

@ -1,6 +1,6 @@
<template>
<a v-if="visible" :disabled="disabled" @click="seek">
<mdicon class="icon" name="rewind" :size="icon_size" />
<span class="icon"><mdicon name="rewind" :size="icon_size" /></span>
</a>
</template>

2
web-src/src/components/PlayerButtonSeekForward.vue
View File

@ -1,6 +1,6 @@
<template>
<a v-if="visible" :disabled="disabled" @click="seek">
<mdicon class="icon" name="fast-forward" :size="icon_size" />
<span class="icon"><mdicon name="fast-forward" :size="icon_size" /></span>
</a>
</template>

2
web-src/src/components/PlayerButtonShuffle.vue
View File

@ -1,6 +1,6 @@
<template>
<a :class="{ 'is-warning': is_shuffle }" @click="toggle_shuffle_mode">
<mdicon class="icon" :name="icon_name" :size="icon_size" />
<span class="icon"><mdicon :name="icon_name" :size="icon_size" /></span>
</a>
</template>

10
web-src/src/components/SpotifyModalDialogAlbum.vue
View File

@ -57,21 +57,25 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.album.add')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.album.add-next')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.album.play')"

10
web-src/src/components/SpotifyModalDialogArtist.vue
View File

@ -37,21 +37,25 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.artist.add')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.artist.add-next')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.artist.play')"

10
web-src/src/components/SpotifyModalDialogPlaylist.vue
View File

@ -42,21 +42,25 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.playlist.add')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.playlist.add-next')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.playlist.play')"

10
web-src/src/components/SpotifyModalDialogTrack.vue
View File

@ -72,21 +72,25 @@
</div>
<footer class="card-footer">
<a class="card-footer-item has-text-dark" @click="queue_add">
<mdicon class="icon" name="playlist-plus" size="16" />
<span class="icon"
><mdicon name="playlist-plus" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.track.add')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="queue_add_next">
<mdicon class="icon" name="playlist-play" size="16" />
<span class="icon"
><mdicon name="playlist-play" size="16"
/></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.track.add-next')"
/>
</a>
<a class="card-footer-item has-text-dark" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span
class="is-size-7"
v-text="$t('dialog.spotify.track.play')"

12
web-src/src/components/TabsAudiobooks.vue
View File

@ -12,11 +12,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon
class="icon is-small"
name="account-music"
size="16"
/>
<span class="icon is-small"
><mdicon name="account-music" size="16"
/></span>
<span v-text="$t('page.audiobooks.tabs.authors')" />
</a>
</li>
@ -28,7 +26,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon class="icon is-small" name="album" size="16" />
<span class="icon is-small"
><mdicon name="album" size="16"
/></span>
<span v-text="$t('page.audiobooks.tabs.audiobooks')" />
</a>
</li>

32
web-src/src/components/TabsMusic.vue
View File

@ -12,7 +12,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon class="icon is-small" name="web" size="16" />
<span class="icon is-small"
><mdicon name="web" size="16"
/></span>
<span v-text="$t('page.browse.tabs.browse')" />
</a>
</li>
@ -24,11 +26,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon
class="icon is-small"
name="account-music"
size="16"
/>
<span class="icon is-small"
><mdicon name="account-music" size="16"
/></span>
<span v-text="$t('page.browse.tabs.artists')" />
</a>
</li>
@ -40,7 +40,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon class="icon is-small" name="album" size="16" />
<span class="icon is-small"
><mdicon name="album" size="16"
/></span>
<span v-text="$t('page.browse.tabs.albums')" />
</a>
</li>
@ -52,7 +54,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon class="icon is-small" name="speaker" size="16" />
<span class="icon is-small"
><mdicon name="speaker" size="16"
/></span>
<span v-text="$t('page.browse.tabs.genres')" />
</a>
</li>
@ -64,11 +68,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon
class="icon is-small"
name="book-open-page-variant"
size="16"
/>
<span class="icon is-small"
><mdicon name="book-open-page-variant" size="16"
/></span>
<span v-text="$t('page.browse.tabs.composers')" />
</a>
</li>
@ -81,7 +83,9 @@
>
<li :class="{ 'is-active': isActive }">
<a @click="navigate" @keypress.enter="navigate">
<mdicon class="icon is-small" name="spotify" size="16" />
<span class="icon is-small"
><mdicon name="spotify" size="16"
/></span>
<span v-text="$t('page.browse.tabs.spotify')" />
</a>
</li>

8
web-src/src/components/TabsSearch.vue
View File

@ -11,7 +11,9 @@
}"
>
<a @click="search_library">
<mdicon class="icon is-small" name="bookshelf" size="16" />
<span class="icon is-small"
><mdicon name="bookshelf" size="16"
/></span>
<span v-text="$t('page.search.tabs.library')" />
</a>
</li>
@ -21,7 +23,9 @@
}"
>
<a @click="search_spotify">
<mdicon class="icon is-small" name="spotify" size="16" />
<span class="icon is-small"
><mdicon name="spotify" size="16"
/></span>
<span v-text="$t('page.search.tabs.spotify')" />
</a>
</li>

6
web-src/src/icons.js
View File

@ -27,6 +27,7 @@ import {
mdiFolderOpen,
mdiMagnify,
mdiMenu,
mdiMicrophone,
mdiMusic,
mdiMusicBoxMultiple,
mdiOpenInNew,
@ -36,7 +37,7 @@ import {
mdiPlay,
mdiPlaylistPlay,
mdiPlaylistPlus,
mdiPodcast,
mdiRadio,
mdiRadioTower,
mdiRefresh,
mdiRepeat,
@ -87,6 +88,7 @@ export const icons = {
mdiFolderOpen,
mdiMagnify,
mdiMenu,
mdiMicrophone,
mdiMusic,
mdiMusicBoxMultiple,
mdiOpenInNew,
@ -96,7 +98,7 @@ export const icons = {
mdiPlay,
mdiPlaylistPlay,
mdiPlaylistPlus,
mdiPodcast,
mdiRadio,
mdiRadioTower,
mdiRefresh,
mdiRepeat,

4
web-src/src/pages/PageAlbum.vue
View File

@ -7,14 +7,14 @@
</h2>
<div class="buttons fd-is-centered-mobile fd-has-margin-top">
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.album.shuffle')" />
</a>
<a
class="button is-small is-light is-rounded"
@click="show_album_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
</div>
</template>

4
web-src/src/pages/PageArtist.vue
View File

@ -24,10 +24,10 @@
class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.artist.shuffle')" />
</a>
</div>

6
web-src/src/pages/PageArtistTracks.vue
View File

@ -13,10 +13,12 @@
class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.artist.shuffle')" />
</a>
</div>

4
web-src/src/pages/PageAudiobooksAlbum.vue
View File

@ -7,14 +7,14 @@
</h2>
<div class="buttons fd-is-centered-mobile fd-has-margin-top">
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span v-text="$t('page.audiobooks.album.play')" />
</a>
<a
class="button is-small is-light is-rounded"
@click="show_album_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
</div>
</template>

4
web-src/src/pages/PageAudiobooksArtist.vue
View File

@ -9,10 +9,10 @@
class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span v-text="$t('page.audiobooks.artist.shuffle')" />
</a>
</div>

6
web-src/src/pages/PageComposer.vue
View File

@ -10,10 +10,12 @@
class="button is-small is-light is-rounded"
@click="show_composer_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.composer.shuffle')" />
</a>
</div>

6
web-src/src/pages/PageComposerTracks.vue
View File

@ -10,10 +10,12 @@
class="button is-small is-light is-rounded"
@click="show_composer_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.composer.shuffle')" />
</a>
</div>

6
web-src/src/pages/PageFiles.vue
View File

@ -11,10 +11,12 @@
class="button is-small is-light is-rounded"
@click="show_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span v-text="$t('page.files.play')" />
</a>
</div>

6
web-src/src/pages/PageGenre.vue
View File

@ -13,10 +13,12 @@
class="button is-small is-light is-rounded"
@click="show_genre_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.genre.shuffle')" />
</a>
</div>

6
web-src/src/pages/PageGenreTracks.vue
View File

@ -13,10 +13,12 @@
class="button is-small is-light is-rounded"
@click="show_genre_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"
><mdicon name="dots-horizontal" size="16"
/></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.genre.shuffle')" />
</a>
</div>

4
web-src/src/pages/PagePlaylist.vue
View File

@ -9,10 +9,10 @@
class="button is-small is-light is-rounded"
@click="show_playlist_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.playlist.shuffle')" />
</a>
</div>

4
web-src/src/pages/PagePodcast.vue
View File

@ -9,10 +9,10 @@
class="button is-small is-light is-rounded"
@click="show_album_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="play" size="16" />
<span class="icon"><mdicon name="play" size="16" /></span>
<span v-text="$t('page.podcast.play')" />
</a>
</div>

6
web-src/src/pages/PagePodcasts.vue
View File

@ -7,7 +7,7 @@
<template #heading-right>
<div class="buttons is-centered">
<a class="button is-small" @click="mark_all_played">
<mdicon class="icon" name="pencil" size="16" />
<span class="icon"><mdicon name="pencil" size="16" /></span>
<span v-text="$t('page.podcasts.mark-all-played')" />
</a>
</div>
@ -31,11 +31,11 @@
<template #heading-right>
<div class="buttons is-centered">
<a v-if="rss.tracks > 0" class="button is-small" @click="update_rss">
<mdicon class="icon" name="refresh" size="16" />
<span class="icon"><mdicon name="refresh" size="16" /></span>
<span v-text="$t('page.podcasts.update')" />
</a>
<a class="button is-small" @click="open_add_podcast_dialog">
<mdicon class="icon" name="rss" size="16" />
<span class="icon"><mdicon name="rss" size="16" /></span>
<span v-text="$t('page.podcasts.add')" />
</a>
</div>

24
web-src/src/pages/PageQueue.vue
View File

@ -14,11 +14,13 @@
:class="{ 'is-info': show_only_next_items }"
@click="update_show_next_items"
>
<mdicon class="icon" name="arrow-collapse-down" size="16" />
<span class="icon"
><mdicon name="arrow-collapse-down" size="16"
/></span>
<span v-text="$t('page.queue.hide-previous')" />
</a>
<a class="button is-small" @click="open_add_stream_dialog">
<mdicon class="icon" name="web" size="16" />
<span class="icon"><mdicon name="web" size="16" /></span>
<span v-text="$t('page.queue.add-stream')" />
</a>
<a
@ -26,11 +28,11 @@
:class="{ 'is-info': edit_mode }"
@click="edit_mode = !edit_mode"
>
<mdicon class="icon" name="pencil" size="16" />
<span class="icon"><mdicon name="pencil" size="16" /></span>
<span v-text="$t('page.queue.edit')" />
</a>
<a class="button is-small" @click="queue_clear">
<mdicon class="icon" name="delete-empty" size="16" />
<span class="icon"><mdicon name="delete-empty" size="16" /></span>
<span v-text="$t('page.queue.clear')" />
</a>
<a
@ -39,7 +41,7 @@
:disabled="queue_items.length === 0"
@click="save_dialog"
>
<mdicon class="icon" name="content-save" size="16" />
<span class="icon"><mdicon name="content-save" size="16" /></span>
<span v-text="$t('page.queue.save')" />
</a>
</div>
@ -61,17 +63,17 @@
>
<template #actions>
<a v-if="!edit_mode" @click.prevent.stop="open_dialog(element)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
<a
v-if="element.id !== state.item_id && edit_mode"
@click.prevent.stop="remove(element)"
>
<mdicon class="icon has-text-grey" name="delete" size="18" />
<span class="icon has-text-grey"
><mdicon name="delete" size="18"
/></span>
</a>
</template>
</list-item-queue-item>

4
web-src/src/pages/PageSearch.vue
View File

@ -16,7 +16,9 @@
placeholder="Search"
autocomplete="off"
/>
<mdicon class="icon is-left" name="magnify" size="16" />
<span class="icon is-left"
><mdicon name="magnify" size="16"
/></span>
</p>
<p class="help has-text-centered">
<span v-html="$t('page.search.help')" />

6
web-src/src/pages/SettingsPageArtwork.vue
View File

@ -22,7 +22,7 @@
<template #label>
<span v-text="$t('page.settings.artwork.spotify')" />
<a href="https://www.spotify.com/" target="_blank">
<mdicon class="icon" name="open-in-new" size="16" />
<span class="icon"><mdicon name="open-in-new" size="16" /></span>
</a>
</template>
</settings-checkbox>
@ -33,7 +33,7 @@
<template #label>
<span v-text="$t('page.settings.artwork.discogs')" />
<a href="https://www.discogs.com/" target="_blank">
<mdicon class="icon" name="open-in-new" size="16" />
<span class="icon"><mdicon name="open-in-new" size="16" /></span>
</a>
</template>
</settings-checkbox>
@ -44,7 +44,7 @@
<template #label>
<span v-text="$t('page.settings.artwork.coverartarchive')" />
<a href="https://coverartarchive.org/" target="_blank">
<mdicon class="icon" name="open-in-new" size="16" />
<span class="icon"><mdicon name="open-in-new" size="16" /></span>
</a>
</template>
</settings-checkbox>

8
web-src/src/pages/SpotifyPageAlbum.vue
View File

@ -11,14 +11,14 @@
</h2>
<div class="buttons fd-is-centered-mobile fd-has-margin-top">
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.spotify.album.shuffle')" />
</a>
<a
class="button is-small is-light is-rounded"
@click="show_album_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
</div>
</template>
@ -49,7 +49,9 @@
>
<template #actions>
<a @click.prevent.stop="open_track_dialog(track)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-track>

8
web-src/src/pages/SpotifyPageArtist.vue
View File

@ -9,10 +9,10 @@
class="button is-small is-light is-rounded"
@click="show_artist_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.spotify.artist.shuffle')" />
</a>
</div>
@ -41,7 +41,9 @@
</template>
<template #actions>
<a @click.prevent.stop="open_dialog(album)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-album>

16
web-src/src/pages/SpotifyPageBrowse.vue
View File

@ -26,11 +26,9 @@
</template>
<template #actions>
<a @click.prevent.stop="open_album_dialog(album)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-album>
@ -68,11 +66,9 @@
>
<template #actions>
<a @click.prevent.stop="open_playlist_dialog(playlist)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-playlist>

8
web-src/src/pages/SpotifyPageBrowseFeaturedPlaylists.vue
View File

@ -13,11 +13,9 @@
>
<template #actions>
<a @click.prevent.stop="open_playlist_dialog(playlist)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-playlist>

8
web-src/src/pages/SpotifyPageBrowseNewReleases.vue
View File

@ -25,11 +25,9 @@
</template>
<template #actions>
<a @click.prevent.stop="open_album_dialog(album)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-album>

8
web-src/src/pages/SpotifyPagePlaylist.vue
View File

@ -9,10 +9,10 @@
class="button is-small is-light is-rounded"
@click="show_playlist_details_modal = true"
>
<mdicon class="icon" name="dots-horizontal" size="16" />
<span class="icon"><mdicon name="dots-horizontal" size="16" /></span>
</a>
<a class="button is-small is-dark is-rounded" @click="play">
<mdicon class="icon" name="shuffle" size="16" />
<span class="icon"><mdicon name="shuffle" size="16" /></span>
<span v-text="$t('page.spotify.playlist.shuffle')" />
</a>
</div>
@ -34,7 +34,9 @@
>
<template #actions>
<a @click.prevent.stop="open_track_dialog(item.track)">
<mdicon class="icon has-text-dark" name="dots-vertical" size="16" />
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-track>

36
web-src/src/pages/SpotifyPageSearch.vue
View File

@ -16,7 +16,9 @@
placeholder="Search"
autocomplete="off"
/>
<mdicon class="icon is-left" name="magnify" size="16" />
<span class="icon is-left"
><mdicon name="magnify" size="16"
/></span>
</p>
</div>
</form>
@ -50,11 +52,9 @@
>
<template #actions>
<a @click.prevent.stop="open_track_dialog(track)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-track>
@ -105,11 +105,9 @@
>
<template #actions>
<a @click.prevent.stop="open_artist_dialog(artist)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-artist>
@ -171,11 +169,9 @@
</template>
<template #actions>
<a @click.prevent.stop="open_album_dialog(album)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-album>
@ -225,11 +221,9 @@
>
<template #actions>
<a @click.prevent.stop="open_playlist_dialog(playlist)">
<mdicon
class="icon has-text-dark"
name="dots-vertical"
size="16"
/>
<span class="icon has-text-dark"
><mdicon name="dots-vertical" size="16"
/></span>
</a>
</template>
</spotify-list-item-playlist>

8
web-src/src/templates/ContentWithHeading.vue
View File

@ -15,14 +15,18 @@
class="button is-small is-white"
@click="scroll_to_top"
>
<mdicon class="icon is-small" name="chevron-down" size="16" />
<span class="icon is-small"
><mdicon name="chevron-down" size="16"
/></span>
</a>
<a
v-else
class="button is-small is-white"
@click="scroll_to_content"
>
<mdicon class="icon is-small" name="chevron-up" size="16" />
<span class="icon is-small"
><mdicon name="chevron-up" size="16"
/></span>
</a>
</nav>
</section>