-
Notifications
You must be signed in to change notification settings - Fork 4
/
themes.yaml
146 lines (141 loc) · 6.69 KB
/
themes.yaml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
slate:
# Rounded borders
ha-card-border-radius: '20px'
# Background image
background-image: 'center / cover no-repeat url("/local/night.jpg") fixed'
# Main colors
primary-color: '#2980b9'
accent-color: '#b58e31'
dark-primary-color: '#2980b9'
light-primary-color: '#2980b9'
# Text colors
primary-text-color: '#FFFFFF'
text-primary-color: 'var(--primary-text-color)'
secondary-text-color: '#b58e31'
disabled-text-color: '#777777'
label-badge-border-color: 'green'
# Sidebar
sidebar-icon-color: '#777777'
# Background colors
primary-background-color: '#222222'
secondary-background-color: '#222222'
divider-color: 'rgba(0, 0, 0, .12)'
table-row-background-color: '#292929'
table-row-alternative-background-color: '#292929'
# Nav Menu
paper-listbox-color: '#777777'
paper-listbox-background-color: '#141414'
paper-grey-50: 'var(--primary-text-color)'
paper-grey-200: '#222222'
# Paper card
paper-card-header-color: '#2980b9'
paper-card-background-color: '#292929'
paper-dialog-background-color: '#292929'
paper-item-icon-color: 'var(--primary-text-color)'
paper-item-icon-active-color: '#b58e31'
paper-item-icon_-_color: 'green'
paper-item-selected_-_background-color: '#292929'
paper-tabs-selection-bar-color: 'green'
# Labels
label-badge-red: 'var(--primary-color)'
label-badge-text-color: 'var(--primary-text-color)'
label-badge-background-color: '#222222'
# Switches
paper-toggle-button-checked-button-color: '#2980b9'
paper-toggle-button-checked-bar-color: '#2980b9'
paper-toggle-button-checked-ink-color: '#2980b9'
paper-toggle-button-unchecked-button-color: 'var(--disabled-text-color)'
paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)'
paper-toggle-button-unchecked-ink-color: 'var(--disabled-text-color)'
# Sliders
paper-slider-knob-color: '#2980b9'
paper-slider-knob-start-color: '#2980b9'
paper-slider-pin-color: '#2980b9'
paper-slider-active-color: '#2980b9'
paper-slider-container-color: 'linear-gradient(var(--primary-background-color), var(--secondary-background-color)) no-repeat'
paper-slider-secondary-color: 'var(--secondary-background-color)'
paper-slider-disabled-active-color: 'var(--disabled-text-color)'
paper-slider-disabled-secondary-color: 'var(--disabled-text-color)'
# Google colors
google-red-500: '#b58e31'
google-green-500: '#2980b9'
#Changes to fix history/logbook menus
lumo-primary-text-color: '#2980b9'
lumo-secondary-text-color: '#2980b9'
lumo-primary-color: '#2980b9'
#Calendar day numbers
lumo-body-text-color: '#b58e31'
#Calendar/Date-Picker Background
lumo-base-color: '#222222'
#Month/Year header
lumo-header-text-color: 'var(--lumo-body-text-color)'
#DayOfWeek Header
lumo-tertiary-text-color: 'var(--lumo-body-text-color)'
lumo-shade: '#222222'
lumo-shade-90pct: 'rgba(34, 34, 34, .9)'
lumo-shade-80pct: 'rgba(34, 34, 34, .8)'
lumo-shade-70pct: 'rgba(34, 34, 34, .7)'
lumo-shade-60pct: 'rgba(34, 34, 34, .6)'
lumo-shade-50pct: 'rgba(34, 34, 34, .5)'
lumo-shade-40pct: 'rgba(34, 34, 34, .4)'
lumo-shade-30pct: 'rgba(34, 34, 34, .3)'
lumo-shade-20pct: 'rgba(34, 34, 34, .2)'
lumo-shade-10pct: 'rgba(34, 34, 34, .1)'
lumo-shade-5pct: 'rgba(34, 34, 34, .05)'
lumo-tint-5pct: '#222222'
rounded:
# Rounded borders
ha-card-border-radius: '20px'
# Background image
background-image: 'center / cover no-repeat url("/local/day.jpg") fixed'
background-card-color: 'rgba(255,255,255,0.3)'
paper-card-background-color: 'var(--background-card-color)'
clear:
# Rounded borders
ha-card-border-radius: '20px'
# Background image
background-image: 'center / cover no-repeat url("/local/day.jpg") fixed'
# Colors
text-color: '#636B75' # Grey text
text-medium-color: '#8c96a5' # Medium grey text
text-light-color: '#8d967f' # Light grey text
accent-color: '#b1ce82' # Blue
background-color: 'rgba(247,248,249,1)' # Light grey background
background-color-2: 'rgba(244,245,246,1)' # Light grey background
background-card-color: 'rgba(255,255,255,0.5)' # White background
border-color: '#EAEAEA' # Light grey border
# Header
primary-color: '#627562' # Background
text-primary-color: '#FFF' # Text
# Left Menu
paper-listbox-background-color: 'var(--background-color)' # Background
# UI
paper-card-header-color: 'var(--text-color)' # Title in settings
primary-background-color: 'var(--background-color)' # Background (also title background in left menu)
# Card
paper-card-background-color: 'var(--background-card-color)' # Background
dark-primary-color: 'var(--text-color)'
primary-text-color: 'var(--text-color)'
paper-listbox-color: 'var(--text-color)'
light-primary-color: 'var(--text-light-color)'
secondary-text-color: 'var(--text-medium-color)'
disabled-text-color: 'var(--text-light-color)'
paper-dialog-button-color: 'var(--text-color)'
secondary-background-color: 'var(--background-color-2)' # Background more info title
# Icons
paper-item-icon-color: 'var(--text-light-color)' # Off
paper-item-icon-active-color: 'var(--accent-color)' # On
# Switches
paper-toggle-button-checked-button-color: '#FFF' # Knob On
paper-toggle-button-checked-bar-color: '#0077FF' # Background On
paper-toggle-button-unchecked-button-color: '#FFF' # Knob Off
paper-toggle-button-unchecked-bar-color: 'var(--disabled-text-color)' # Background Off
# Shadows
shadow-elevation-2dp_-_box-shadow: 'inset 0px 0px 0px 1px var(--border-color)'
shadow-elevation-4dp_-_box-shadow: 'var(--shadow-elevation-2dp_-_box-shadow)'
shadow-elevation-6dp_-_box-shadow: 'var(--shadow-elevation-2dp_-_box-shadow)'
shadow-elevation-8dp_-_box-shadow: 'var(--shadow-elevation-2dp_-_box-shadow)'
shadow-elevation-10dp_-_box-shadow: 'var(--shadow-elevation-2dp_-_box-shadow)'
shadow-elevation-12dp_-_box-shadow: 'var(--shadow-elevation-2dp_-_box-shadow)'
shadow-elevation-14dp_-_box-shadow: 'var(--shadow-elevation-2dp_-_box-shadow)'
shadow-elevation-16dp_-_box-shadow: '0px 0px 0px 3px var(--light-color)'