Hi Rene - I’ll be getting back to HADashboard soon - busy with your requested additions to AppDaemon at the moment 
(A clean way to shutdown the threaded app, plus I am adding dependency checking so you can get auto reloads of anything that depends on your sound app)
Yo dawg! I heard you liked panels, etc
Sorry to dig up this ancient thread but your setup is sweet. could you share your dash for the RGB color picker please? Which widget is that?
Are you loading separate dashboards with the options at the bottom? or are they staying on the same page and changing the widgets? Also, what code are you using the for reload widget? and is it reloading HADasboard or HA itself?
Version 1 of my home dashboard, currently running on an ipad2. An awful lot of proprietary CSS, still want to do some more work on the media player and find space for some security camera feeds, but feeling good about 1.0.
Thanks for Home Assistant and HADashboard, it’s freakin incredible.
You mind sharing the code, interested in the weather forecast solution
You mind sharing the code, interested in the weather forecast solution
Not at all. Should probably add to github, but just to share quickly here…
The Dark Sky code was mostly taken, slightly adapted, from an active thread on this forum, sorry I’m not giving credit very well:
sensor:
- platform: darksky
api_key: !secret darksky_key
forecast:
- 1
- 2
- 3
- 4
- 5
- 6
monitored_conditions:
- precip_probability
- icon
- temperature_min
- temperature_max
- temperature
- platform: season
- platform: template
sensors:
forecast_0:
friendly_name: Today
value_template: >
{{states.sensor.dark_sky_daily_high_temperature.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_1:
friendly_name: Tomorrow
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_1.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_1.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_1", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_1", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_1", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_1", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_1", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_1", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_1", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_1", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_1", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_1", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_2:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (2 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_2.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_2.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_2", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_2", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_2", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_2", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_2", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_2", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_2", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_2", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_2", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_2", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_3:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (3 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_3.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_3.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_3", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_3", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_3", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_3", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_3", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_3", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_3", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_3", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_3", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_3", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_4:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (4 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_4.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_4.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_4", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_4", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_4", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_4", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_4", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_4", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_4", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_4", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_4", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_4", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_5:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (5 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_5.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_5.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_5", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_5", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_5", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_5", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_5", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_5", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_5", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_5", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_5", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_5", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
forecast_6:
friendly_name_template: >
{%- set date = as_timestamp(now()) + (6 * 86400 ) -%}
{{ date | timestamp_custom("%A") }}
value_template: >
{{states.sensor.dark_sky_daily_high_temperature_6.state|round(0)}}°/{{states.sensor.dark_sky_daily_low_temperature_6.state|round(0)}}°
icon_template: >-
{% if is_state("sensor.dark_sky_icon_6", "clear-day") %}
mdi:weather-sunny
{% elif is_state("sensor.dark_sky_icon_6", "clear-night") %}
mdi:weather-night
{% elif is_state("sensor.dark_sky_icon_6", "cloudy") %}
mdi:weather-cloudy
{% elif is_state("sensor.dark_sky_icon_6", "rain") %}
mdi:weather-pouring
{% elif is_state("sensor.dark_sky_icon_6", "sleet") %}
mdi:weather-snowy-rain
{% elif is_state("sensor.dark_sky_icon_6", "snow") %}
mdi:weather-snowy
{% elif is_state("sensor.dark_sky_icon_6", "wind") %}
mdi:weather-windy
{% elif is_state("sensor.dark_sky_icon_6", "fog") %}
mdi:weather-fog
{% elif is_state("sensor.dark_sky_icon_6", "partly-cloudy-day") %}
mdi:weather-partlycloudy
{% elif is_state("sensor.dark_sky_icon_6", "partly-cloudy-night") %}
mdi:weather-partlycloudy
{% else %}
error
{% endif %}
Then I created a new widget I called day_forecast
base_day_forecast.js
function base_day_forecast(widget_id, url, skin, parameters)
{
self = this;
self.widget_id = widget_id;
self.parameters = parameters;
if ("monitored_entity" in self.parameters)
{
entity = self.parameters.monitored_entity
}
else
{
entity = self.parameters.entity
}
var callbacks = [];
self.OnStateAvailable = OnStateAvailable;
self.OnStateUpdate = OnStateUpdate;
var monitored_entities =
[
{"entity": parameters.entity, "initial": self.OnStateAvailable, "update": self.OnStateUpdate}
];
WidgetBase.call(self, widget_id, url, skin, parameters, monitored_entities, callbacks)
function OnStateAvailable(self, state)
{
set_view(self,state);
}
function OnStateUpdate(self, state)
{
set_view(self,state);
}
function set_view(self,state){
self.icon = 'mdi ' + state.attributes.icon.replace(':','-');
self.title = state.attributes.friendly_name;
self.value = state.state;
self.set_field(self, "icon", self.icon)
self.set_field(self, "value", self.value)
self.set_field(self, "title", self.title)
}
}
base_day_forecast.html
<h1 class="title left-title" data-bind="text: title"></h1>
<h2 class="iconcontainer icon right-icon" data-bind="attr:{style: icon_style}"><i data-bind="attr: {class: icon}"></i></h2>
<div class="valueunit" style=""><h2 class="value left-value" data-bind="html: value" style="color: #fff;font-size: 100%;"></h2></div>
base_day_forecast.css
.widget-base_day_forecast-{{id}} {
position: relative;
}
.widget-base_day_forecast-{{id}} .title {
position: absolute;
top: 5px;
width: 100%;
}
.widget-base_day_forecast-{{id}} .title2 {
position: absolute;
top: 23px;
width: 100%;
}
.widget-base_day_forecast-{{id}} .iconcontainer.icon {
position: absolute;
bottom: 25%;
width: 100%;
}
h1.title.left-title{
text-align:left;
box-sizing:border-box;
padding-left: 15px;
top: 17px;
}
h2.value.left-value{
box-sizing: border-box;
padding-left: 15px;
font-size: 175% !important;
top: 35px !important;
bottom: auto;
position: absolute;
left: 0;
}
.icon.right-icon{
text-align:right;
padding-right:15px;
box-sizing:border-box;
}
day_forecast.yaml
widget_type: base_day_forecast
entity: {{entity}}
fields:
title: ""
value: ""
icon: ""
icon_style: $style_inactive
static_css:
title_style: $style_title
widget_style: $background_style
css:
icon_style_active: $style_active
icon_style_inactive: $style_inactive
dashboard.dash
forecast_0:
widget_type: day_forecast
entity: sensor.forecast_0
forecast_1:
widget_type: day_forecast
entity: sensor.forecast_1
forecast_2:
widget_type: day_forecast
entity: sensor.forecast_2
forecast_3:
widget_type: day_forecast
entity: sensor.forecast_3
forecast_4:
widget_type: day_forecast
entity: sensor.forecast_4
forecast_5:
widget_type: day_forecast
entity: sensor.forecast_5
forecast_6:
widget_type: day_forecast
entity: sensor.forecast_6Should the following files placed in the /config/appdaemon/widgets directory?
if you want to create a custom widget it needs to go in the directory custom_widgets
i suspect you run hassio and if i am correct then the files need to be placed like this:
/config/appdaemon/custom_widgets/base_day_forecast/base_day_forecast.css
/config/appdaemon/custom_widgets/base_day_forecast/base_day_forecast.html
/config/appdaemon/custom_widgets/base_day_forecast/base_day_forecast.js
/config/appdaemon/custom_widgets/day_forecast.yaml
Hi,
very nice, I like the light widget and its controls, would mind sharing this as well please ?
The light widget is @ReneTode’s light_with_brightness: https://github.com/ReneTode/My-AppDaemon/tree/master/custom_widgets
Edit: If you’re talking about the three small icons beneath the main lights, which are scene selects for party/relax/bright modes, those are separate widgets, so its one large light_with_brightness (6x6) and three small switch widgets (2x2) beneath it.
I did modify the css to get it to look the way it does. And, I doubt hacking the css within a custom widget is the recommended way to do things, but here’s what my base_light_with_brightness.css looks like, you’ll likely want to change some colors as I have some hard coded in here.
.widget-base_light_with_brightness-{{id}} {
position: relative;
}
.widget-base_light_with_brightness-{{id}} .title {
position: absolute;
top: 5px;
width: 100%;
}
.widget-base_light_with_brightness-{{id}} .iconcontainer.icon {
margin-top: -10px;
}
.widget-base_light_with_brightness-{{id}} .toggle-area {
z-index: 10;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.widget-base_light_with_brightness-{{id}} .slidercontainer {
position: absolute;
bottom: 6px;
height: 18px;
overflow: hidden;
padding-left: 6px;
padding-right: 6px;
box-sizing: border-box;
width: 100%;
horizontal-align: center;
margin: auto;
z-index: 11;
}
/* Input Slider Customization */
input[type=range] {
-webkit-appearance: none;
-moz-appearance: none;
margin: 0;
width: 100%;
height: 18px;
}
input[type=range]::-webkit-slider-runnable-track {
-webkit-appearance: none;
display: block;
width: 100%;
margin: 0;
padding: 0;
border: 0;
background: linear-gradient(to right, rgba(31,107,117,1) 0%,rgba(58,146,193,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
background: -webkit-linear-gradient(to right, rgba(31,107,117,1) 0%,rgba(58,146,193,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
outline: none;
height: 18px;
}
input[type=range]:focus {
outline: none;
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
width: 24px;
background-color: #96DCE4;
padding: 0;
border: 0;
outline: none;
height: 18px;
}with most widgets you dont need to edit the css.
you can edit the css in the dashboard with commands like:
widget_style: “any valid css”
icon_style: “any valid css”
slider_style: “any valid css”
but it can be that you couldnt set some styleelements, and i didnt document it, because its default dashboard.
I really like it. Do you mind sharing it?
you can install appdaemon v3.0.1 or install v2.1.12 with My-Appdaemon(https://github.com/ReneTode/My-AppDaemon)
what is the line !important in reference too?
That’s css, !important makes this override other rules that may be taking precedence. More: https://stackoverflow.com/questions/9245353/what-does-important-in-css-mean?utm_medium=organic&utm_source=google_rich_qa&utm_campaign=google_rich_qa
Hi,
I really liked this dashboard , do you mind sharing the code , as I want something very similar for my setup too.
Thanks
Developed a few widgets, best efforts on my side I hope someone finds them useful.
hey guys you are doing realy an awesome job. I like it!
Could someone share is widget/config where i can see how you get the times from last changed?
I try to setup a Washing Status and would like to show since when it ist running or finished -like ReneTode has in one of his dashboards aswell.
thank you!
Hi @Rohit_Soni, most of what makes my dashboard look the way it does is custom css. Below is my latest code, it will take quite a bit of manual work for you to get it looking similar for your own dashboard, but this will at least show you how I did it all.
Here is my most recent dashboard.dash:
########################################################################################################################
## Main Config
########################################################################################################################
title: House
widget_dimensions: [24, 25]
widget_size: [1, 1]
widget_margins: [0, 0]
columns: 42
rows: 30
global_parameters:
use_comma: 0
precision: 1
use_hass_icon: 1
namespace: default
layout:
- spotify_album_cover(12x12), av_stereo(6x6), living_room_lights(6x5), top_deck_string(6x5), bitcoin(3x2), clock(9x6)
-
- spx(3x2)
-
- nasdaq(3x2)
- living_room_party(2x2), living_room_relaxed(2x2), living_room_bright(2x2), lower_deck_string(6x5)
- av_house(6x6), temperature_outside(6x3), temperature_inside(6x3)
- dining_lights(6x5)
-
- forecast_0(6x3), air_conditioner(3x5), heater(3x5)
- spa_lights(6x5)
-
- spotify_player(12x11), av_ps4(6x6), dining_room_party(2x2), dining_room_relaxed(2x2), dining_room_bright(2x2), forecast_1(6x3)
-
- kitchen_lights(6x5), living_room_blinds_open(6x5)
- lasers(6x4), forecast_2(6x3)
-
-
- av_ps4_stereo(3x3),av_bedroom(3x3), forecast_3(6x3)
- kitchen_party(2x2), kitchen_relaxed(2x2), kitchen_bright(2x2), top_deck_leds(6x4), living_room_blinds_close(6x5)
-
- av_plug(3x3),av_xbox(3x3), dining_pendants(6x5), forecast_4(6x3)
-
- living_volume_up(3x2), kitchen_volume_up(3x2), bedroom_volume_up(3x2), deck_volume_up(3x2), lower_deck_overhead(6x4)
- projector_daytime(3x6), projector_nighttime(3x6), forecast_5(6x3), front_door(3x3), garage(3x3)
- living_stereo_toggle(3x3), kitchen_stereo_toggle(3x3), bedroom_stereo_toggle(3x3), deck_stereo_toggle(3x3)
- reading_light(6x4)
- lower_deck_heater(6x3), forecast_6(6x3), reload(3x3)
- living_volume_down(3x2), kitchen_volume_down(3x2), bedroom_volume_down(3x2), deck_volume_down(3x2)
-
########################################################################################################################
## Misc
########################################################################################################################
reload:
widget_type: reload
weather_summary:
widget_type: weather_summary
entity: sensor.dark_sky_summary
clock:
widget_type: clock
reload:
widget_type: reload
bitcoin:
title: "BTC"
widget_type: sensor
entity: sensor.exchange_rate_1_btc
shorten: 1
units: ""
precision: 2
nasdaq:
title: "NASDAQ"
widget_type: sensor
entity: sensor.nasdaq
shorten: 1
units: ""
precision: 2
spx:
title: "S&P"
widget_type: sensor
entity: sensor.sp
shorten: 1
units: ""
precision: 2
########################################################################################################################
## Media
########################################################################################################################
spotify_player:
entity: media_player.spotify
widget_type: media_player
title: "Spotify"
spotify_album_cover:
widget_type: camera
entity_picture: [redacted]
refresh: 10
projector_daytime:
widget_type: switch
entity: script.projector_day
title: Daytime Video
icon_on: mdi-weather-sunny
icon_off: mdi-weather-sunny
projector_nighttime:
widget_type: switch
entity: script.projector_night
title: Nighttime Video
icon_on: mdi-weather-night
icon_off: mdi-weather-night
########################################################################################################################
## Lights
########################################################################################################################
living_room_lights:
widget_type: light_with_brightness
entity: light.living
title: Living Room Lights
icon_on: mdi-sofa
icon_off: mdi-sofa
kitchen_lights:
widget_type: light_with_brightness
entity: light.kitchen
title: Kitchen Lights
icon_on: mdi-fridge
icon_off: mdi-fridge
dining_lights:
widget_type: light_with_brightness
entity: light.dining
title: Dining Room Lights
icon_on: fa-cutlery
icon_off: fa-cutlery
dining_pendants:
widget_type: light_with_brightness
entity: light.dining_pendants
title: Pendant Lights
icon_on: mdi-ceiling-light
icon_off: mdi-ceiling-light
MaxValue: 100
reading_light:
widget_type: light_with_brightness
entity: light.reading_light
title: Reading Light
icon_on: mdi-lamp
icon_off: mdi-lamp
MaxValue: 100
########################################################################################################################
## Light States
########################################################################################################################
## Dining Room #########################################################################################################
dining_room_party:
widget_type: switch
entity: script.scene_dining_room_party
# title: Party
icon_on: fa-glass
icon_off: fa-glass
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
dining_room_relaxed:
widget_type: switch
entity: script.scene_dining_room_relaxed
# title: Relaxed
icon_on: mdi-brightness-6
icon_off: mdi-brightness-6
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
dining_room_bright:
widget_type: switch
entity: script.scene_dining_room_bright
# title: Bright
icon_on: mdi-lightbulb-on
icon_off: mdi-lightbulb-on
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
## Living Room #########################################################################################################
living_room_party:
widget_type: switch
entity: script.scene_living_room_party
# title: Party
icon_on: fa-glass
icon_off: fa-glass
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
living_room_relaxed:
widget_type: switch
entity: script.scene_living_room_relaxed
# title: Relaxed
icon_on: mdi-brightness-6
icon_off: mdi-brightness-6
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
living_room_bright:
widget_type: switch
entity: script.scene_living_room_bright
# title: Bright
icon_on: mdi-lightbulb-on
icon_off: mdi-lightbulb-on
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
living_room_dim:
widget_type: switch
entity: script.scene_living_room_dim
# title: Bright
icon_on: mdi-lightbulb-on
icon_off: mdi-lightbulb-on
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
## Kitchen #########################################################################################################
kitchen_party:
widget_type: switch
entity: script.scene_kitchen_party
# title: Party
icon_on: fa-glass
icon_off: fa-glass
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
kitchen_relaxed:
widget_type: switch
entity: script.scene_kitchen_relaxed
# title: Relaxed
icon_on: mdi-brightness-6
icon_off: mdi-brightness-6
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
kitchen_bright:
widget_type: switch
entity: script.scene_kitchen_bright
# title: Bright
icon_on: mdi-lightbulb-on
icon_off: mdi-lightbulb-on
icon_style_inactive: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px;"
icon_style_active: "color: #96DCE4; font-size: 22px; bottom: auto; top: 10px; text-shadow: none;"
########################################################################################################################
## Outside
########################################################################################################################
## Top Deck ############################################################################################################
top_deck_leds:
widget_type: switch
entity: switch.top_deck_leds
title: Upper LEDs
icon_on: mdi-led-on
icon_off: mdi-led-on
top_deck_string:
widget_type: light_with_brightness
entity: light.top_deck_string_lights
title: Upper String Lights
MaxValue: 100
## Lower Deck ############################################################################################################
lower_deck_heater:
widget_type: switch
entity: switch.lower_deck_heater
title: Deck Heater
icon_style_active: "color: red"
icon_on: mdi-fire
icon_off: mdi-fire
widget_style: ""
lower_deck_overhead:
widget_type: light_with_brightness
entity: light.lower_deck_overhead_light
title: Lower Overhead Light
icon_on: mdi-ceiling-light
icon_off: mdi-ceiling-light
MaxValue: 100
lower_deck_string:
widget_type: light_with_brightness
entity: light.lower_deck_string_lights
title: Lower String Lights
MaxValue: 100
## Spa #################################################################################################################
spa_lights:
widget_type: light_with_brightness
entity: light.spa_string_lights
title: Spa String Lights
MaxValue: 100
lasers:
widget_type: switch
entity: switch.lasers
title: Lasers
# icon_style_active: "color: yellow"
icon_on: mdi-flash
icon_off: mdi-flash
# widget_style: "border-top: 1px #222 solid;"
########################################################################################################################
## Sound
########################################################################################################################
## Modes ###############################################################################################################
av_stereo:
widget_type: switch
entity: switch.listen_in_living_area
title: Stereo
icon_on: mdi-music-note
icon_off: mdi-music-note
av_house:
widget_type: switch
entity: switch.listen_in_whole_house
title: Whole House
icon_on: fa-music
icon_off: fa-music
av_bedroom:
widget_type: switch
entity: switch.listen_in_bedroom
title: Bedroom
icon_on: mdi-hotel
icon_off: mdi-hotel
av_ps4:
widget_type: switch
entity: switch.play_ps4
title: PS4
icon_on: mdi-playstation
icon_off: mdi-playstation
av_ps4_stereo:
widget_type: switch
entity: switch.playstation_and_listen
title: PS4+Stereo
icon_on: mdi-playstation
icon_off: mdi-playstation
av_xbox:
widget_type: switch
entity: switch.play_xbox
title: XBOX
icon_on: mdi-xbox
icon_off: mdi-xbox
av_plug:
widget_type: switch
entity: switch.listen_to_phone
title: Plug
icon_on: mdi-cellphone-iphone
icon_off: mdi-cellphone-iphone
## Theater #############################################################################################################
living_stereo_toggle:
widget_type: switch
entity: script.living_toggle
title: Theater
icon_on: mdi-sofa
icon_off: mdi-sofa
living_volume_up:
widget_type: switch
entity: script.living_up
icon_on: mdi-chevron-up
icon_off: mdi-chevron-up
living_volume_down:
widget_type: switch
entity: script.living_down
icon_on: mdi-chevron-down
icon_off: mdi-chevron-down
## Kitchen #############################################################################################################
kitchen_stereo_toggle:
widget_type: switch
entity: script.kitchen_toggle
title: Kitchen
icon_on: mdi-fridge
icon_off: mdi-fridge
kitchen_volume_up:
widget_type: switch
entity: script.kitchen_up
# title: Volume Up
icon_on: mdi-chevron-up
icon_off: mdi-chevron-up
kitchen_volume_down:
widget_type: switch
entity: script.kitchen_down
# title: Volume Down
icon_on: mdi-chevron-down
icon_off: mdi-chevron-down
# widget_style: "border-top: 1px #222 solid;"
## Bedroom #############################################################################################################
bedroom_stereo_toggle:
widget_type: switch
entity: script.bedroom_toggle
title: Bedroom
icon_on: mdi-hotel
icon_off: mdi-hotel
icon_style_active: "color: white"
# widget_style: "border-top: 1px #222 solid;"
bedroom_volume_up:
widget_type: switch
entity: script.bedroom_up
# title: Volume Up
icon_on: mdi-chevron-up
icon_off: mdi-chevron-up
icon_style_active: "color: white"
# widget_style: "border-top: 1px #222 solid;"
bedroom_volume_down:
widget_type: switch
entity: script.bedroom_down
# title: Volume Down
icon_on: mdi-chevron-down
icon_off: mdi-chevron-down
icon_style_active: "color: white"
# widget_style: "border-top: 1px #222 solid;"
## Deck ################################################################################################################
deck_stereo_toggle:
widget_type: switch
entity: script.deck_toggle
title: Deck
icon_on: mdi-pine-tree
icon_off: mdi-pine-tree
icon_style_active: "color: white"
# widget_style: "border-top: 1px #222 solid;"
deck_volume_up:
widget_type: switch
entity: script.deck_up
# title: Volume Up
icon_on: mdi-chevron-up
icon_off: mdi-chevron-up
icon_style_active: "color: white"
# widget_style: "border-top: 1px #222 solid;"
deck_volume_down:
widget_type: switch
entity: script.deck_down
# title: Volume Down
icon_on: mdi-chevron-down
icon_off: mdi-chevron-down
icon_style_active: "color: white"
# widget_style: "border-top: 1px #222 solid;"
########################################################################################################################
## Weather Summary
########################################################################################################################
weather_summary:
widget_type: weather_summary
entity: sensor.dark_sky_daily_summary
forecast_0:
widget_type: day_forecast
entity: sensor.forecast_0
forecast_1:
widget_type: day_forecast
entity: sensor.forecast_1
forecast_2:
widget_type: day_forecast
entity: sensor.forecast_2
forecast_3:
widget_type: day_forecast
entity: sensor.forecast_3
forecast_4:
widget_type: day_forecast
entity: sensor.forecast_4
forecast_5:
widget_type: day_forecast
entity: sensor.forecast_5
forecast_6:
widget_type: day_forecast
entity: sensor.forecast_6
########################################################################################################################
## HVAC
########################################################################################################################
temperature_inside:
title: "Inside"
widget_type: sensor
entity: sensor.house_temperature
temperature_outside:
title: "Outside"
widget_type: sensor
entity: sensor.dark_sky_temperature
air_conditioner:
title: "A/C"
widget_type: switch
entity: switch.hvac_air_conditioner
icon_on: mdi-fan
icon_off: mdi-fan
heater:
title: "Heater"
widget_type: switch
entity: switch.hvac_heater
icon_on: mdi-fire
icon_off: mdi-fire
########################################################################################################################
## Doors
########################################################################################################################
front_door:
title: "Front"
widget_type: sensor_with_icon
entity: sensor.front_door
icon_on: mdi-door-open
icon_off: mdi-door
garage:
title: "Garage"
widget_type: sensor_with_icon
entity: sensor.garage
icon_on: mdi-garage-open
icon_off: mdi-garage
########################################################################################################################
## Blinds
########################################################################################################################
living_room_blinds_open:
title: "Blinds"
widget_type: switch
entity: switch.open_blinds
icon_on: mdi-weather-sunset-down
icon_off: mdi-weather-sunset-down
living_room_blinds_close:
title: "Blinds"
widget_type: switch
entity: switch.close_blinds
icon_on: mdi-weather-sunset-up
icon_off: mdi-weather-sunset-up