okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fancier popover

Browse source
This commit is contained in:
booploops 2022-05-24 01:07:38 -07:00
parent b5ea40ac71
commit 1acbd4e957
4 changed files with 64 additions and 40 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/renderer/less/bootstrap.less vendored
View file

@ -7693,7 +7693,7 @@ fieldset:disabled .btn {
word-wrap: break-word;
background-color: var(--modalBackground);
background-clip: padding-box;
box-shadow: var(--mediaItemShadow), var(--mediaItemShadow-ShadowSubtle);
box-shadow: var(--mediaItemShadow), var(--mediaItemShadow-Shadow);
border-radius: var(--mediaItemRadius);
}
.popover .popover-arrow {

14
src/renderer/less/helpers.less
View file

@ -489,6 +489,19 @@
.mediainfo-popover {
user-select: none;
background-color: rgb(0 0 0 / 100%);
overflow: hidden;
.content {
.shadow-artwork {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: -1;
filter:blur(32px) brightness(50%) saturate(280%);
}
.popover-artwork {
width: 200px;
height: 200px;
@ -507,3 +520,4 @@
}
}
}
}

5
src/renderer/views/app/chrome-bottom.ejs
View file

@ -8,6 +8,10 @@
<mediaitem-artwork :url="currentArtUrl"></mediaitem-artwork>
</div>
<b-popover custom-class="mediainfo-popover" target="artworkLCD" triggers="hover" placement="right">
<div class="content">
<div class="shadow-artwork">
<mediaitem-artwork :url="currentArtUrl" :url="currentArtUrlRaw"></mediaitem-artwork>
</div>
<div class="popover-artwork">
<mediaitem-artwork :size="210" :url="currentArtUrlRaw"></mediaitem-artwork>
</div>
@ -22,6 +26,7 @@
<button class="md-btn md-btn-small" style="width: 100%;" @click="drawer.open = false; miniPlayer(true)">{{ $root.getLz("term.miniplayer") }}</button>
<button class="md-btn md-btn-small" style="width: 100%;" @click="drawer.open = false; fullscreen(true)">{{ $root.getLz("term.fullscreenView") }}</button>
</div>
</div>
</b-popover>
<div class="playback-info">
<div class="song-name"

5
src/renderer/views/app/chrome-top.ejs
View file

@ -80,6 +80,10 @@
<mediaitem-artwork :url="currentArtUrl"></mediaitem-artwork>
</div>
<b-popover custom-class="mediainfo-popover" target="artworkLCD" triggers="hover" placement="bottom">
<div class="content">
<div class="shadow-artwork">
<mediaitem-artwork :url="currentArtUrl" :url="currentArtUrlRaw"></mediaitem-artwork>
</div>
<div class="popover-artwork">
<mediaitem-artwork :size="210" :url="currentArtUrlRaw"></mediaitem-artwork>
</div>
@ -94,6 +98,7 @@
<button class="md-btn md-btn-small" style="width: 100%;" @click="drawer.open = false; miniPlayer(true)">{{ $root.getLz("term.miniplayer") }}</button>
<button class="md-btn md-btn-small" style="width: 100%;" @click="drawer.open = false; fullscreen(true)">{{ $root.getLz("term.fullscreenView") }}</button>
</div>
</div>
</b-popover>
<div class="playback-info">
<div class="chrome-icon-container">