# Button card + media card

**URL:** <https://forum.hacf.fr/t/button-card-media-card/12503>\
**Category:** Entraide Home Assistant\
**Tags:** aide\
**Created:** [Juillet 20, 2022, 3:14 UTC](https://forum.hacf.fr/t/button-card-media-card/12503 "2022-07-20T15:14:54Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Marleo](https://forum.hacf.fr/user_avatar/forum.hacf.fr/marleo/32/95060_2.png) [@Marleo](https://forum.hacf.fr/u/Marleo)\
**Post date:** [Juillet 20, 2022, 3:14 UTC](https://forum.hacf.fr/t/button-card-media-card/12503/1 "2022-07-20T15:14:54Z")

</div>

Salut  
je suis entrain de me faire un dashboard «&nbsp;musique&nbsp;»  
J’ai tenté un truc avec un button card qui déclenche un script pour lancer une radio, le déclenchement est ok  
Je souhaité intégrer un filtre d’opacité si le bouton n’est pas activé j’ai pas réussi

Voici le code :

```auto
type: custom:button-card
name: SweetFM
show_icon: false
show_name: false
icon: mdi:radio-fm
aspect_ratio: 1/1
styles:
  card:
    - background: url(/local/images/fondsweetfm.png)
    - border-radius: 20%
    - transition: true
    - position: absolute
state:
  - value: 'off'
    style:
      card:
        filter: grayscale(60%);
tap_action:
  action: call-service
  service: script.1658263809061

```

Savez vous ce qu’il manque ?  
Et savoir comment gérer la taille de l’image, j’ai pas trouvé le code. Elle n’est pas proportionné  
 ![image](https://forum.hacf.fr/uploads/default/original/2X/5/5ab744d6c091b4c992aa3b0c80c433115846ebb0.png)

Dernière question sur la media card, comment puis je récupèrer le nom de la lecture, SweetFM dans mon exemple pour qu’il soit inscrit à la place de «&nbsp;defaut media receiver&nbsp;»  
 ![image](https://forum.hacf.fr/uploads/default/original/2X/8/80034fbbf83b8376caa5ce74203bcbdd262fcac1.png)

Merci

---

<div class="post-metadata">

**Author:** ![Pulpy-Luke](https://forum.hacf.fr/user_avatar/forum.hacf.fr/pulpy-luke/32/137426_2.png) [@Pulpy-Luke](https://forum.hacf.fr/u/Pulpy-Luke)\
**Post date:** [Juillet 20, 2022, 4:51 UTC](https://forum.hacf.fr/t/button-card-media-card/12503/2 "2022-07-20T16:51:56Z")

</div>

Salut,

Ajoute un ça dans le style, en dessous de ton image par exemple

```auto
    - background-size: cover

```

> **[background-size - CSS : Feuilles de style en cascade | MDN](https://developer.mozilla.org/fr/docs/Web/CSS/background-size#cover)**
>
> La propriété CSS background-size définit la taille des images d'arrière-plan pour l'élément. La taille de l'image peut être contrainte, complètement ou partiellement afin de conserver ses proportions.

---

<div class="post-metadata">

**Author:** ![Marleo](https://forum.hacf.fr/user_avatar/forum.hacf.fr/marleo/32/95060_2.png) [@Marleo](https://forum.hacf.fr/u/Marleo)\
**Post date:** [Juillet 20, 2022, 7:13 UTC](https://forum.hacf.fr/t/button-card-media-card/12503/3 "2022-07-20T19:13:22Z")

</div>

Salut  
Ah nickel c’est ce que je cherchais merci