Hello everybody. I’m trying to make a minimalist player, only the play button, volume and being able to select the playlist.
I have 2 problems:
- Eliminate those white rectangles, both from “oh-player-card” and from “oh-slider-card” and be able to center them.
- Link “oh-link” with the icon and the label to select the playlist. I did the latter but I could select the list from the entire player and not from the delimited area.
This is what I have done so far with the help of other players on the forum.
uid: unireproductor_cell_v1
component: f7-card
config:
expandable: false
noShadow: false
class:
- card-expandable-animate-width
style:
border-radius: var(--f7-card-expandable-border-radius)
box-shadow: var(--f7-card-expandable-box-shadow)
background-color: rgba(228,228,228,0.9)
height: 120px
max-height: 400px
min-height: 400px
min-width: 325px
max-width: 400px
--f7-card-expandable-tablet-border-radius: 2px
--f7-card-expandable-margin-horizontal: 5px
--f7-card-expandable-margin-vertical: 10px
--webkit-user-select: none
--moz-user-select: none
--ms-user-select: none
display: flex;
flex-direction: column
justify-content: space-between
slots:
default:
- component: f7-card-content
config:
style:
width: 100%
slots:
default:
- component: f7-block
config:
class:
- no-padding
style:
margin: -4px
slots:
default:
- component: f7-row
config: {}
slots:
default:
- component: Label
config:
text: Reproductor
style:
font-size: 14px
font-weight: 500
color: rgb(0,0,0,0.5)
text-align: center
- component: oh-player-card
config:
style:
width: 200px
height: 41px
background: black
class:
- display-flex
- no-padding
- margin
- align-content-stretch
- align-items-center
- justify-content-space-around
item: MusicPlayerDaemon_MediaControl
- component: oh-slider-card
config:
noBorder: true
noShadow: true
outline: true
min: 0
max: 100
step: 1
scale: true
scaleSteps: 10
scaleSubSteps: 2
color: green
style:
--f7-range-knob-color: green
--f7-range-size: 40px
--f7-badge-padding: 40px
--f7-badge-size: 8px
--f7-badge-bg-color: lightgreen
- component: f7-card-content
slots:
default:
- component: f7-block
config:
padding-left: 0px
padding-top: 0px
class:
- justify-content-left
slots:
default:
- component: f7-row
slots:
default:
- component: f7-icon
config:
f7: music_note_list
size: 20
style:
color: black
left: 90px
- component: Label
config:
text: =(items.mpd_playlists.state)
style:
color: black
margin-left: -70px
- component: oh-link
config:
action: options
actionItem: mpd_playlists
actionOptions: Lectura,Daft Punk,Otros
item: mpd_playlists
fontSize: small
width: 100%
height: 100%
Any help is welcome.
Thanks.
