Bonjour,
J’ai créé une button-card
J’arrive à réduire les composant sauf la partie de la « boite » inutilisée. (partie à droite du bouton)
Désolé pour les termes mais je suis novice
Merci
System Information
version |
core-2025.1.0 |
installation_type |
Home Assistant OS |
dev |
false |
hassio |
true |
docker |
true |
user |
root |
virtualenv |
false |
python_version |
3.13.1 |
os_name |
Linux |
os_version |
6.6.66-haos |
arch |
x86_64 |
timezone |
Europe/Paris |
config_dir |
/config |
Home Assistant Community Store
GitHub API |
ok |
GitHub Content |
ok |
GitHub Web |
ok |
HACS Data |
ok |
GitHub API Calls Remaining |
4995 |
Installed Version |
2.0.1 |
Stage |
running |
Available Repositories |
1493 |
Downloaded Repositories |
23 |
Home Assistant Cloud
logged_in |
true |
subscription_expiration |
11 janvier 2025 à 01:00 |
relayer_connected |
true |
relayer_region |
eu-central-1 |
remote_enabled |
true |
remote_connected |
true |
alexa_enabled |
true |
google_enabled |
true |
cloud_ice_servers_enabled |
true |
remote_server |
eu-central-1-24.ui.nabu.casa |
certificate_status |
ready |
instance_id |
7b656fa8baa44587b1e309ed7bed80f5 |
can_reach_cert_server |
ok |
can_reach_cloud_auth |
ok |
can_reach_cloud |
ok |
Home Assistant Supervisor
host_os |
Home Assistant OS 14.1 |
update_channel |
stable |
supervisor_version |
supervisor-2024.12.3 |
agent_version |
1.6.0 |
docker_version |
27.2.0 |
disk_total |
30.8 GB |
disk_used |
15.1 GB |
healthy |
true |
supported |
true |
host_connectivity |
true |
supervisor_connectivity |
true |
ntp_synchronized |
true |
virtualization |
oracle |
board |
ova |
supervisor_api |
ok |
version_api |
ok |
installed_addons |
Matter Server (7.0.0), Mosquitto broker (6.4.1), Zigbee2MQTT (2.0.0-1), ZeroTier One (0.19.0), Studio Code Server (5.18.0), SomfyProtect2MQTT (2025.1.0), Rclone Backup (3.3.3), Get HACS (1.3.1), Node-RED (18.1.1), ESPHome Device Builder (2024.12.2), File editor (5.8.0), go2rtc (1.9.8), Frigate (0.14.1), MQTT IO (0.4.0) |
Dashboards
dashboards |
4 |
resources |
13 |
views |
9 |
mode |
storage |
Recorder
oldest_recorder_run |
23 décembre 2024 à 23:30 |
current_recorder_run |
4 janvier 2025 à 12:54 |
estimated_db_size |
103.77 MiB |
database_engine |
sqlite |
database_version |
3.47.1 |
Bonjour,
tu pourrais mettre le code de la carte, pour qu’on puisse mieux t’aider.
désolé
show_name: true
show_icon: true
entity: switch.olivier_prise_1
icon: mdi:tree
name: Olivier
type: custom:button-card
show_state: false
state:
- value: "on"
name: ""
color: green
- value: "off"
name: ""
color: green
styles:
card:
- height: 105px
- width: 130px
- box-shadow: |
[[[
if (states['switch.olivier_prise_1'].state == "on") return "0px 0px 0px 2px red";
else return "0px 0px 0px 2px black";
]]]
- background-color: |
[[[
if (states['switch.olivier_prise_1'].state == "on") return "yellow";
else return "white";
]]]
icon:
- left: 30%
- top: 10%
tap_action:
action: toggle
ha_card:
- height: 105px
- null
Aucun soucis. C’est que tu es en mode édition 
fait terminer en haut de la page

Et c’est bon.
Oui, oui je connais cela, mais je voulais pouvoir mettre un ou deux autres boutons à coté

J’ai fait un montage pour imager
utilise la carte grille ou horizontal
ou
tu fait ajouter une carte manuelm et colle ton code du button-card
exemple avec horizontal-stack:
type: horizontal-stack
cards:
- show_name: true
show_icon: true
entity: switch.0x50325ffffe304677
icon: mdi:tree
name: Olivier
type: custom:button-card
show_state: false
state:
- value: "on"
name: ""
color: green
- value: "off"
name: ""
color: green
styles:
card:
- height: 105px
- width: 130px
- box-shadow: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "0px 0px 0px 2px red";
else return "0px 0px 0px 2px black";
]]]
- background-color: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "yellow";
else return "white";
]]]
icon:
- left: 30%
- top: 10%
tap_action:
action: toggle
ha_card:
- height: 105px
- null
- show_name: true
show_icon: true
entity: switch.0x50325ffffe304677
icon: mdi:tree
name: Olivier
type: custom:button-card
show_state: false
state:
- value: "on"
name: ""
color: green
- value: "off"
name: ""
color: green
styles:
card:
- height: 105px
- width: 130px
- box-shadow: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "0px 0px 0px 2px red";
else return "0px 0px 0px 2px black";
]]]
- background-color: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "yellow";
else return "white";
]]]
icon:
- left: 30%
- top: 10%
tap_action:
action: toggle
ha_card:
- height: 105px
- null
- show_name: true
show_icon: true
entity: switch.0x50325ffffe304677
icon: mdi:tree
name: Olivier
type: custom:button-card
show_state: false
state:
- value: "on"
name: ""
color: green
- value: "off"
name: ""
color: green
styles:
card:
- height: 105px
- width: 130px
- box-shadow: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "0px 0px 0px 2px red";
else return "0px 0px 0px 2px black";
]]]
- background-color: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "yellow";
else return "white";
]]]
icon:
- left: 30%
- top: 10%
tap_action:
action: toggle
ha_card:
- height: 105px
- null
exemple avec grille:
square: false
type: grid
cards:
- show_name: true
show_icon: true
entity: switch.0x50325ffffe304677
icon: mdi:tree
name: Olivier
type: custom:button-card
show_state: false
state:
- value: "on"
name: ""
color: green
- value: "off"
name: ""
color: green
styles:
card:
- height: 105px
- width: 130px
- box-shadow: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "0px 0px 0px 2px red";
else return "0px 0px 0px 2px black";
]]]
- background-color: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "yellow";
else return "white";
]]]
icon:
- left: 30%
- top: 10%
tap_action:
action: toggle
ha_card:
- height: 105px
- null
- show_name: true
show_icon: true
entity: switch.0x50325ffffe304677
icon: mdi:tree
name: Olivier
type: custom:button-card
show_state: false
state:
- value: "on"
name: ""
color: green
- value: "off"
name: ""
color: green
styles:
card:
- height: 105px
- width: 130px
- box-shadow: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "0px 0px 0px 2px red";
else return "0px 0px 0px 2px black";
]]]
- background-color: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "yellow";
else return "white";
]]]
icon:
- left: 30%
- top: 10%
tap_action:
action: toggle
ha_card:
- height: 105px
- null
- show_name: true
show_icon: true
entity: switch.0x50325ffffe304677
icon: mdi:tree
name: Olivier
type: custom:button-card
show_state: false
state:
- value: "on"
name: ""
color: green
- value: "off"
name: ""
color: green
styles:
card:
- height: 105px
- width: 130px
- box-shadow: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "0px 0px 0px 2px red";
else return "0px 0px 0px 2px black";
]]]
- background-color: |
[[[
if (states['switch.0x50325ffffe304677'].state == "on") return "yellow";
else return "white";
]]]
icon:
- left: 30%
- top: 10%
tap_action:
action: toggle
ha_card:
- height: 105px
- null
columns: 3
2 « J'aime »
C’est tout à fait ça !
Un grand merci pour ton aide
Bonne soirée
1 « J'aime »
Si c’est bon pour toi, passe ton sujet en résolu en cochant la case solution (
) sur le message qui te l’apporte.