Merge branch 'upcoming' of https://github.com/ciderapp/Cider into upcoming
This commit is contained in:
commit
7aeff80ce4
6 changed files with 50 additions and 32 deletions
|
@ -2139,7 +2139,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
|
|||
}
|
||||
|
||||
.md-btn {
|
||||
background: rgba(100, 100, 100, 0.5);
|
||||
background: rgb(100 100 100 / 25%);
|
||||
padding: 8px 14px;
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
|
@ -2161,8 +2161,10 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
|
|||
}
|
||||
|
||||
&.md-btn-primary {
|
||||
background: var(--keyColor);
|
||||
background: rgb(255 43 82 / 50%);
|
||||
color: white;
|
||||
border: 1px solid rgb(220 53 69 / 25%);
|
||||
border-top: 1px solid rgb(220 53 69 / 50%);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
@ -2230,11 +2232,11 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
|
|||
padding: 6px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid rgba(200, 200, 200, 0.1);
|
||||
border-top: 1px solid rgba(100, 100, 100, 0.5);
|
||||
font-family: inherit;
|
||||
font-size: 14px;
|
||||
background: rgba(100, 100, 100, 0.25);
|
||||
color: #c8c8c8;
|
||||
font-weight: 500;
|
||||
color: #eee;
|
||||
|
||||
option {
|
||||
font-size: 1em;
|
||||
|
|
|
@ -1,18 +1,15 @@
|
|||
<script type="text/x-template" id="add-to-playlist">
|
||||
<template>
|
||||
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.resetState()" @contextmenu.self="app.resetState()">
|
||||
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.resetState()"
|
||||
@contextmenu.self="app.resetState()">
|
||||
<div class="modal-window">
|
||||
<div class="modal-header">
|
||||
<div class="modal-title">{{app.getLz('action.addToLibrary')}}</div>
|
||||
<div class="modal-title">{{app.getLz('action.addToPlaylist')}}</div>
|
||||
<button class="close-btn" @click="app.resetState()"></button>
|
||||
</div>
|
||||
<div class="modal-content">
|
||||
<button class="playlist-item"
|
||||
:class="{ focused: playlist.id == focused }"
|
||||
@click="addToPlaylist(playlist.id)" style="width:100%;" v-for="playlist in playlistSorted" v-if="playlist.attributes.canEdit && playlist.type != 'library-playlist-folders'">
|
||||
<div class="icon"><%- include("../svg/playlist.svg") %></div>
|
||||
<div class="name">{{ playlist.attributes.name }}</div>
|
||||
</button>
|
||||
<sidebar-playlist :playlist-select="playlistSelect" v-for="item in $root.getPlaylistFolderChildren('p.playlistsroot')" :item="item">
|
||||
</sidebar-playlist>
|
||||
</div>
|
||||
<div class="modal-search">
|
||||
<div class="search-input-container" style="width:100%;margin: 16px 0;">
|
||||
|
@ -61,6 +58,11 @@
|
|||
})
|
||||
},
|
||||
methods: {
|
||||
playlistSelect(playlist) {
|
||||
if(playlist.type != "library-playlist-folders") {
|
||||
this.addToPlaylist(playlist.id)
|
||||
}
|
||||
},
|
||||
addToPlaylist(id) {
|
||||
app.addSelectedToPlaylist(id)
|
||||
},
|
||||
|
|
|
@ -1,11 +1,10 @@
|
|||
<script type="text/x-template" id="mediaitem-artwork">
|
||||
<div class="mediaitem-artwork" :class="[{'rounded': (type == 'artists')}, classes]" :key="url"
|
||||
v-observe-visibility="{callback: visibilityChanged}">
|
||||
<div class="mediaitem-artwork" :class="[{'rounded': (type == 'artists')}, classes]" :key="url">
|
||||
<img :src="app.getMediaItemArtwork(url, size, width)"
|
||||
decoding="async" loading="lazy"
|
||||
decoding="async"
|
||||
:style="{background: bgcolor}"
|
||||
class="mediaitem-artwork--img">
|
||||
<div v-if="video && isVisible && getVideoPriority()" class="animatedartwork-view-box">
|
||||
<div v-if="video && getVideoPriority()" class="animatedartwork-view-box">
|
||||
<animatedartwork-view :priority="getVideoPriority()" :video="video"></animatedartwork-view>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -93,9 +92,6 @@
|
|||
width: this.size + 'px',
|
||||
height: this.size + 'px'
|
||||
};
|
||||
},
|
||||
visibilityChanged: function (isVisible, entry) {
|
||||
this.isVisible = isVisible
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
@dragover="dragOver"
|
||||
@drop="onDrop"
|
||||
:href="item.href"
|
||||
@click='item.type != "library-playlist-folders" ? openPlaylist(item) : getPlaylistChildren(item)'>
|
||||
@click='clickEvent()'>
|
||||
<template v-if="!renaming">
|
||||
<div class="sidebar-icon" v-html="icon"></div> {{ item.attributes.name }}
|
||||
</template>
|
||||
|
@ -15,7 +15,7 @@
|
|||
</button>
|
||||
<div class="folder-body" v-if="item.type === 'library-playlist-folders' && folderOpened">
|
||||
<template v-if="children.length != 0">
|
||||
<sidebar-playlist v-for="item in children" :item="item" :key="item.id"></sidebar-playlist>
|
||||
<sidebar-playlist v-for="item in children" :playlist-select="playlistSelect" :item="item" :key="item.id"></sidebar-playlist>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="spinner"></div>
|
||||
|
@ -31,6 +31,10 @@
|
|||
item: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
playlistSelect: {
|
||||
type: Function,
|
||||
required: false
|
||||
}
|
||||
},
|
||||
data: function () {
|
||||
|
@ -50,6 +54,17 @@
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
clickEvent() {
|
||||
if(this.item.type != "library-playlist-folders") {
|
||||
if(this.playlistSelect) {
|
||||
this.playlistSelect(this.item)
|
||||
}else{
|
||||
this.openPlaylist(this.item)
|
||||
}
|
||||
}else{
|
||||
this.getPlaylistChildren(this.item)
|
||||
}
|
||||
},
|
||||
rename() {
|
||||
this.renaming = false
|
||||
|
||||
|
|
|
@ -62,11 +62,11 @@
|
|||
</div>
|
||||
</template>
|
||||
<div class="playlist-controls" v-observe-visibility="{callback: isHeaderVisible}">
|
||||
<button class="md-btn md-btn-icon" style="min-width: 100px;"
|
||||
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
|
||||
@click="app.mk.shuffleMode = 0; play()"> <img class="md-ico-play">
|
||||
{{app.getLz('term.play')}}
|
||||
</button>
|
||||
<button class="md-btn md-btn-icon" style="min-width: 100px;"
|
||||
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
|
||||
@click="app.mk.shuffleMode = 1;play()"> <img class="md-ico-shuffle">
|
||||
{{app.getLz('term.shuffle')}}
|
||||
</button>
|
||||
|
@ -98,11 +98,11 @@
|
|||
</div>
|
||||
<div class="col-auto flex-center">
|
||||
<div>
|
||||
<button class="md-btn md-btn-icon" style="min-width: 100px;"
|
||||
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
|
||||
@click="app.mk.shuffleMode = 0; play()"> <img class="md-ico-play">
|
||||
{{app.getLz('term.play')}}
|
||||
</button>
|
||||
<button class="md-btn md-btn-icon" style="min-width: 100px;"
|
||||
<button class="md-btn md-btn-primary md-btn-icon" style="min-width: 100px;"
|
||||
@click="app.mk.shuffleMode = 1;play()"> <img class="md-ico-shuffle">
|
||||
{{app.getLz('term.shuffle')}}
|
||||
</button>
|
||||
|
|
|
@ -40,9 +40,10 @@
|
|||
<div class="md-option-segment">
|
||||
{{$root.getLz('term.equalizer')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-btn md-option-segment_auto">
|
||||
<label class="list-button list-element"
|
||||
onclick="app.modals.equalizer = true">{{$root.getLz('term.equalizer')}}</label>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<button class="md-btn" onclick="app.modals.equalizer = true">
|
||||
{{$root.getLz('term.equalizer')}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line" v-show="app.cfg.advanced.AudioContext">
|
||||
|
@ -475,9 +476,11 @@
|
|||
<div class="md-option-segment">
|
||||
{{$root.getLz('settings.option.connectivity.lastfmScrobble')}}
|
||||
</div>
|
||||
<div class="md-option-segment md-btn md-option-segment_auto">
|
||||
<label class="list-button list-element" id="lfmConnect" ref="lfmConnect"
|
||||
onclick="app.LastFMAuthenticate()">{{$root.getLz('term.connect')}}</label>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<button class="md-btn" id="lfmConnect" ref="lfmConnect"
|
||||
onclick="app.LastFMAuthenticate()">
|
||||
{{$root.getLz('term.connect')}}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line" v-show ="app.cfg.lastfm.enabled">
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue