added customize sidebar items
This commit is contained in:
parent
2d41095643
commit
71c7b08916
5 changed files with 90 additions and 11 deletions
27
src/renderer/less/bootstrap.less
vendored
27
src/renderer/less/bootstrap.less
vendored
|
@ -1074,13 +1074,14 @@
|
|||
.modal-title {
|
||||
line-height: 1.5;
|
||||
margin : 0;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.modal-body {
|
||||
position : relative;
|
||||
flex : 1 1 auto;
|
||||
padding : 3rem 1rem 1rem 1rem;
|
||||
font-size: 0.9em
|
||||
//font-size: 0.9em
|
||||
}
|
||||
|
||||
.modal-footer {
|
||||
|
@ -1311,6 +1312,10 @@
|
|||
border-radius : 0.25rem;
|
||||
font-family : inherit;
|
||||
transition : color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
|
||||
border: 1px solid rgba(100, 100, 100, 0.35);
|
||||
border-top: 1px solid rgba(100, 100, 100, 0.5);
|
||||
border-radius: 6px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
|
@ -1338,22 +1343,22 @@ fieldset:disabled .btn {
|
|||
|
||||
.btn-primary {
|
||||
color : #fff;
|
||||
background-color: #0d6efd;
|
||||
border-color : #0d6efd;
|
||||
background-color: var(--keyColor-primary);
|
||||
//border-color : #0d6efd;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
color : #fff;
|
||||
background-color: #0b5ed7;
|
||||
border-color : #0a58ca;
|
||||
//background-color: #0b5ed7;
|
||||
//border-color : #0a58ca;
|
||||
}
|
||||
|
||||
.btn-check:focus+.btn-primary,
|
||||
.btn-primary:focus {
|
||||
color : #fff;
|
||||
background-color: #0b5ed7;
|
||||
border-color : #0a58ca;
|
||||
box-shadow : 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
|
||||
//background-color: #0b5ed7;
|
||||
//border-color : #0a58ca;
|
||||
//box-shadow : 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
|
||||
}
|
||||
|
||||
.btn-check:checked+.btn-primary,
|
||||
|
@ -1362,8 +1367,8 @@ fieldset:disabled .btn {
|
|||
.btn-primary.active,
|
||||
.show>.btn-primary.dropdown-toggle {
|
||||
color : #fff;
|
||||
background-color: #0a58ca;
|
||||
border-color : #0a53be;
|
||||
//background-color: #0a58ca;
|
||||
//border-color : #0a53be;
|
||||
}
|
||||
|
||||
.btn-check:checked+.btn-primary:focus,
|
||||
|
@ -1371,7 +1376,7 @@ fieldset:disabled .btn {
|
|||
.btn-primary:active:focus,
|
||||
.btn-primary.active:focus,
|
||||
.show>.btn-primary.dropdown-toggle:focus {
|
||||
box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
|
||||
//box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
|
||||
}
|
||||
|
||||
.btn-primary:disabled,
|
||||
|
|
|
@ -26,6 +26,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
// Buttons
|
||||
.md-btn {
|
||||
font-family: inherit;
|
||||
|
|
|
@ -37,6 +37,7 @@
|
|||
--keyColor-deepPressed: #ff8a9c;
|
||||
--keyColor-deepPressed-rgb: 255, 138, 156;
|
||||
--keyColor-disabled: rgba(250, 88, 106, 0.35);
|
||||
--keyColor-primary: #ff2b52a6;
|
||||
--navigationBarHeight: 0px;
|
||||
--modalBackground: #262626;
|
||||
--songProgressColor: var(--keyColor);
|
||||
|
@ -3222,6 +3223,10 @@ body[platform='darwin'] {
|
|||
content: '%';
|
||||
}
|
||||
|
||||
.modal .close {
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
.spatialproperties-panel.modal-fullscreen{
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
|
@ -43,16 +43,22 @@
|
|||
</div>
|
||||
<sidebar-library-item :name="$root.getLz('term.recentlyAdded')"
|
||||
svg-icon="./assets/feather/plus-circle.svg"
|
||||
v-if="cfg.general.sidebarItems.recentlyAdded"
|
||||
page="library-recentlyadded"></sidebar-library-item>
|
||||
<sidebar-library-item :name="$root.getLz('term.songs')" svg-icon="./assets/feather/music.svg"
|
||||
v-if="cfg.general.sidebarItems.songs"
|
||||
page="library-songs"></sidebar-library-item>
|
||||
<sidebar-library-item :name="$root.getLz('term.albums')" svg-icon="./assets/feather/disc.svg"
|
||||
v-if="cfg.general.sidebarItems.albums"
|
||||
page="library-albums"></sidebar-library-item>
|
||||
<sidebar-library-item :name="$root.getLz('term.artists')" svg-icon="./assets/feather/user.svg"
|
||||
v-if="cfg.general.sidebarItems.artists"
|
||||
page="library-artists"></sidebar-library-item>
|
||||
<sidebar-library-item :name="$root.getLz('term.videos')" svg-icon="./assets/feather/video.svg"
|
||||
v-if="cfg.general.sidebarItems.videos"
|
||||
page="library-videos"></sidebar-library-item>
|
||||
<sidebar-library-item :name="$root.getLz('term.podcasts')" svg-icon="./assets/feather/mic.svg"
|
||||
v-if="cfg.general.sidebarItems.podcasts"
|
||||
page="podcasts">
|
||||
</sidebar-library-item>
|
||||
<template v-if="getPlaylistFolderChildren('p.applemusic').length != 0">
|
||||
|
|
|
@ -61,6 +61,68 @@
|
|||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
Customize Sidebar Items
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<button class="md-btn" v-b-modal.modal-1>
|
||||
Customize
|
||||
</button>
|
||||
</div>
|
||||
<b-modal id="modal-1" centered size="lg" title="Customize Sidebar Items">
|
||||
<div class="settings-option-body">
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{ $root.getLz('term.recentlyAdded') }}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<input type="checkbox" v-model="app.cfg.general.sidebarItems.recentlyAdded" switch/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{ $root.getLz('term.songs') }}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<input type="checkbox" v-model="app.cfg.general.sidebarItems.songs" switch/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{ $root.getLz('term.albums') }}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<input type="checkbox" v-model="app.cfg.general.sidebarItems.albums" switch/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{ $root.getLz('term.artists') }}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<input type="checkbox" v-model="app.cfg.general.sidebarItems.artists" switch/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{ $root.getLz('term.videos') }}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<input type="checkbox" v-model="app.cfg.general.sidebarItems.videos" switch/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="md-option-line">
|
||||
<div class="md-option-segment">
|
||||
{{ $root.getLz('term.podcasts') }}
|
||||
</div>
|
||||
<div class="md-option-segment md-option-segment_auto">
|
||||
<input type="checkbox" v-model="app.cfg.general.sidebarItems.podcasts" switch/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</b-modal>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</b-tab>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue