resize buttons on mediaitems
This commit is contained in:
vapormusic
parent
bd66494f9b
commit
1a7be252a0
3 changed files with 38 additions and 38 deletions
|
|
@ -2707,8 +2707,8 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
|
|||
appearance: none;
|
||||
padding:0px;
|
||||
border:0px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 50%;
|
||||
background: rgba(50, 50, 50, 0.7);
|
||||
cursor: pointer;
|
||||
|
|
@ -2718,15 +2718,15 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
|
|||
|
||||
>.play-btn {
|
||||
position: absolute;
|
||||
bottom: 16px;
|
||||
right: 16px;
|
||||
bottom: 14px;
|
||||
left: 14px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
>.menu-btn {
|
||||
position: absolute;
|
||||
bottom: 16px;
|
||||
left: 16px;
|
||||
bottom: 14px;
|
||||
right: 14px;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -25,10 +25,10 @@
|
|||
<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': '200px',
|
||||
'margin-left': '250px',
|
||||
width: '40px',
|
||||
height: '40px',} :
|
||||
: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': '205px',
|
||||
'margin-left': '260px', 'margin-bottom': '140px',
|
||||
width: '30px',
|
||||
height: '30px',} :
|
||||
{margin: '35px', 'margin-left': '95px',
|
||||
width: '120px',
|
||||
height: '120px',}]" @click="app.playMediaItem(item)">
|
||||
|
|
@ -40,10 +40,10 @@
|
|||
<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': '200px',
|
||||
'margin-left': '250px',
|
||||
width: '40px',
|
||||
height: '40px',} :
|
||||
: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': '205px',
|
||||
'margin-left': '260px', 'margin-bottom': '140px',
|
||||
width: '30px',
|
||||
height: '30px',} :
|
||||
{margin: '35px', 'margin-left': '95px',
|
||||
width: '120px',
|
||||
height: '120px',}]" @click="app.playMediaItem(item)">
|
||||
|
|
|
|||
|
|
@ -14,24 +14,24 @@
|
|||
<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','position': 'absolute',
|
||||
width: '40px',
|
||||
height: '40px',} :
|
||||
{margin: '35px','position': 'absolute',
|
||||
: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': '153px','position': 'absolute','margin-left': '153px',
|
||||
width: '30px',
|
||||
height: '30px',} :
|
||||
{margin: '35px',display:'none',
|
||||
width: '120px',
|
||||
height: '120px',}]" @click="app.playMediaItem(item)">
|
||||
<%- include("../svg/play.svg") %>
|
||||
height: '120px',}]" @click="clickContext()" >
|
||||
<%- include("../svg/more.svg") %>
|
||||
</div>
|
||||
<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')) ? {'position': 'absolute','margin': '140px',
|
||||
width: '40px', 'margin-left': '10px',
|
||||
height: '40px',} :
|
||||
{display: 'none',margin: '35px',
|
||||
: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')) ? {'position': 'absolute','margin': '153px',
|
||||
width: '30px', 'margin-left': '8px',
|
||||
height: '30px',} :
|
||||
{margin: '35px','position': 'absolute',
|
||||
width: '120px',
|
||||
height: '120px',}]" @click="clickContext()">
|
||||
<%- include("../svg/more.svg") %>
|
||||
height: '120px',}]" @click="app.playMediaItem(item)">
|
||||
<%- include("../svg/play.svg") %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="title text-overflow-elipsis"
|
||||
|
|
@ -52,24 +52,24 @@
|
|||
<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','position': 'absolute',
|
||||
width: '40px',
|
||||
height: '40px',} :
|
||||
{margin: '35px','position': 'absolute',
|
||||
: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': '153px','position': 'absolute','margin-left': '153px',
|
||||
width: '30px',
|
||||
height: '30px',} :
|
||||
{margin: '35px','position': 'absolute', display: 'none',
|
||||
width: '120px',
|
||||
height: '120px',}]" @click="app.playMediaItem(item)">
|
||||
<%- include("../svg/play.svg") %>
|
||||
height: '120px',}]" @click="clickContext()">
|
||||
<%- include("../svg/more.svg") %>
|
||||
</div>
|
||||
<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')) ? {'position': 'absolute','margin': '140px',
|
||||
width: '40px', 'margin-left': '10px',
|
||||
height: '40px',} :
|
||||
{display: 'none',margin: '35px','position': 'absolute',
|
||||
: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')) ? {'position': 'absolute','margin': '153px',
|
||||
width: '30px', 'margin-left': '8px',
|
||||
height: '30px',} :
|
||||
{margin: '35px','position': 'absolute',
|
||||
width: '120px',
|
||||
height: '120px',}]" @click="clickContext()">
|
||||
<%- include("../svg/more.svg") %>
|
||||
height: '120px',}]" @click="app.playMediaItem(item)" >
|
||||
<%- include("../svg/play.svg") %>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue