Can you try this solution from the Mushroom thread? Changing the position from sticky or -webkit-sticky to fixed: Mushroom Cards - Build a beautiful dashboard easily đ (Part 2) - #811 by LiQuid_cOOled
too bad, that is not working for me
Can you post your menu card code so we can see whatâs preventing the code from working?
Great work! Would you be kind enough to share your entire yaml code? I want to create exactly the same view and would be an amazing not to start from zero.
Much appreciated this fixed the Menu for me!
Does anyone has a fix for the blank page when you open the dashboard. I have a workaround, but would like to have it fixed. The work aroudn for me is to click on edit dash board - rawconfig-editor and close it again.
Not sure how i can fix this.
Hi, @ArenaCloser . Are you still using Frog weather background? Mine is stop working after last HA update and 2 sensors is shows unavailable. I try to find a solution, but no luck so far. Any idea what to do? Thank you
1 Like
I have the same problem and I really miss my weather frog! 
1 Like
Hey @Zenia and @iPilla ! I may have a solution for you.
While setting up my dashboard inspired by @ArenaCloser I decided to have the pictures locally stored on my maschine.
I downloaded all weatherfrog images from github (Google-Weather-Frog/images/wide at master ¡ Senexis/Google-Weather-Frog ¡ GitHub) and slightly changed the code for the weather Frog Image.
I downloaded the pictures to my HA-Maschine (/www/froggy/*) and then changed the last line of the code to:
{{ '/local/froggy/' + dict[weather_status][frog_location] | default(other_location) }}
Now I donât rely on downloading an image from gitup everytime the location or status changes.
Maybe this helps you guys with your problems as well.
2 Likes
Thank you. I will try to follow your suggestion tonight, when I will come from work. Will report as soon as I will try. TY
Edit: Did you upload all pictures or just a square or wide?
Just the wide
1 Like
To add, check if you use the following state "{% set rain = states(âsensor.buienalarm_precipitationâ) | float %} " sensor.buienalarm_precipitation does not excist anymore, you should use sensor.openweathermap_rain.
@Bonzenpaule nice, works great.
3 Likes
Sorry for stupid question, but I confuse , what to change in my code?
card_mod:
style: |
ha-card {
height: 20em !important;
background: linear-gradient(to top, transparent, rgba(var(--frog-rgb-{{states('sensor.weather_frog_status')}})) 10%), url({{states('sensor.weather_frog_image_wide')}});
background-size: cover, 200% auto;
background-position: bottom left {% if is_state("sensor.weather_frog_location", "field") %}20%{% elif is_state("sensor.weather_frog_location", "hills") %}40%{% else %}10%{% endif %};
background-repeat: no-repeat;
background-blend-mode: saturation;
font-size: 10px;
}
Thank you
Itâs not a stupid question since I didnât explain it very well.
This code should stay the same but you have to change the last line for your sensor âsensor.weather_frog_image_wideâ
I think itâs in your configuration.yaml if you rebuild arenaclosers theme. Look at the screenshot. I marked the line you have to change.
I went a different route while building my dashboard and used helpers to create the sensors. But itâs essentially the same code. I can try to write my way up if you canât fix the code by yourself.
Yes, now I remember where I did this ( templates)
I changed, but sensors still shows unavailable , even after HA restart
#################Weather Frog Sensors################
- name: "Weather frog status"
unique_id: ae7a82e0-0667-4e76-a96f-f0e5073a9b58
state: >-
{% set entity = states("sensor.openweathermap_condition") %}
{% set cloud = states("sensor.openweathermap_cloud_coverage")|int %}
{% set rain = states("sensor.openweathermap_forecast_rain")|float %}
{% if entity == "fog" %}
fog
{% elif entity == "hail" %}
hail
{% elif entity == "lightning" or entity == "lightning-rainy" or entity == "exceptional" %}
lightning
{% elif entity == "snowy" or entity == "snowy-rainy" %}
snowy
{% elif rain > 0 and rain <= 0.8 %}
drizzle
{% elif rain > 0.8 %}
rainy
{% elif states("sun.sun") == "below_horizon" %}
{% if cloud < 20 %}
clear
{% elif cloud < 40 %}
mostly-clear
{% elif cloud < 60 %}
partly-cloudy-night
{% elif cloud < 80 %}
mostly-cloudy-night
{% else %}
cloudy
{% endif %} {% else %}
{% if cloud < 20 %}
sunny
{% elif cloud < 40 %}
mostly-sunny
{% elif cloud < 60 %}
partly-cloudy-day
{% elif cloud < 80 %}
mostly-cloudy-day
{% else %}
cloudy
{% endif %} {% endif %}
icon: mdi:weather-partly-cloudy
- name: "Weather frog image wide"
unique_id: 27887eb5-afaa-4847-9852-3e27074c381d
state: >
{% set weather_status = states("sensor.weather_frog_status") %}
{% set frog_location = states("sensor.weather_frog_location") %}
{% set dict = {'sunny': {'beach':['01-sunny-beach-reading.png','01-sunny-beach-sandcastle.png','01-sunny-beach-sunscreen.png']|random(), 'city':['01-sunny-citypark-sunbathing.png','01-sunny-rooftop-pinacolada.png']|random(), 'creek':'01-sunny-creek-swimming.png', 'field':'01-sunny-field-kite.png', 'hills':'01-sunny-hills-sunbathing.png', 'home':'01-sunny-home-laundry.png', 'orchard':'01-sunny-orchard-picking.png'},
'mostly-sunny': {'beach':['02-mostly-sunny-beach-reading.png','02-mostly-sunny-beach-sandcastle.png','02-mostly-sunny-beach-sunscreen.png']|random(), 'city':['02-mostly-sunny-citypark-picnic.png','02-mostly-sunny-rooftop-pinacolada.png']|random(), 'creek':'02-mostly-sunny-creek-swimming.png', 'field':'02-mostly-sunny-field-kite.png', 'hills':'02-mostly-sunny-hills-sunbathing.png', 'home':'02-mostly-sunny-home-laundry.png', 'orchard':'02-mostly-sunny-orchard-picking.png'},
'partly-cloudy-day': {'beach':'03-partly-cloudy-day-beach-shells.png', 'city':'03-partly-cloudy-day-citypark-ukelele.png', 'creek':'03-partly-cloudy-day-creek-feet.png', 'field':['03-partly-cloudy-day-field-biking.png','03-partly-cloudy-day-field-hiking.png']|random(), 'hills':['03-partly-cloudy-day-hills-painting.png','03-partly-cloudy-day-hills-reading.png']|random(), 'home':'03-partly-cloudy-day-home-flowers.png', 'orchard':['03-partly-cloudy-day-orchard-butterflies.png','03-partly-cloudy-day-orchard-treeswing.png']|random()},
'mostly-cloudy-day': {'beach':'04-mostly-cloudy-day-beach-shells.png', 'city':'04-mostly-cloudy-day-citypark-ukelele.png', 'creek':'04-mostly-cloudy-day-creek-feet.png', 'field':['04-mostly-cloudy-day-field-biking.png','04-mostly-cloudy-day-field-hiking.png']|random(), 'hills':['04-mostly-cloudy-day-hills-painting.png','04-mostly-cloudy-day-hills-reading.png']|random(), 'home':'04-mostly-cloudy-day-home-flowers.png', 'orchard':['04-mostly-cloudy-day-orchard-butterflies.png','04-mostly-cloudy-day-orchard-treeswing.png']|random()},
'clear': {'city':'05-clear-home-lounging.png', 'creek':'05-clear-creek-stars.png', 'field':'05-clear-field-lanterns.png', 'hills':['05-clear-hills-camping.png','05-clear-hills-telescope.png']|random(), 'home':'05-clear-home-lounging.png', 'orchard':'05-clear-orchard-fireflies.png'},
'mostly-clear': {'city':'06-mostly-clear-home-lounging.png', 'creek':'06-mostly-clear-creek-stars.png', 'field':'06-mostly-clear-field-lanterns.png', 'hills':['06-mostly-clear-hills-camping.png','06-mostly-clear-hills-telescope.png']|random(), 'home':'06-mostly-clear-home-lounging.png', 'orchard':'06-mostly-clear-orchard-fireflies.png'},
'partly-cloudy-night': {'city':'07-partly-cloudy-night-home-inside.png', 'creek':'07-partly-cloudy-night-creek-fireflies.png', 'field':'07-partly-cloudy-night-field-fireflies.png', 'hills':'07-partly-cloudy-night-hills-smores.png', 'home':'07-partly-cloudy-night-home-inside.png', 'orchard':'07-partly-cloudy-night-orchard-eating.png'},
'mostly-cloudy-night': {'city':'08-mostly-cloudy-night-home-inside.png', 'creek':'08-mostly-cloudy-night-creek-fireflies.png', 'field':'08-mostly-cloudy-night-field-fireflies.png', 'hills':'08-mostly-cloudy-night-hills-smores.png', 'home':'08-mostly-cloudy-night-home-inside.png', 'orchard':'08-mostly-cloudy-night-orchard-eating.png'},
'cloudy': {'city':'26-haze-fog-dust-smoke-fruit-stand.png', 'creek':'26-haze-fog-dust-smoke-bridge.png', 'field':'26-haze-fog-dust-smoke-mountain.png', 'hills':'09-cloudy-hills-coffee.png', 'home':'09-cloudy-home-flowers.png', 'orchard':'09-cloudy-orchard-watching.png'},
'drizzle': {'city':'10-drizzle-home-laundry.png', 'creek':'10-drizzle-creek-leaf.png', 'field':'10-drizzle-field-leaf.png', 'hills':'10-drizzle-hills-umbrella.png', 'home':'10-drizzle-home-laundry.png', 'orchard':'10-drizzle-orchard-reading.png'},
'rainy': {'city':'12-heavy-rain-busstop-umbrella.png', 'creek':['11-rain-creek-leaf.png','12-heavy-rain-creek-leaf.png']|random(), 'field':'', 'hills':'11-rain-hills-umbrella.png', 'home':['11-rain-home-inside.png','11-rain-home-laundry.png']|random(), 'orchard':['11-rain-home-inside.png','11-rain-home-laundry.png']|random()},
'snowy': {'city':['13-flurries-citypark-snowman.png','15-snow-showers-snow-citypark-snowman.png','20-rain-snow-wintry-mix-citypark-snowman.png']|random(), 'creek':['13-flurries-creek-iceskating.png','15-snow-showers-snow-creek-iceskating.png']|random(), 'field':'16-blowing-snow-field-snowman.png', 'home':'15-snow-showers-snow-home-shoveling.png'},
'snow-storm': {'home':['17-heavy-snow-blizzard-home-inside.png','17-heavy-snow-blizzard-home-shoveling.png']|random(), 'field':'16-blowing-snow-field-snowman.png'},
'hail': {'city':['19-mixed-rain-hail-rain-sleet-busstop-waiting.png','19-mixed-rain-hail-rain-sleet-cafe-entering.png']|random()},
'lightning': {'city':'22-iso-thunderstorm-cafe-looking-outside.png', 'home':['22-iso-thunderstorms-home-inside.png','24-strong-thunderstorms-home-inside.png']|random()},
'fog': {'city':['26-haze-fog-dust-smoke-busstop-waiting.png','26-haze-fog-dust-smoke-fruit-stand.png','26-haze-fog-dust-smoke-pier.png']|random(), 'creek':'26-haze-fog-dust-smoke-bridge.png', 'field':'26-haze-fog-dust-smoke-field-lantern.png', 'hills':'26-haze-fog-dust-smoke-hills-cocoa.png', 'home':'26-haze-fog-dust-smoke-rooftop.png', 'orchard':'26-haze-fog-dust-smoke-mountain.png'}} %}
{% if weather_status == "snowy" %}
{% set other_location = ['13-flurries-citypark-snowman.png', '15-snow-showers-snow-citypark-snowman.png', '20-rain-snow-wintry-mix-citypark-snowman.png', '13-flurries-creek-iceskating.png', '15-snow-showers-snow-creek-iceskating.png', '16-blowing-snow-field-snowman.png', '15-snow-showers-snow-home-shoveling.png'] | random() %}
{% elif weather_status == "snow-storm" %}
{% set other_location = ['17-heavy-snow-blizzard-home-inside.png', '17-heavy-snow-blizzard-home-shoveling.png', '16-blowing-snow-field-snowman.png'] | random() %}
{% elif weather_status == "lightning" %}
{% set other_location = ['22-iso-thunderstorm-cafe-looking-outside.png', '22-iso-thunderstorms-home-inside.png', '24-strong-thunderstorms-home-inside.png'] | random() %}
{% elif weather_status == "hail" %}
{% set other_location = ['19-mixed-rain-hail-rain-sleet-busstop-waiting.png','19-mixed-rain-hail-rain-sleet-cafe-entering.png'] | random() %}
{% endif %}
{{ '/local/froggy/' + dict[weather_status][frog_location] | default(other_location) }}
icon: mdi:image
###############################################################################################################################################################################################
#####################################################################################################################################
#########################TRIGERS##################################################
#######Weather Frog Trigger#############
- trigger:
- platform: time
at: 04:00:00
sensor:
- name: "Weather frog location"
state: '{{ ["city", "creek", "field", "hills", "home", "orchard"] | random()}}' # ToDo: add "beach" location in summer time
icon: mdi:map-marker
unique_id: 0945366b-d5fd-45b3-a561-a87877349194
Mhhh itâs difficult to debug this error since I donât have a error code or message. Whatâs your weather service? Did you notice the change for precipitation like @jeroenmetus said? Maybe thatâs what is missing for you?
What are the states of your other template sensors?
-weather frog status
Status- unavailable
location- creek (available)
If you donât mind, please share your .yaml code for status and image templates.
TY
I think the problem lies within the sensor for the âstatusâ. Probably for the rain / precipitation.
Maybe itâs because the state of your rain sensor is "0 mm/h? But Iâm not sure. Iâm not an expert.
Here is my rain sensor (sorry for the screenshot, canât copy and paste on the phone)
It updates my sensor for precipitation every 10 minutes and gets the forecast for the precipitation for the next hour. Itâs not perfect but the only way to get precipitation with my weather integration.
I would check every sensor and every line of those templates. Thatâs how I learned a bit about everything. Maybe you can find the problem.
1 Like