Commit b6fa4424 authored by Eliot Berriot's avatar Eliot Berriot 💬

Merge branch 'radio-checkbox' into 'develop'

Front enhancements

See merge request funkwhale/funkwhale!620
parents ef9daa8d 8b4f83c3
The buttons displaying an icon now always show a little divider between the icon and the text. (!620)
<template>
<span :class="['ui', {'tiny': discrete}, {'buttons': !dropdownOnly && !iconOnly}]">
<span :title="title" :class="['ui', {'tiny': discrete}, {'icon': !discrete}, {'buttons': !dropdownOnly && !iconOnly}]">
<button
v-if="!dropdownOnly"
:title="labels.playNow"
......
<template>
<button @click="$store.dispatch('favorites/toggle', track.id)" v-if="button" :class="['ui', 'pink', {'inverted': isFavorite}, {'favorited': isFavorite}, 'button']">
<button @click="$store.dispatch('favorites/toggle', track.id)" v-if="button" :class="['ui', 'pink', {'inverted': isFavorite}, {'favorited': isFavorite}, 'icon', 'labeled', 'button']">
<i class="heart icon"></i>
<translate v-if="isFavorite" :translate-context="'Content/Track/Button.Message'">In favorites</translate>
<translate v-else :translate-context="'Content/Track/Button.Message'">Add to favorites</translate>
......
......@@ -23,18 +23,18 @@
<translate :translate-context="'Content/*/Button.Label/Verb, Short'">Play all</translate>
</play-button>
<a :href="wikipediaUrl" target="_blank" class="ui button">
<a :href="wikipediaUrl" target="_blank" class="ui icon labeled button">
<i class="wikipedia w icon"></i>
<translate :translate-context="'Content/*/Button.Label/Verb'">Search on Wikipedia</translate>
</a>
<a v-if="musicbrainzUrl" :href="musicbrainzUrl" target="_blank" class="ui button">
<a v-if="musicbrainzUrl" :href="musicbrainzUrl" target="_blank" class="ui icon labeled button">
<i class="external icon"></i>
<translate :translate-context="'Content/*/Button.Label/Verb'">View on MusicBrainz</translate>
</a>
<template v-if="publicLibraries.length > 0">
<button
@click="showEmbedModal = !showEmbedModal"
class="ui button">
class="ui button icon labeled">
<i class="code icon"></i>
<translate :translate-context="'Content/*/Button.Label/Verb'">Embed</translate>
</button>
......
......@@ -27,7 +27,7 @@
<translate :translate-context="'Content/Artist/Button.Label/Verb'">Play all albums</translate>
</play-button>
<a :href="wikipediaUrl" target="_blank" class="ui button">
<a :href="wikipediaUrl" target="_blank" class="ui icon labeled button">
<i class="wikipedia w icon"></i>
<translate :translate-context="'Content/*/Button.Label/Verb'">Search on Wikipedia</translate>
</a>
......
......@@ -43,22 +43,22 @@
<track-favorite-icon :track="track" :button="true"></track-favorite-icon>
<track-playlist-icon :button="true" v-if="$store.state.auth.authenticated" :track="track"></track-playlist-icon>
<a :href="wikipediaUrl" target="_blank" class="ui button">
<a :href="wikipediaUrl" target="_blank" class="ui icon labeled button">
<i class="wikipedia w icon"></i>
<translate :translate-context="'Content/*/Link/Verb'">Search on Wikipedia</translate>
</a>
<a v-if="musicbrainzUrl" :href="musicbrainzUrl" target="_blank" class="ui button">
<a v-if="musicbrainzUrl" :href="musicbrainzUrl" target="_blank" class="ui icon labeled button">
<i class="external icon"></i>
<translate :translate-context="'Content/*/Link/Verb'">View on MusicBrainz</translate>
</a>
<a v-if="upload" :href="downloadUrl" target="_blank" class="ui button">
<a v-if="upload" :href="downloadUrl" target="_blank" class="ui icon labeled button">
<i class="download icon"></i>
<translate :translate-context="'Content/Track/Link/Verb'">Download</translate>
</a>
<template v-if="publicLibraries.length > 0">
<button
@click="showEmbedModal = !showEmbedModal"
class="ui button">
class="ui icon labeled button">
<i class="code icon"></i>
<translate :translate-context="'Content/Track/Button.Label/Verb'">Embed</translate>
</button>
......
......@@ -26,10 +26,11 @@
<label for="description"><translate :translate-context="'Content/Radio/Input.Label'">Description</translate></label>
<textarea rows="2" id="description" type="text" v-model="radioDesc" :placeholder="labels.placeholder.description" />
</div>
<div class="inline field">
<div class="ui toggle checkbox">
<input id="public" type="checkbox" v-model="isPublic" />
<label for="public"><translate :translate-context="'Content/Radio/Checkbox.Label/Verb'">Display publicly</translate></label>
</div>
<div class="ui hidden divider"></div>
<button :disabled="!canSave" @click="save" :class="['ui', 'green', {loading: isLoading}, 'button']">
<translate :translate-context="'Content/Radio/Button.Label/Verb'">Save</translate>
</button>
......
......@@ -2,7 +2,7 @@
<button
@click="$store.commit('playlists/chooseTrack', track)"
v-if="button"
:class="['ui', 'button']">
:class="['ui', 'icon', 'labeled', 'button']">
<i class="list icon"></i>
<translate :translate-context="'Sidebar/Player/Icon.Tooltip/Verb'">Add to playlist…</translate>
</button>
......
<template>
<button @click="toggleRadio" :class="['ui', 'blue', {'inverted': running}, 'button']">
<button @click="toggleRadio" :class="['ui', 'blue', {'inverted': running}, 'icon', 'labeled', 'button']">
<i class="ui feed icon"></i>
<template v-if="running"><translate>Stop</translate></template>
<template v-else><translate>Start</translate></template>
radio
<template v-if="running"><translate>Stop radio</translate></template>
<template v-else><translate>Start radio</translate></template>
</button>
</template>
......
......@@ -15,6 +15,7 @@
</div>
<div class="extra content">
<user-link v-if="radio.user" :user="radio.user" class="left floated" />
<div class="ui hidden divider"></div>
<radio-button class="right floated button" :type="type" :custom-radio-id="customRadioId"></radio-button>
<router-link
class="ui basic yellow button right floated"
......
......@@ -24,7 +24,7 @@
<div class="ui hidden divider"></div>
<play-button class="orange" :is-playable="playlist.is_playable" :tracks="tracks"><translate :translate-context="'Content/*/Button.Label/Verb, Short'">Play all</translate></play-button>
<button
class="ui icon button"
class="ui icon labeled button"
v-if="$store.state.auth.profile && playlist.user.id === $store.state.auth.profile.id"
@click="edit = !edit">
<i class="pencil icon"></i>
......
......@@ -18,7 +18,7 @@
<div class="ui hidden divider"></div>
<radio-button type="custom" :custom-radio-id="radio.id"></radio-button>
<template v-if="$store.state.auth.username === radio.user.username">
<router-link class="ui icon button" :to="{name: 'library.radios.edit', params: {id: radio.id}}" exact>
<router-link class="ui icon labeled button" :to="{name: 'library.radios.edit', params: {id: radio.id}}" exact>
<i class="pencil icon"></i>
Edit…
</router-link>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment