Background transparency

KoljaWindeler commented 8 months ago

Hi Amit, I don't want to create annoying tickets but maybe this is something others would like as well:

Could you add a Parameter to the config that changes the visibility of the cover in the background?

In my testing environment I have Mini-Media-Player side-by-side with your card. There are many things that I like better with yours, but it look a bit .. pale? .. in comparison. Mmp has a more vivid visibility with the background pictures.

Nothing important ;)

KoljaWindeler commented 8 months ago

Screenshot_20240121-080405

pathofleastresistor commented 8 months ago

So it's not as simple as a setting with the current way I'm doing it, but I tried out a different method this morning and here's what it looks like:

KoljaWindeler commented 8 months ago

Wow nice.. let me/us beta test ;)

pathofleastresistor commented 8 months ago

It's sitting in this branch - https://github.com/pathofleastresistor/polr-ytube-media-card/tree/pathofleastresistor/issue18

You get new css variables that you can adjust using card_mod: --polr-ytube-bg-brightness - use this to adjust the brightness filter applied to the cover image. Default 40%. --polr-ytube-bg-color - use this to adjust the background color of the card and other elements. Default #1c1c1c. --polr-ytube-text-color - use this to adjust the text color of the card. Default #ffffff. --primary-color - use this to adjust the primary color of selected elements. Defaults to the primary color you select in HA.

KoljaWindeler commented 8 months ago

hi, okay .. I have to ask .. simply using https://github.com/pathofleastresistor/polr-ytube-media-card/blob/pathofleastresistor/issue18/polr-ytube-media-card.js instead of the original js? or what am i suppose to do? :D

pathofleastresistor commented 8 months ago

simply using https://github.com/pathofleastresistor/polr-ytube-media-card/blob/pathofleastresistor/issue18/polr-ytube-media-card.js

Yup that should work. I check in the built js for the latest commit.

Alternatively, you can clone this repository in to your dev environment, switch to the right branch, and manually add the js file as a resource (where to do that). More work though :)

sdrapha commented 8 months ago

I came to github with a screenshot already on the clipboard, my goal was to open this issue, that was already here. lol. So I'm just adding more noise to it, and bumping this request up.

I'll check out the other branch. Thanks for all the great work so far!!! Really really apreciate !!!

sdrapha commented 8 months ago

I tested the other branch, it helps

Only I could no make --polr-ytube-text-color: to do anything, nothing changed.

type: custom:polr-ytube-playing-card
entity_id: media_player.yt_music_rapha
coverNavigation: false
card_mod:
  style: |
    ha-card {
      --polr-ytube-bg-brightness: 18%;
      --polr-ytube-bg-color: rgba(0,50,50,1);
      --polr-ytube-text-color: blue;
      --primary-color: var(--paper-item-icon-active-color);
    }

pathofleastresistor / polr-ytube-media-card

Background transparency #18