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

resized music video element, added app.page = 'zoo' for testing new elements

Browse source
This commit is contained in:
booploops 2021-12-15 01:48:37 -08:00
parent 7629cbf5ca
commit addcfe3256
4 changed files with 44 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

15
resources/cider-ui/style.less
View file

@ -2092,8 +2092,8 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
/* mediaitem-mvview */
.cd-mediaitem-mvview {
width: 300px;
height: 250px;
width: 220px;
height: 180px;
display: inline-flex;
flex: 0 0 auto;
flex-direction: column;
@ -2110,9 +2110,8 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
}
.cd-mediaitem-mvview .artwork {
height: 190px;
width: 300px;
background: blue;
height: 120px;
width: 210px;
border-top-left-radius: 6px;
border-top-right-radius: 6px;
background: var(--artwork);
@ -2124,14 +2123,12 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
.cd-mediaitem-mvview-overlay {
position: absolute;
width: 300px;
float: right;
height: 250px;
width: 100%;
height: 100%;
top: 0px;
margin: 10px;
margin-top: 0px;
opacity: 0;
}
.cd-mediaitem-mvview-overlay>* {

32
resources/cider-ui/views/components/mediaitem-mvview.ejs
View file

@ -14,8 +14,8 @@
<div class="button" style="
border-radius: 50%;
background: rgba(50,50,50,0.7);"
:style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '140px',
'margin-left': '250px',
:style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '74px',
'margin-left': '174px',
width: '40px',
height: '40px',} :
{margin: '35px', 'margin-left': '95px',
@ -32,20 +32,20 @@
</div>
</div>
<div class="cd-mediaitem-mvview-overlay" @click.self='app.routeView(item)' tabindex="0">
<div class="button" style="
border-radius: 50%;
background: rgba(50,50,50,0.7);"
:style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '140px',
'margin-left': '250px',
width: '40px',
height: '40px',} :
{margin: '35px', 'margin-left': '95px',
width: '120px',
height: '120px',}]" @click="app.playMediaItem(item)">
<%- include("../svg/play.svg") %>
</div>
</div>
<!-- <div class="cd-mediaitem-mvview-overlay" @click.self='app.routeView(item)' tabindex="0">-->
<!-- <div class="button" style="-->
<!-- border-radius: 50%;-->
<!-- background: rgba(50,50,50,0.7);"-->
<!-- :style="[(!(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('radioStation') && !(item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')): (item.type ?? '')).includes('song')) ? {'margin': '140px',-->
<!-- 'margin-left': '250px', -->
<!-- width: '40px',-->
<!-- height: '40px',} :-->
<!-- {margin: '35px', 'margin-left': '95px',-->
<!-- width: '120px',-->
<!-- height: '120px',}]" @click="app.playMediaItem(item)">-->
<!-- <%- include("../svg/play.svg") %>-->
<!-- </div>-->
<!-- </div>-->
</div>
</template>
</script>

3
resources/cider-ui/views/main.ejs
View file

@ -244,6 +244,9 @@
<cider-artist :data="artistPage.data"></cider-artist>
</template>
</transition>
<transition name="wpfade">
<%- include('pages/zoo') %>
</transition>
<transition name="wpfade">
<%- include('pages/webview') %>
</transition>

19
resources/cider-ui/views/pages/zoo.ejs Normal file
View file

@ -0,0 +1,19 @@
<template v-if="page == 'zoo'">
<div class="content-inner">
<h3>Welcome to element park. *BERR NERR NERR NERR NERRRRR BERR NER NER NER NERRR BERRR NR NR NRRRR*</h3>
<div tabindex="0" class="cd-mediaitem-video">
<div class="artwork">
<mediaitem-artwork
url="https://is1-ssl.mzstatic.com/image/thumb/Video115/v4/00/8b/eb/008beb79-fc95-a24f-eb38-b2cc5a472d4e/8864491155490101.jpg/{w}x{h}mv.{f}"
size="300"
type="song"></mediaitem-artwork>
</div>
<div class="title text-overflow-elipsis">
Name
</div>
<div class="subtitle text-overflow-elipsis">
Artist Name
</div>
</div>
</div>
</template>