updating themes and colors

This commit is contained in:
CeeWeasel
2025-09-17 22:24:37 -04:00
parent c826cb7738
commit 0f815c268b
39 changed files with 2439 additions and 206 deletions
+90 -119
View File
@@ -12,16 +12,16 @@ svg * {
/* Hover over */
.entity:hover {
stroke: #FFFFFF !important;
stroke: var(--text-primary-color) !important;
stroke-width: 1px !important;
stroke-opacity: 1 !important;
}
/* Bootstrap succsss */
/* Bootstrap succssss */
.success-text {
fill: #3c763d !important;
fill: var(--green-color) !important;
}
.success-background,
@@ -36,7 +36,7 @@ svg * {
/* Bootstrap info */
.info-text {
fill: #d4d4d4 !important;
fill: var(--info-color) !important;
}
.awake {
@@ -57,28 +57,28 @@ svg * {
.room-empty {
/*fill: #5d5b5b !important;*/
fill: #888888 !important;
fill: var(--card-background-color) !important;
fill-opacity: 1 !important;
}
.room-occupied {
fill: #596170 !important;
fill: var(--grey-color) !important;
fill-opacity: 1 !important;
/* fill: #5d5d6f !important;*/
}
.water-dry {
fill: #81D9a7 !important;
fill: var(--green-color) !important;
fill-opacity: 1 !important;
}
.water-wet {
fill: #FF0000 !important;
fill: var(--error-color) !important;
fill-opacity: 1 !important;
}
.door-closed {
/* fill: #77FF77 !important; */
/* fill: var(--green-color) !important; */
/* fill: #81c9a7 !important; */
fill: #81D9a7 !important;
fill-opacity: 1 !important;
@@ -89,9 +89,9 @@ svg * {
}
.door-open {
fill: #FF0000 !important;
fill: var(--error-color) !important;
fill-opacity: 1 !important;
stroke: #FFFF00 !important;
stroke: var(--warning-color) !important;
stroke-dasharray: 10, 4 !important;
stroke-width: 2px !important;
stroke-opacity: 0.8 !important;
@@ -101,7 +101,7 @@ svg * {
}
.appliance-off {
/* fill: #77FF77 !important; */
/* fill: var(--green-color) !important; */
/* fill: #81c9a7 !important; */
fill: #81D9a7 !important;
fill-opacity: 1 !important;
@@ -120,7 +120,7 @@ svg * {
}
.appliance-pending {
fill: #6b0000 !important;
fill: var(--error-color) !important;
fill-opacity: 1 !important;
/* animation-duration: 4s;
animation-name: rotate90;
@@ -128,7 +128,7 @@ svg * {
}
.window-closed {
/* fill: #77FF77 !important; */
/* fill: var(--green-color) !important; */
/* fill: #81c9a7 !important; */
fill: #CCCCCC !important;
fill-opacity: 1 !important;
@@ -139,18 +139,18 @@ svg * {
}
.window-open {
fill: #FF0000 !important;
fill: var(--error-color) !important;
fill-opacity: 1 !important;
stroke: #FFFF00 !important;
stroke: var(--warning-color) !important;
stroke-dasharray: 10, 4 !important;
stroke-width: 2px !important;
stroke-opacity: 0.8 !important;
}
.window-unavailable {
fill: #FFFF00 !important;
fill: var(--warning-color) !important;
fill-opacity: 1 !important;
stroke: #FF0000 !important;
stroke: var(--error-color) !important;
stroke-dasharray: 10, 4 !important;
stroke-width: 2px !important;
stroke-opacity: 0.8 !important;
@@ -164,9 +164,9 @@ svg * {
}
.alarm-triggered {
fill: #FF0000 !important;
fill: var(--error-color) !important;
fill-opacity: 1 !important;
stroke: #FFFF00 !important;
stroke: var(--warning-color) !important;
}
.alarm-armed_night {
@@ -188,7 +188,7 @@ svg * {
.closed-background,
.closed-text-background {
/* fill: #77FF77 !important; */
/* fill: var(--green-color) !important; */
fill: #81D9a7 !important;
fill-opacity: 1 !important;
/* stroke: #82caa8 !important;
@@ -197,9 +197,9 @@ svg * {
.open-background,
.open-text-background {
fill: #FF0000 !important;
fill: var(--error-color) !important;
fill-opacity: 1 !important;
stroke: #FFFF00 !important;
stroke: var(--warning-color) !important;
stroke-dasharray: 10, 4 !important;
stroke-width: 2px !important;
stroke-opacity: 0.8 !important;
@@ -207,7 +207,7 @@ svg * {
.interior-closed-background,
.interior-closed-text-background {
fill: #81c9a7 !important;
fill: var(--light-green-color) !important;
fill-opacity: 1 !important;
/* stroke: #82caa8 !important;
stroke-width: 1px !important; */
@@ -233,9 +233,9 @@ svg * {
.window-open-background,
.window-open-text-background {
fill: #FF0000 !important;
fill: var(--error-color) !important;
fill-opacity: 1 !important;
stroke: #FFFF00 !important;
stroke: var(--warning-color) !important;
stroke-dasharray: 10, 4 !important;
stroke-width: 2px !important;
stroke-opacity: 0.8 !important;
@@ -243,7 +243,7 @@ svg * {
.motion-background,
.motion-text-background {
fill: #81c9a7 !important;
fill: var(--green-color) !important;
/* fill-opacity: 1 !important; */
/* stroke: #82caa8 !important;
stroke-width: 1px !important; */
@@ -254,7 +254,7 @@ svg * {
.info-background {
/* fill: #D2D0ED !important; */
fill: #81c9a7 !important;
fill: var(--lime-color) !important;
/* fill-opacity: 1 !important; */
/* stroke: #82caa8 !important;
stroke-width: 1px !important; */
@@ -264,14 +264,14 @@ svg * {
/* Bootstrap warning */
.warning-text {
fill: #8a6d3b !important;
fill: var(--warning-color) !important;
}
.warning-background,
.warning-text-background {
fill: #FFFF00 !important;
fill: var(--warning-color) !important;
fill-opacity: 1 !important;
stroke: #FF0000 !important;
stroke: var(--error-color) !important;
stroke-width: 4px !important;
stroke-opacity: 0.5 !important;
}
@@ -286,7 +286,7 @@ svg * {
/* Bootstrap danger */
.danger-text {
fill: #a94442 !important;
fill: var(--error-color) !important;
}
.danger-background,
@@ -321,21 +321,15 @@ svg * {
/* Camera */
.camera-idle {
/* fill: #B9CEF7 !important; */
/* fill: #6FAECE !important; */
fill: #8270A2 !important;
fill: var(--purple-color) !important;
}
.camera-unavailable {
fill: #B9CEF7 !important;
/* fill: #6FAECE !important; */
/* fill: #8270A2 !important; */
fill: var(--disabled-color) !important;
}
.camera-streaming {
/* fill: #B9CEF7 !important; */
fill: #6FAECE !important;
/* fill: #8270A2 !important; */
fill: var(--light-blue-color) !important;
}
@@ -349,34 +343,34 @@ svg * {
.light-off,
.light-off * {
fill: #4d4d3e !important;
fill: var(--ha-color-fill-neutral-loud-active) !important;
}
.light-on,
.light-on * {
fill: #FFF27F !important;
stroke: #FFF27F !important;
fill: var(--yellow-color) !important;
stroke: var(--yellow-color) !important;
stroke-width: 7px !important;
stroke-opacity: 0.25 !important;
}
.sun-on {
fill: #FFF27F !important;
stroke: #FFF27F !important;
fill: var(--yellow-color) !important;
stroke: var(--yellow-color) !important;
stroke-width: 2px !important;
stroke-opacity: 0.25 !important;
}
.light-strip-on {
fill: #FFF27F !important;
stroke: #FFF27F !important;
fill: var(--yellow-color) !important;
stroke: var(--yellow-color) !important;
stroke-width: 3px !important;
stroke-opacity: 0.25 !important;
}
.indicator-on {
fill: #FFE500 !important;
/* stroke: #FFE500 !important;
fill: var(--yellow-color) !important;
/* stroke: var(--yellow-color) !important;
stroke-width: 20px !important;
stroke-opacity: 0.25 !important; */
}
@@ -390,7 +384,7 @@ svg * {
}
.doorbell-on {
fill: #FFE500 !important;
fill: var(--yellow-color) !important;
}
@@ -419,41 +413,24 @@ svg * {
/* Media player */
.homehub-off {
fill: #515151 !important;
}
.homehub-paused {
fill: #518151 !important;
}
.homehub-on {
fill: #F1F1F1 !important;
}
.squeezebox-off {
fill: #8270A2 !important;
fill: var(--purple-color) !important;
}
.squeezebox-idle {
fill: #BBBBBB !important;
fill: var(--light-grey-color) !important;
}
.squeezebox-paused {
/* fill: #B9C999 !important; */
fill: #8da6c9 !important;
fill: var(--amber-color) !important;
}
.squeezebox-on {
/* fill: #2baaa6 !important; */
/* fill: #E0E276 !important; */
/* fill: #A7B349 !important; */
/* fill: #03a9f4 !important; */
fill: #40a2cf !important;
fill: var(--light-blue-color) !important;
}
.squeezebox-unknown {
fill: #A99999 !important;
fill: var(--disabled-color) !important;
}
@@ -485,7 +462,7 @@ svg * {
}
.tracker-work {
fill: #9963a6 !important;
fill: var(--brown-color) !important;
}
.tracker-other {
@@ -493,130 +470,124 @@ svg * {
}
.tracker-home {
/* fill: #2baaa6 !important; */
/* fill: #D0D266 !important; */
/* fill: #77FF77 !important; */
fill: #40a2cf !important;
fill: var(--info-color) !important;
}
.hvac-heating {
fill: #5e0202
fill: var(--red-color)
}
.hvac-fan {
fill: #6d6d02
fill: var(--yellow-color)
}
.hvac-cooling {
fill: #010194
fill: var(--blue-color)
}
.hvac-idle {
fill: #8270A2
fill: var(--disabled-color)
}
.fridge-low {
fill: #7777FF !important;
/* stroke-width: 2px !important; */
/* stroke-opacity: 1 !important; */
fill: var(--blue-color) !important;
}
.fridge-medium {
fill: #81D9a7 !important;
fill: var(--green-color) !important;
/* stroke-width: 2px !important;
stroke-opacity: 1 !important; */
}
.fridge-high {
fill: #ff8800 !important;
fill: var(--error-color) !important;
/* stroke-width: 2px !important;
stroke-opacity: 1 !important; */
}
.temp-freeze {
fill: #FFFFFF !important;
fill: var(--white-color) !important;
text-align: right;
}
.temp-low {
fill: #6969ff !important;
fill: var(--blue-color) !important;
text-align: right;
}
.temp-medium {
fill: #77FF77 !important;
fill: var(--green-color) !important;
text-align: right;
}
.temp-high {
fill: #FF7700 !important;
fill: var(--orange-color) !important;
text-align: right;
}
.temp-hot {
fill: #FF0000 !important;
fill: var(--error-color) !important;
text-align: right;
}
.temp-unknown {
fill: #777777 !important;
fill: var(--disabled-color) !important;
}
.health-critical {
fill: #FF0000 !important;
fill: var(--error-color) !important;
}
.health-warning {
fill: #ffa500 !important;
fill: var(--warning-color) !important;
}
.health-info {
fill: #ffff00 !important;
fill: var(--info-color) !important;
}
.health-good {
fill: #77FF77 !important;
fill: var(--green-color) !important;
}
.health-unknown {
fill: #0000FF !important;
fill: var(--disabled-color) !important;
}
.humid-low {
fill: #300330 !important;
fill: var(--purple-color) !important;
}
.humid-med-low {
fill: #cfb837 !important;
fill: var(--yellow-color) !important;
}
.humid-medium {
fill: #77FF77 !important;
fill: var(--green-color) !important;
}
.humid-med-high {
fill: #C8AB37 !important;
fill: var(--ha-color-orange-50) !important;
}
.humid-high {
fill: #FF0000 !important;
fill: var(--error-color) !important;
}
.light-low {
/* fill: #000083 !important; */
fill: #1D2375 !important;
fill: var(--ha-color-neutral-95) !important;
}
.light-medium-low {
fill: #A7B349 !important;
fill: var(--ha-color-orange-30) !important;
}
.light-medium {
fill: #e4ff24 !important;
fill: var(--ha-color-orange-50) !important;
}
.light-high {
fill: #FFFFFF !important;
fill: var(--ha-color-neutral-05) !important;
}
.tv-on {
@@ -629,43 +600,43 @@ svg * {
}
.bin-today {
fill: #FF0000 !important;
fill: var(--error-color) !important;
}
.bin-tomorrow {
fill: #FFFF00 !important;
fill: var(--warning-color) !important;
}
.bin-future {
fill: #00FF00 !important;
fill: var(--ha-color-green-50) !important;
}
.bin-false {
fill: #000000 !important;
fill: var(--black-color) !important;
}
.bags-five {
fill: #00FF00 !important;
fill: var(--graph-color-1) !important;
}
.bags-four {
fill: #33CC00 !important;
fill: var(--graph-color-4) !important;
}
.bags-three {
fill: #669900 !important;
fill: var(--graph-color-7) !important;
}
.bags-two {
fill: #996600 !important;
fill: var(--graph-color-10) !important;
}
.bags-one {
fill: #CC3300 !important;
fill: var(--graph-color-14) !important;
}
.bags-zero {
fill: #FF0000 !important;
fill: var(--error-color) !important;
}
.visible-entity {
@@ -841,7 +812,7 @@ svg * {
}
.green-to-red-grad-18 {
fill: #ff0000 !important;
fill: var(--error-color) !important;
}