Hi, I’m far from an expert in theme so I do what a lot must do and grab the good work others created
I had a hard time finding docs or information about the theme parameters and always end up lost…
So I found the perfect theme for me (bluenight) but there is one thing that annoys me; the icon don’t change color when turned on and folow the brigthness.
The binary sensors as well have this issue…
The only ones working are the RGB lights.
When the lights, binary sensors, etc… are off, I would like them to stay like they are now but when on, I would like them to act 100% like the default theme… everything else (including when they’re off) would stay like it is in the BlueNight theme…
Simple or not?
I would appreciate it so much if someone could help me out (and it would help me understand better the theming in HA.
Here are some examples of what I mean:
default:
bluenight:
***Other themes acts like this so I didn’t think it was specific to this theme…
Here is the theme code:
BlueNight: # MyVariables base-hue: '220' #Controls the base (and accent) color hue (0-360) | 0=Red 60=Yellow 120=Green 180=Cyan 240=Blue 300=Magenta 360=Red base-sat: '5%' #Controls the saturation of the theme (0%-100%) | 0%=Grey 100%=Full Saturation # MyVar huesat: 'var(--base-hue), var(--base-sat),' # Primary Color primary-color: '#2581ab' #hsl(var(--huesat) 50%)' #header colors and some text colors dark-primary-color: 'hsl(var(--huesat) 60%)' light-primary-color: 'hsl(var(--huesat) 30%)' accent-color: 'hsl(var(--huesat) 30%)' # Backgrounds primary-background-color: 'hsl(var(--huesat) 16%)' secondary-background-color: 'hsl(var(--huesat) 16%)' # background behind cards paper-listbox-background-color: 'hsl(var(--huesat) 16%)' paper-card-background-color: 'hsl(var(--huesat) 12%)' paper-dialog-background-color: 'var(--paper-card-background-color)' table-row-background-color: 'hsl(var(--huesat) 12%)' table-row-alternative-background-color: 'hsl(var(--huesat) 10%)' # Divider divider-color: 'hsla(0, 0%, 0%, 0)' dark-divider-opacity: '0' light-divider-opacity: '0' dark-secondary-opacity: '1' # Text colors primary-text-color: 'hsl(var(--huesat) 90%)' text-primary-color: 'hsl(var(--huesat) 90%)' secondary-text-color: 'hsl(var(--huesat) 80%)' disabled-text-color: 'hsl(var(--huesat) 70%)' sidebar-text_-_color: 'hsl(var(--huesat) 90%)' sidebar-text-color: 'hsl(var(--huesat) 90%)' paper-card-header-color: 'hsl(var(--huesat) 90%)' paper-button-ink-color: 'hsl(var(--huesat) 50%)' # Text Adjustments paper-font-headline_-_letter-spacing: '-0.5px' paper-font-headline_-_font-weight: '400' paper-font-body1_-_font-weight: '300' # Nav Menu paper-listbox-color: 'hsl(var(--huesat) 50%)' paper-grey-50: 'hsl(var(--huesat) 50%)' paper-grey-200: 'hsl(var(--huesat) 10%)' #active menu item sidebar-icon-color: 'hsl(var(--huesat) 50%)' #iron-icon-fill-color # Paper card paper-item-icon-color: 'hsl(var(--huesat) 40%)' paper-item-icon-active-color: 'var(--paper-item-icon-color)' paper-item-icon_-_color: 'var(--paper-item-icon-color)' paper-item-selected_-_background-color: 'hsla(0, 0%, 0%, 0.2)' paper-item-selected_-_color: 'hsl(var(--huesat) 20%)' #? paper-tabs-selection-bar-color: 'hsla(0, 0%, 0%, 0.2)' paper-tab-ink: 'hsl(var(--huesat) 70%)' paper-input-container-color: 'hsl(var(--huesat) 60%)' # Labels label-badge-red: 'var(--paper-card-background-color)' label-badge-border-color: 'var(--label-badge-red)' label-badge-background-color: 'var(--paper-card-background-color)' label-badge-text-color: 'var(--primary-text-color)' # Shadows shadow-elevation-2dp_-_box-shadow: '0px 0px 0px 0px hsl(var(--huesat) 10%)' shadow-elevation-16dp_-_box-shadow: '0px 0px 0px 0px hsl(var(--huesat) 25%)' # Switches paper-toggle-button-checked-button-color: 'hsl(var(--base-hue), 90%, 50%)' paper-toggle-button-checked-bar-color: 'hsl(var(--huesat) 25%)' paper-toggle-button-unchecked-button-color: 'hsl(var(--huesat) 25%)' paper-toggle-button-unchecked-bar-color: 'hsl(var(--huesat) 5%)' # Sliders paper-slider-knob-color: 'hsl(var(--base-hue), 90%, 50%)' paper-slider-knob-start-color: 'hsl(var(--base-hue), 80%, 25%)' paper-slider-pin-color: 'hsl(var(--base-hue), 90%, 50%)' paper-slider-active-color: 'hsl(var(--base-hue), 90%, 50%)' paper-slider-container-color: 'hsl(var(--huesat) 28%)' paper-slider-secondary-color: 'hsl(var(--huesat) 90%)' paper-slider-disabled-active-color: 'hsl(var(--base-hue), 80%, 25%)' paper-slider-disabled-secondary-color: 'hsl(var(--base-hue), 80%, 25%)' paper-dialog-color: 'hsl(var(--base-hue), 20%, 80%)'
I thank you in advance to help me out… I promess, I really try to get better at this