Dashboard: Sonos card

Ohh got it…no biggie just wondering. Again thanks for what you have done with this. It’s great!

Still having problems trying use those variables to theme the default theme i am using.
Can you supply some pratical examples about it?

@BeastHouse @Sergeantpup
Anyone of you can share? Looks like you are doing theming.

1 Like

I had to do a couple things to get it where it’s readable and not blinding.

I use a theme:


I did not like the way it displayed the cards on lovelace so I learned how to up the opacity

If you go into the file for your theme and just search ‘rgba’, you’ll find all the results that deal with it, I just looked for the one on cards and ramped it up. The last number is the opacity; .9 represents 90% opacity.


When I did this, it changed all my cards but NOT the sonos page, but now that I was armed with this information, I could easily find what I needed in the sonos card file to ramp up the opacity there; the difference is opacity is spelled out:

THIS is the setting that I think eventually fixed everything to where I could read it by cranking the opacity up to 100 or 1:

I’m sure there’s proper ways to do this but this definitely met my needs without messing up other stuff.

1 Like

I do not believe the defaul theme can be edited other than the basic light v dark in the user settings.

I added the following lines to my themes yaml file, in this case, the google dark theme.

  # Sonos
  sonos-background-color: var(--secondary-background-color)
  sonos-artist-album-text-color: rgb(198, 203, 210)
  sonos-title-color: rgb(198, 203, 210)
  sonos-color: rgb(198, 203, 210)
  sonos-player-section-background: rgb(32, 33, 36)
  sonos-accent-color: rgb(198, 203, 210)

This results in the card looking like this.

Thanks @BeastHouse
We’re a bit off topic now, since this is not specific for the Sonos card but very generic thing about how to set theme variables in home assistant.

Here’s a good guide that I’ve used in the past How to set up themes in home assistant | JuanMTech which does not require you to use another theme as a start.

Hopefully we can stop the discussion on how to set theme variables now @maurizio53 , and focus on improving the Sonos Card? :slightly_smiling_face:

1 Like

Fixed with latest update, thanks.

1 Like

Looks great btw, @BeastHouse ! Ok if I share it in Readme?

Absolutely, heres another shot after I played around with sizing.

Awesome! Share your config so I can add it too :slightly_smiling_face:

For you, or anyone else, feel free to contribute in GitHub directly if you want :hugs:

1 Like
type: custom:custom-sonos-card
name: ''
groupsTitle: Devices
groupingTitle: ''
favoritesTitle: ' Favorites'
headerImage: ''
shuffleFavorites: false
noMediaText: No media selected
allVolumesText: All volumes
entityNameRegex: /SONOS //
entities:
  - media_player.family_room
  - media_player.rumpus_room
theme: Google Dark Theme
layout:
  mobileThresholdPx: 500
  groups:
    width: 25%
    mobileWidth: 80%
  players:
    width: 35%
    mobileWidth: 80%
  favorites:
    width: 25%
    mobileWidth: 80%
  favorite:
    width: 25%
    mobileWidth: 25%

And the theme config if you wanted…

  # Sonos
  sonos-background-color: var(--secondary-background-color)
  sonos-artist-album-text-color: rgb(198, 203, 210)
  sonos-title-color: rgb(0, 0, 0)
  sonos-color: rgb(198, 203, 210)
  sonos-player-section-background: rgb(32, 33, 36)
  sonos-accent-color: rgb(198, 203, 210)
2 Likes

Did anyone managed to display the songlist by pressing your playlist ?

Can you explain me what the --sonos-favorites-multiline variable does? I tried wrap and nowrap but nothing changes…
And more there is a way to make texts in the devices section and in the titles of favourites a little bigger?

Explained here https://github.com/johanfrick/custom-sonos-card/pull/27

In progress here https://github.com/johanfrick/custom-sonos-card/issues/20

Ok, thanks, understood !
And what about texts?

I just noticed that if i go in the media browser and choose spotify, pressing over an item it happens nothing. My sonos devices cannot reproduce anything from Spotify.
Hints?

That’s beta still. Use the stable version.
For the texts, please post an issue in GitHub

Loving the new media browser function, cannot wait until that is working in full. Keep up the great work on this one.

New beta for media browser: v3.0.0-beta2
@BeastHouse @maurizio53
Please provide feedback :pray:

1 Like