yosef
March 27, 2022, 7:53pm
231
Beautiful Cards. I’m updating my dashboard with these. Beginning with the covers card, as I’ve never been satisfied with other options.
I’d like to change the color of the icon from blue to #aa3251 . For some reason it’s not working.
type: custom:mushroom-cover-card
entity: cover.blinds_office_west
color: null
show_buttons_control: true
show_position_control: true
icon: phu:blind-tilt-closed
and receive an error
Visual editor is not supported for this configuration:
* At path: color -- Expected a value of type `never`, but received: `null`
You can still edit your config in YAML.
Do I need to edit the YAML in the raw configuration editor?
piitaya
March 27, 2022, 8:17pm
232
For now, you can only use the color option for entity-card, template-card, entity-chip and template-chip.GitHub - piitaya/lovelace-mushroom-themes: Additional themes for Lovelace Mushroom Cards 🍄
mush-rgb-state-cover: 170, 50, 81 (#aa3251 color in rgb)
yosef
March 27, 2022, 8:56pm
233
Thanks. I’m using another theme for the Dashboard. How do I add the Mushroom theme while still keeping my overall theme “Caule Black Rose”
piitaya
March 27, 2022, 9:29pm
234
Just add mushroom variables in your current theme
yosef
March 28, 2022, 6:24am
235
Thanks.
I added this to the Caule-themes-pack-1.yaml and restarted HA. The icon is still blue.
Mushroom:
# Mushroom
mush-rgb-state-cover: 170, 50, 81
poudenes
March 28, 2022, 6:50am
236
I love the mushroom cards!!! Hope the FAN card will also get a off, low, mid, high option. See FAN intergration HA for right speed names
r1kkie
March 28, 2022, 6:52am
237
Just migrated from custom:button-card, amazing cards!
piitaya
March 28, 2022, 8:20am
238
Just add this line a the end of your theme
Caule Dark Gray:
# Change the value below 8px to 0px to remove the rounded corners
ha-card-border-radius: 8px
# Main colors
# ...
# Mushroom variables
mush-rgb-state-cover: 170, 50, 81
1 Like
yosef
March 28, 2022, 9:59am
239
I added at end of theme
# Mushroom variables
mush-rgb-state-cover: 170, 50, 81
Caule Dark Gray:
# Change the value below 8px to 0px to remove the rounded corners
ha-card-border-radius: 8px
# Main colors
primary-color: "#acacac"
light-primary-color: "#e2e2e2"
graph-color: var(--primary-color)
primary-background-color: "#1D1B1E"
secondary-background-color: var(--primary-background-color)
divider-color: "#37373D"
disabled-color: "#666666"
# Text colors
primary-text-color: "#e5e5e5"
secondary-text-color: var(--disabled-color)
text-primary-color: "#E5E5E5"
disabled-text-color: var(--disabled-color)
# Sidebar colors
sidebar-icon-color: var(--primary-color)
sidebar-text-color: var(--primary-text-color)
sidebar-selected-background-color: var(--primary-background-color)
sidebar-selected-icon-color: var(--light-primary-color)
sidebar-selected-text-color: var(--sidebar-selected-icon-color)
# Icons colors
state-icon-color: var(--disabled-color)
state-icon-active-color: var(--primary-color)
state-icon-unavailable-color: var(--primary-background-color)
# Settins and colors of Mini Media Player
mini-media-player-icon-color: var(--primary-color)
mini-media-player-accent-color: var(--primary-color)
mini-media-player-progress-height: 8px
# Papers slider colors
paper-slider-knob-color: var(--primary-color)
paper-slider-knob-start-color: var(--paper-slider-knob-color)
paper-slider-pin-color: var(--paper-slider-knob-color)
paper-slider-active-color: var(--paper-slider-knob-color)
paper-slider-container-color: var(--disabled-color)
# Labels colors
label-badge-background-color: var(--divider-color)
label-badge-text-color: var(--primary-text-color)
label-badge-red: var(--primary-color)
label-badge-blue: var(--light-primary-color)
# Cards colors
ha-card-background: "#2A282D"
paper-card-background-color: var(--ha-card-background)
paper-listbox-background-color: var(--primary-background-color)
# Toggle button colors
paper-toggle-button-checked-button-color: var(--primary-color)
paper-toggle-button-checked-bar-color: var(--light-primary-color)
paper-toggle-button-unchecked-button-color: var(--disabled-color)
paper-toggle-button-unchecked-bar-color: var(--primary-background-color)
# Switch colors
switch-checked-color: var(--paper-toggle-button-checked-button-color)
switch-unchecked-button-color: var(--paper-toggle-button-unchecked-button-color)
switch-unchecked-color: var(--paper-toggle-button-unchecked-bar-color)
switch-unchecked-track-color: var(--paper-toggle-button-unchecked-bar-color)
# Table colors
table-row-background-color: var(--divider-color)
table-row-alternative-background-color: var(--secondary-background-color)
card-background-color: var(--primary-background-color)
#Animated icons
weather-icon-clear-night: url("/hacsfiles/themes/caule-themes-pack-1/clear-night.svg")
weather-icon-cloudy: url("/hacsfiles/themes/caule-themes-pack-1/cloudy.svg")
weather-icon-fog: url("/hacsfiles/themes/caule-themes-pack-1/fog.svg")
weather-icon-lightning: url("/hacsfiles/themes/caule-themes-pack-1/lightning.svg")
weather-icon-lightning-rainy: url("/hacsfiles/themes/caule-themes-pack-1/lightning-rainy.svg")
weather-icon-partlycloudy: url("/hacsfiles/themes/caule-themes-pack-1/partlycloudy.svg")
weather-icon-pouring: url("/hacsfiles/themes/caule-themes-pack-1/pouring.svg")
weather-icon-rainy: url("/hacsfiles/themes/caule-themes-pack-1/rainy.svg")
weather-icon-hail: url("/hacsfiles/themes/caule-themes-pack-1/hail.svg")
weather-icon-snowy: url("/hacsfiles/themes/caule-themes-pack-1/snowy.svg")
weather-icon-snowy-rainy: url("/hacsfiles/themes/caule-themes-pack-1/snowy-rainy.svg")
weather-icon-sunny: url("/hacsfiles/themes/caule-themes-pack-1/sunny.svg")
weather-icon-windy: url("/hacsfiles/themes/caule-themes-pack-1/windy.svg")
weather-icon-windy-variant: url("/hacsfiles/themes/caule-themes-pack-1/windy-variant.svg")
weather-icon-exceptional: url("/hacsfiles/themes/caule-themes-pack-1/exceptional.svg")
# Shadown
ha-card-box-shadow: "inset 0px 0px 0px 0px var(--divider-color)"
# HACS
hacs-badge-color: var(--primary-color)
link-text-color: var(--disabled-color)
markdown-code-background-color: var(--divider-color)
google-blue-500: var(--primary-color)
accent-color: var(--light-primary-color)
hacs-chip-color: var(--primary-color)
# Mushroom variables
mush-rgb-state-cover: 170, 50, 81
I’m looking for a way to make a mushroom chip (open sidebar menu) only display on mobile devices. Is there an easy way to achieve this?
poudenes
March 28, 2022, 11:28am
241
Hi All,
Is it possible to change color icon based on state:
type: custom:mushroom-chips-card
chips:
- type: entity
entity: binary_sensor.diningroom_detection
content_info: name
What use the chips for my motion sensors but they not change color as default
6 Likes
Saw the Youtube video on this… this is amazing!!!
bowhunt24
March 28, 2022, 8:23pm
245
Hi all! Love the mushroom cards! I had a couple questions hoping you smarter folks can help me with
Can you theme just the mushroom cards (much like you can do with the oob light card) so you can use a different theme at the view level?
Thanks!
Hey is there any way I can change the text alignment for the title card?
piitaya
March 29, 2022, 4:05pm
249
How can you set 2 cards in a one card panel ? The purpose of the panel view (1 card) is to have only one card.
Is there a way to use the custom light card (with colors and temp) on a group of lights? Manually changing the entity to “group.” kind of works, but it removes the color/temp controls.
