Peux-tu partager le code complet stp ?
square: false
type: grid
cards:
- type: custom:mushroom-light-card
entity: light.lampadaire_outlet
use_light_color: false
tap_action:
action: toggle
fill_container: false
secondary_info: none
show_brightness_control: true
card_mod:
style:
.: |
ha-card {
{% if is_state('light.lampadaire_outlet','on') %}
border: 2.5px outset orange;
{% else %}
border: 2.5px ousetgrey
{% endif %};
background: transparent;
}
mushroom-card:
mushroom-state-item:
mushroom-state-info:
$: |
div.container > span {
{% if is_state('light.lampadaire_outlet','on') %}
color: orange;
{% else %}
color: white;
{% endif %};
}
- type: custom:mushroom-entity-card
entity: switch.smart_switch_2006284820749951851148e1e921d967_outlet
icon: mdi:television
tap_action:
action: toggle
fill_container: false
secondary_info: none
icon_color: accent
icon_type: icon
card_mod:
style: |
ha-card {
{% if is_state('switch.smart_switch_2006284820749951851148e1e921d967_outlet','on') %}
border: 2.5px outset orange
{% else %}
border: 2.5px ousetgrey
{% endif %};
background: transparent;
}
columns: 2
Salut @ZoomeoTooknor
Il y a plusieurs fautes de frappe dans ton code :
Bref chez moi :
Entité à « off » :
Entité à « on » :
Le code :
square: false
type: grid
cards:
- type: custom:mushroom-light-card
entity: light.sw_wc_rdc
use_light_color: false
tap_action:
action: toggle
fill_container: false
secondary_info: none
show_brightness_control: true
card_mod:
style:
.: |
ha-card {
{% if is_state('light.sw_wc_rdc','on') %}
border: 2.5px outset orange;
{% else %}
border: 2.5px outset grey;
{% endif %}
background: transparent;
}
mushroom-card:
mushroom-state-item:
mushroom-state-info:
$: |
div.container > span {
{% if is_state('light.sw_wc_rdc','on') %}
color: orange;
{% else %}
color: white;
{% endif %}
}
- type: custom:mushroom-entity-card
entity: light.sw_wc_rdc
icon: mdi:television
tap_action:
action: toggle
fill_container: true
secondary_info: none
icon_color: accent
icon_type: icon
card_mod:
style: |
ha-card {
{% if is_state('light.sw_wc_rdc','on') %}
border: 2.5px outset orange;
{% else %}
border: 2.5px outset grey;
{% endif %}
background: transparent;
}
columns: 2
Même en rajoutant l’espace et en enlevant le « ; », j’ai toujours le souci.
@ ZoomeoTooknor
je confire, aucun problème avec le code que tu as donné toi même ci dessus
j’ai repris ton code et changé les 2 entités tout simplement et aucun PB
square: false
type: grid
cards:
- type: custom:mushroom-light-card
entity: light.on_off_bureau
use_light_color: false
tap_action:
action: toggle
fill_container: false
secondary_info: none
show_brightness_control: true
card_mod:
style:
.: |
ha-card {
{% if is_state('light.on_off_bureau','on') %}
border: 2.5px outset orange;
{% else %}
border: 2.5px ousetgrey
{% endif %};
background: transparent;
}
mushroom-card:
mushroom-state-item:
mushroom-state-info:
$: |
div.container > span {
{% if is_state('light.on_off_bureau','on') %}
color: orange;
{% else %}
color: white;
{% endif %};
}
- type: custom:mushroom-entity-card
entity: switch.on_off_prise_cuisine
icon: mdi:television
tap_action:
action: toggle
fill_container: false
secondary_info: none
icon_color: accent
icon_type: icon
card_mod:
style: |
ha-card {
{% if is_state('switch.on_off_prise_cuisine','on') %}
border: 2.5px outset orange
{% else %}
border: 2.5px ousetgrey
{% endif %};
background: transparent;
}
columns: 2
mais comme tu le vois, ma lampe a en plus un slider pour l’intensité… certainement a regarder de ce coté.
Reprends mon code complet, et modifies uniquement les entités.
Je t’ai signalé 2 erreurs, mais il y en a d’autres.
Post le résultat ensuite.
@LeLapinFou effectivement le code de @ZoomeoTooknor fonctionne, mais :
-
comme déjà dit il y a des fautes de syntaxe et d’orthographe, qu’il fonctionne c’est presque « curieux ».
-
Son problème de base est justement que les deux cartes ne font pas la même hauteur.
Avec mon code les 2 cartes font la même hauteur, même si la lampe « 1 » posséde un « slider » :
1 « J'aime »
En fait j’aime bien la taille initiale.
Si je rajoute le code pour changer la couleur du no de l’entité ça agrandit la carte.
Et du coup en hauteur, comme j’ai une dizaine de cartes sur 2 colonnes, ça dépense l’écran de la tablette en mode paysage.
C’est pour ça que je post mon souci pour voir si on peut réduire la hauteur d’une carte.
Sachant que la hauteur change dès que j’ajoute la ligne mushroom-card.
hello, j’entends par là, que tu vois que même sur ton exemple, dès que tu rajouter le code « mushroom-card » pour changer la couleur du nom, la hauteur de la carte augmente…
c’est justement ce phénomène que j’aimerai ne pas avoir en réajustant la hauteur de la carte
j’ai trouvé la solution.
Je post si ça peut aider quelqu’un :
square: false
type: grid
cards:
- type: custom:mushroom-entity-card
entity: light.lampadaire_outlet
use_light_color: false
icon_color: accent
tap_action:
action: toggle
fill_container: false
secondary_info: none
show_brightness_control: true
card_mod:
style:
.: |
ha-card {
{% if is_state('light.lampadaire_outlet','on') %}
border: 2.5px outset orange;
{% endif %}
background: transparent;
}
mushroom-card:
$: |
div.container {
height: 40px;
}
mushroom-state-item:
mushroom-state-info:
$: |
div.container > span {
{% if is_state('light.lampadaire_outlet','on') %}
color: orange;
{% else %}
color: white;
{% endif %}
}
- type: custom:mushroom-entity-card
entity: switch.smart_switch_2006284820749951851148e1e921d967_outlet
icon: mdi:television
tap_action:
action: toggle
fill_container: false
secondary_info: none
icon_color: accent
icon_type: icon
card_mod:
style:
.: |
ha-card {
{% if is_state('switch.smart_switch_2006284820749951851148e1e921d967_outlet','on') %}
border: 2.5px outset orange;
{% endif %}
background: transparent;
}
mushroom-card:
$: |
div.container {
height: 40px;
}
mushroom-state-item:
mushroom-state-info:
$: |
div.container > span {
{% if is_state('switch.smart_switch_2006284820749951851148e1e921d967_outlet','on') %}
color: orange;
{% else %}
color: white;
{% endif %}
}
columns: 2
Bonsoir à tous,
Voila je cherche à personnaliser au maximum mon dashboard, je souhaiterais modifier les icônes des vues. J’ai essayé de suivre ce tuto https://community.home-assistant.io/t/card-mod-super-charge-your-themes/212176/925 mais je suis perdu, je ne comprend pas bien ce qu’il faut faire. J’ai bien « Card-mod » installé et je peut modifier les couleurs ou autre sur une carte mais je n’y arrive pas concernant la vue.
Merci de votre aide
Salut, je pense avoir mal installé CardMod.
Dans HACS, il est bien listé
Mais lorsque je rajoute un bout de code :
type: custom:bar-card
title_position: inside
height: 38
card_mod: null
icon: mdi:battery
positions:
icon: inside
indicator: inside
name: inside
value: inside
show_icon: true
align: split
columns: '2'
entities:
- entity: sensor.battery_158d000103a530
name: t
- entity: sensor.battery_158d0001ad4049
name: 2
- entity: sensor.battery_158d0001ae7b18
name: 3
max: 100
unit_of_measurement: '%'
severity:
- color: '#d11e1e'
from: 0
to: 5
- color: '#cf2d11'
from: 6
to: 10
- color: '#cc3900'
from: 11
to: 15
- color: '#c84400'
from: 16
to: 20
- color: '#c44d00'
from: 21
to: 25
- color: '#bf5600'
from: 26
to: 30
- color: '#b95f00'
from: 31
to: 35
- color: '#b36600'
from: 36
to: 40
- color: '#ac6e00'
from: 41
to: 45
- color: '#a57500'
from: 46
to: 50
- color: '#9d7b00'
from: 51
to: 55
- color: '#948100'
from: 56
to: 60
- color: '#8b8700'
from: 61
to: 65
- color: '#818d00'
from: 66
to: 70
- color: '#769200'
from: 71
to: 75
- color: '#6a9700'
from: 76
to: 80
- color: '#5d9c00'
from: 81
to: 85
- color: '#4da100'
from: 86
to: 90
- color: '#39a500'
from: 91
to: 95
- color: '#15a911'
from: 96
to: 100
style: |
bar-card-currentbar, bar-card-current, bar-card-backgroundbar {
height: 5px !important;
margin-top: 30px;
}
ha-card {
background: none;
box-shadow: none;
}
ha-icon{
color: white !important;
}
bar-card-iconbar {
margin-bottom: 10px;
}
animation:
state: 'on'
speed: '2'
sort:
method: friendly_name
show_empty: false
Il ne se passe rien au niveau de l’affichage.
La partie qui l’appel dans mon fichier configuration.yaml :
# Load frontend themes from the themes folder
frontend:
extra_module_url:
- /hacsfiles/Bubble-Card/bubble-pop-up.js
- /hacsfiles/lovelace-card-mod/card-mod.js
- /hacsfiles/swiss-army-knife-card/swiss-army-knife-card.js
Hello la comu hacf,
Je cherche à display: none; tout les boutons fr more-info-card afin de garder simplement le bouton “parcourir les médias”.
Quelqu’un aurait la solution ? J’ai testé à plusieurs reprise mais même avec les tutos je sèche.
(c’est en anglais parce que j’ai envoyé ce screen sur le forum officiel mais je n’ai pas eu de réponse)
Je vous remercie d’avance pour votre aide 
bonjour
j’aurai besoin aussi d’un peu d’aide, j’ai regardé la vidéo plusieurs fois mais je n’y arrive pas. pu**** de shadow-root !
voici ma carte sur laquelle je voudrais enlever l’espace entre la zone du milieu (avec le 17.5°C) et la zone du bas avec les 3 icones, voir écrire en plus gros les 17.5.
Pour attaquer les shadow-root j’ai un peu tout tenté, mais rien ne bouge. voici mon code j’ai enlevé les accès aux shadow-root
features:
- type: target-temperature
- style: icons
preset_modes:
- none
- eco
- comfort
type: climate-preset-modes
type: tile
entity: climate.chauffage
vertical: false
show_entity_picture: true
icon_tap_action:
action: navigate
navigation_path: /dashboard-tablette/thermostat
card_mod:
style:
.: |
ha-card {
margin-top: -9px;
margin-bottom: 10px;
margin-right: -6px;
border: none;}
ha-card > div.container > div {
margin-bottom: -5px;}
ha-control-button-group { margin-top: 10px !important;}
ha-card > div.container > hui-card-features {
margin-bottom: -10px !important;
margin-top: -5px;}
Bonjour, utilises custom:button-card et tu seras moins emm… qu’avec card_mod 
Ci-dessus, une seule custom:button-card avec des custom_fields
2 « J'aime »
merci mais je suis incapable de reproduire ma carte sous forme de button-card
Poste le code complet de ta carte actuelle et je te ferais un exemple avec une custom:button-card avec ton visuel actuel si tu veuxsi tu veux.
Je suppose que les trois boutons du bas correspondent aux modes du chauffage (aucun, eco et confort) et que la température inscrite à côté d’« Eteint » en haut est la température de la pièce ?
oui c’est bien ca.
c’est une carte toute faite de type tile ! (climate)
features:
- type: target-temperature
- style: icons
preset_modes:
- none
- eco
- comfort
type: climate-preset-modes
type: tile
entity: climate.chauffage
vertical: false
show_entity_picture: true
icon_tap_action:
action: navigate
navigation_path: /dashboard-tablette/thermostat
card_mod:
style:
ha-card:
div.container:
hui-card-features:
$:
Les boutons du bas (none, eco, comfort) sont clickables et changent le mode ? Le plus (+) et le moins (-) à gauche et à droite de la température (17,5 °C) sont clickables aussi et changent la température cible ? L’icône « thermostat » à gauche de Chauffage est-elle elle aussi clickable ?
C’est quand tu cliques dessus que tu ouvres un autre tableau de bord (navigation_path: /dashboard-tablette/thermostat) ?
Je ne me sers que de custom:button-card (sauf quelques autres cartes custom) donc je ne connais pas le fonctionnement de cette carte « tile »