Reverted mediaitem-mvview changes

This commit is contained in:
booploops 2021-12-15 02:17:37 -08:00
parent addcfe3256
commit 92032ffb02
2 changed files with 29 additions and 23 deletions

View file

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

View file

@ -8,14 +8,14 @@
:url="item.attributes.artwork ? item.attributes.artwork.url : ''"
:video="(item.attributes != null && item.attributes.editorialVideo != null) ? (item.attributes.editorialVideo.motionDetailSquare ? item.attributes.editorialVideo.motionDetailSquare.video : (item.attributes.editorialVideo.motionSquareVideo1x1 ? item.attributes.editorialVideo.motionSquareVideo1x1.video : '')) : '' "
:size="imagesize ?? 300"
></mediaitem-artwork>
></mediaitem-artwork>
</div>
<div class="cd-mediaitem-mvview-overlay" @click.self='app.routeView(item)'>
<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': '74px',
'margin-left': '174px',
: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',
@ -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>