homebridge-nuheat2 1.2.13 → 1.2.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +12 -0
- package/homebridge-ui/public/styles.css +154 -113
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -4,6 +4,18 @@ All notable changes to this project should be documented in this file
|
|
|
4
4
|
|
|
5
5
|
## [Unreleased]
|
|
6
6
|
|
|
7
|
+
## [1.2.15] - 2026-04-27
|
|
8
|
+
|
|
9
|
+
### Fixed
|
|
10
|
+
|
|
11
|
+
- Restore Homebridge-like typography, form controls, and button styling in the custom admin UI while keeping theme-compatible colors
|
|
12
|
+
|
|
13
|
+
## [1.2.14] - 2026-04-27
|
|
14
|
+
|
|
15
|
+
### Changed
|
|
16
|
+
|
|
17
|
+
- Make the custom Homebridge admin UI styles inherit the active Homebridge theme instead of forcing a separate dark design
|
|
18
|
+
|
|
7
19
|
## [1.2.13] - 2026-04-24
|
|
8
20
|
|
|
9
21
|
### Changed
|
|
@@ -1,20 +1,26 @@
|
|
|
1
|
-
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600&display=swap");
|
|
2
|
-
|
|
3
1
|
:root {
|
|
4
|
-
--
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
--
|
|
15
|
-
--
|
|
16
|
-
--
|
|
17
|
-
--
|
|
2
|
+
--plugin-font-family: var(
|
|
3
|
+
--bs-body-font-family,
|
|
4
|
+
-apple-system,
|
|
5
|
+
BlinkMacSystemFont,
|
|
6
|
+
"Segoe UI",
|
|
7
|
+
Roboto,
|
|
8
|
+
"Helvetica Neue",
|
|
9
|
+
Arial,
|
|
10
|
+
sans-serif
|
|
11
|
+
);
|
|
12
|
+
--plugin-border: color-mix(in srgb, currentColor 24%, transparent);
|
|
13
|
+
--plugin-strong-border: color-mix(in srgb, currentColor 36%, transparent);
|
|
14
|
+
--plugin-subtle-surface: color-mix(in srgb, currentColor 6%, transparent);
|
|
15
|
+
--plugin-control-surface: color-mix(in srgb, currentColor 7%, transparent);
|
|
16
|
+
--plugin-control-disabled: color-mix(in srgb, currentColor 4%, transparent);
|
|
17
|
+
--plugin-accent: var(--bs-primary, #0a84ff);
|
|
18
|
+
--plugin-accent-surface: rgba(10, 132, 255, 0.08);
|
|
19
|
+
--plugin-warning-surface: rgba(245, 158, 11, 0.12);
|
|
20
|
+
--plugin-success-surface: rgba(34, 197, 94, 0.12);
|
|
21
|
+
--plugin-danger-surface: rgba(239, 68, 68, 0.12);
|
|
22
|
+
--plugin-tile-ink: currentColor;
|
|
23
|
+
--plugin-tile-muted: currentColor;
|
|
18
24
|
}
|
|
19
25
|
|
|
20
26
|
* {
|
|
@@ -23,52 +29,61 @@
|
|
|
23
29
|
|
|
24
30
|
body {
|
|
25
31
|
margin: 0;
|
|
26
|
-
|
|
27
|
-
background:
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
),
|
|
32
|
-
var(--bg);
|
|
33
|
-
color: var(--text);
|
|
32
|
+
color: inherit;
|
|
33
|
+
background: transparent;
|
|
34
|
+
font-family: var(--plugin-font-family);
|
|
35
|
+
font-size: 1rem;
|
|
36
|
+
line-height: 1.5;
|
|
34
37
|
}
|
|
35
38
|
|
|
36
39
|
.container {
|
|
37
40
|
max-width: 920px;
|
|
38
41
|
margin: 0 auto;
|
|
39
|
-
padding:
|
|
42
|
+
padding: 24px;
|
|
40
43
|
display: grid;
|
|
41
44
|
gap: 18px;
|
|
45
|
+
color: inherit;
|
|
42
46
|
}
|
|
43
47
|
|
|
44
48
|
header h1 {
|
|
45
|
-
font-size: 2.15rem;
|
|
46
|
-
line-height: 1.1;
|
|
47
49
|
margin: 0 0 8px;
|
|
50
|
+
font-size: 2rem;
|
|
51
|
+
font-weight: 600;
|
|
52
|
+
line-height: 1.1;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
.subtitle,
|
|
56
|
+
.help,
|
|
57
|
+
.muted {
|
|
58
|
+
color: currentColor;
|
|
59
|
+
opacity: 0.72;
|
|
48
60
|
}
|
|
49
61
|
|
|
50
|
-
.subtitle
|
|
62
|
+
.subtitle,
|
|
63
|
+
.help {
|
|
51
64
|
margin: 0;
|
|
52
|
-
|
|
65
|
+
line-height: 1.5;
|
|
53
66
|
}
|
|
54
67
|
|
|
55
68
|
.panel {
|
|
56
|
-
|
|
57
|
-
|
|
69
|
+
color: inherit;
|
|
70
|
+
background: transparent;
|
|
71
|
+
border: 1px solid var(--plugin-border);
|
|
58
72
|
border-radius: 8px;
|
|
59
73
|
padding: 22px;
|
|
60
|
-
box-shadow: var(--shadow);
|
|
61
74
|
}
|
|
62
75
|
|
|
63
76
|
.panel h2 {
|
|
64
77
|
margin: 0 0 6px;
|
|
65
78
|
font-size: 1.18rem;
|
|
79
|
+
font-weight: 600;
|
|
66
80
|
line-height: 1.25;
|
|
67
81
|
}
|
|
68
82
|
|
|
69
83
|
.panel h3 {
|
|
70
84
|
margin: 0 0 4px;
|
|
71
85
|
font-size: 1rem;
|
|
86
|
+
font-weight: 600;
|
|
72
87
|
line-height: 1.25;
|
|
73
88
|
}
|
|
74
89
|
|
|
@@ -82,16 +97,6 @@ header h1 {
|
|
|
82
97
|
gap: 16px;
|
|
83
98
|
}
|
|
84
99
|
|
|
85
|
-
.help {
|
|
86
|
-
color: var(--muted);
|
|
87
|
-
margin: 0;
|
|
88
|
-
line-height: 1.5;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
.muted {
|
|
92
|
-
color: var(--muted);
|
|
93
|
-
}
|
|
94
|
-
|
|
95
100
|
.settings-grid,
|
|
96
101
|
.split-grid {
|
|
97
102
|
display: grid;
|
|
@@ -103,33 +108,55 @@ header h1 {
|
|
|
103
108
|
.field {
|
|
104
109
|
display: grid;
|
|
105
110
|
gap: 7px;
|
|
106
|
-
color:
|
|
111
|
+
color: inherit;
|
|
107
112
|
font-size: 0.95rem;
|
|
108
113
|
font-weight: 600;
|
|
109
114
|
}
|
|
110
115
|
|
|
116
|
+
.field input,
|
|
117
|
+
.field select {
|
|
118
|
+
width: 100%;
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
input,
|
|
122
|
+
select {
|
|
123
|
+
display: block;
|
|
124
|
+
width: 100%;
|
|
125
|
+
min-height: 38px;
|
|
126
|
+
padding: 0.45rem 0.75rem;
|
|
127
|
+
color: inherit;
|
|
128
|
+
background: var(--bs-body-bg, var(--plugin-control-surface));
|
|
129
|
+
border: 1px solid var(--plugin-border);
|
|
130
|
+
border-radius: 0.375rem;
|
|
131
|
+
font-family: var(--plugin-font-family);
|
|
132
|
+
font-size: 1rem;
|
|
133
|
+
line-height: 1.5;
|
|
134
|
+
transition:
|
|
135
|
+
border-color 0.15s ease,
|
|
136
|
+
box-shadow 0.15s ease,
|
|
137
|
+
background-color 0.15s ease;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
input:focus,
|
|
141
|
+
select:focus {
|
|
142
|
+
border-color: color-mix(in srgb, var(--plugin-accent) 72%, currentColor);
|
|
143
|
+
box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--plugin-accent) 18%, transparent);
|
|
144
|
+
outline: 0;
|
|
145
|
+
}
|
|
146
|
+
|
|
111
147
|
.field small,
|
|
112
148
|
.checkbox small {
|
|
113
|
-
color:
|
|
149
|
+
color: currentColor;
|
|
114
150
|
display: block;
|
|
115
151
|
font-size: 0.82rem;
|
|
116
152
|
font-weight: 400;
|
|
117
153
|
line-height: 1.35;
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
select,
|
|
121
|
-
input {
|
|
122
|
-
width: 100%;
|
|
123
|
-
padding: 12px 14px;
|
|
124
|
-
border-radius: 7px;
|
|
125
|
-
border: 1px solid var(--border);
|
|
126
|
-
background: var(--input);
|
|
127
|
-
color: var(--text);
|
|
128
|
-
font-size: 1rem;
|
|
154
|
+
opacity: 0.72;
|
|
129
155
|
}
|
|
130
156
|
|
|
131
157
|
input::placeholder {
|
|
132
|
-
color:
|
|
158
|
+
color: currentColor;
|
|
159
|
+
opacity: 0.48;
|
|
133
160
|
}
|
|
134
161
|
|
|
135
162
|
.checkbox {
|
|
@@ -137,7 +164,7 @@ input::placeholder {
|
|
|
137
164
|
align-items: flex-start;
|
|
138
165
|
gap: 10px;
|
|
139
166
|
margin-top: 18px;
|
|
140
|
-
color:
|
|
167
|
+
color: inherit;
|
|
141
168
|
font-weight: 600;
|
|
142
169
|
}
|
|
143
170
|
|
|
@@ -152,8 +179,8 @@ input::placeholder {
|
|
|
152
179
|
}
|
|
153
180
|
|
|
154
181
|
.readonly input {
|
|
155
|
-
background:
|
|
156
|
-
opacity: 0.
|
|
182
|
+
background: var(--plugin-control-disabled);
|
|
183
|
+
opacity: 0.68;
|
|
157
184
|
}
|
|
158
185
|
|
|
159
186
|
.actions {
|
|
@@ -164,31 +191,45 @@ input::placeholder {
|
|
|
164
191
|
}
|
|
165
192
|
|
|
166
193
|
button {
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
194
|
+
display: inline-flex;
|
|
195
|
+
align-items: center;
|
|
196
|
+
justify-content: center;
|
|
197
|
+
min-height: 38px;
|
|
198
|
+
padding: 0.45rem 0.85rem;
|
|
199
|
+
border: 1px solid transparent;
|
|
200
|
+
font-family: var(--plugin-font-family);
|
|
170
201
|
font-size: 0.95rem;
|
|
171
202
|
font-weight: 600;
|
|
203
|
+
line-height: 1.5;
|
|
172
204
|
cursor: pointer;
|
|
173
205
|
transition:
|
|
174
|
-
|
|
175
|
-
|
|
206
|
+
background-color 0.15s ease,
|
|
207
|
+
border-color 0.15s ease,
|
|
208
|
+
box-shadow 0.15s ease,
|
|
209
|
+
filter 0.15s ease;
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
button.primary,
|
|
213
|
+
button.secondary {
|
|
214
|
+
border-radius: 6px;
|
|
176
215
|
}
|
|
177
216
|
|
|
178
|
-
button
|
|
179
|
-
|
|
180
|
-
|
|
217
|
+
button.primary {
|
|
218
|
+
color: var(--bs-btn-color, #fff);
|
|
219
|
+
background: var(--bs-primary, var(--plugin-accent));
|
|
220
|
+
border: 1px solid var(--bs-primary, var(--plugin-accent));
|
|
181
221
|
}
|
|
182
222
|
|
|
183
|
-
.
|
|
184
|
-
|
|
185
|
-
|
|
223
|
+
button.secondary {
|
|
224
|
+
color: inherit;
|
|
225
|
+
background: var(--plugin-subtle-surface);
|
|
226
|
+
border: 1px solid var(--plugin-border);
|
|
186
227
|
}
|
|
187
228
|
|
|
188
|
-
.
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
229
|
+
button.primary:hover,
|
|
230
|
+
button.secondary:hover {
|
|
231
|
+
filter: brightness(1.04);
|
|
232
|
+
box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--plugin-accent) 10%, transparent);
|
|
192
233
|
}
|
|
193
234
|
|
|
194
235
|
.toast-container {
|
|
@@ -202,33 +243,37 @@ button:hover {
|
|
|
202
243
|
}
|
|
203
244
|
|
|
204
245
|
.toast {
|
|
205
|
-
|
|
206
|
-
|
|
246
|
+
color: inherit;
|
|
247
|
+
background: var(--bs-body-bg, var(--plugin-control-surface));
|
|
248
|
+
border: 1px solid var(--plugin-border);
|
|
207
249
|
border-radius: 8px;
|
|
208
250
|
padding: 12px 16px;
|
|
209
|
-
box-shadow: var(--shadow);
|
|
210
251
|
min-width: 220px;
|
|
211
252
|
animation: slide-in 0.2s ease-out;
|
|
212
253
|
}
|
|
213
254
|
|
|
214
255
|
.toast.success {
|
|
215
|
-
|
|
256
|
+
background: var(--plugin-success-surface);
|
|
257
|
+
border-color: rgba(34, 197, 94, 0.42);
|
|
216
258
|
}
|
|
217
259
|
|
|
218
260
|
.toast.error {
|
|
219
|
-
|
|
261
|
+
background: var(--plugin-danger-surface);
|
|
262
|
+
border-color: rgba(239, 68, 68, 0.42);
|
|
220
263
|
}
|
|
221
264
|
|
|
222
265
|
.toast.warning {
|
|
223
|
-
|
|
266
|
+
background: var(--plugin-warning-surface);
|
|
267
|
+
border-color: rgba(245, 158, 11, 0.42);
|
|
224
268
|
}
|
|
225
269
|
|
|
226
270
|
.list-panel,
|
|
227
271
|
.diagnostic-card {
|
|
228
|
-
|
|
272
|
+
color: var(--plugin-tile-ink);
|
|
273
|
+
background: var(--plugin-subtle-surface);
|
|
274
|
+
border: 1px solid var(--plugin-border);
|
|
229
275
|
border-radius: 8px;
|
|
230
276
|
padding: 16px;
|
|
231
|
-
background: var(--panel-soft);
|
|
232
277
|
}
|
|
233
278
|
|
|
234
279
|
.dynamic-list {
|
|
@@ -238,11 +283,12 @@ button:hover {
|
|
|
238
283
|
}
|
|
239
284
|
|
|
240
285
|
.empty-list {
|
|
241
|
-
color: var(--muted);
|
|
242
|
-
border: 1px dashed var(--border);
|
|
286
|
+
color: var(--plugin-tile-muted);
|
|
287
|
+
border: 1px dashed var(--plugin-strong-border);
|
|
243
288
|
border-radius: 8px;
|
|
244
289
|
padding: 14px;
|
|
245
290
|
line-height: 1.45;
|
|
291
|
+
opacity: 0.78;
|
|
246
292
|
}
|
|
247
293
|
|
|
248
294
|
.config-row {
|
|
@@ -256,13 +302,14 @@ button:hover {
|
|
|
256
302
|
display: inline-flex;
|
|
257
303
|
align-items: center;
|
|
258
304
|
gap: 8px;
|
|
259
|
-
color: var(--muted);
|
|
305
|
+
color: var(--plugin-tile-muted);
|
|
260
306
|
font-size: 0.86rem;
|
|
261
307
|
white-space: nowrap;
|
|
308
|
+
opacity: 0.78;
|
|
262
309
|
}
|
|
263
310
|
|
|
264
311
|
.remove-row {
|
|
265
|
-
padding:
|
|
312
|
+
padding: 8px 12px;
|
|
266
313
|
}
|
|
267
314
|
|
|
268
315
|
.diagnostics-summary {
|
|
@@ -282,58 +329,52 @@ button:hover {
|
|
|
282
329
|
}
|
|
283
330
|
|
|
284
331
|
.diagnostic-card dt {
|
|
285
|
-
color: var(--muted);
|
|
332
|
+
color: var(--plugin-tile-muted);
|
|
286
333
|
font-size: 0.82rem;
|
|
287
334
|
margin-bottom: 4px;
|
|
335
|
+
opacity: 0.72;
|
|
288
336
|
}
|
|
289
337
|
|
|
290
338
|
.diagnostic-card dd {
|
|
291
339
|
margin: 0;
|
|
340
|
+
color: var(--plugin-tile-ink);
|
|
292
341
|
word-break: break-word;
|
|
293
342
|
}
|
|
294
343
|
|
|
295
|
-
.pill
|
|
344
|
+
.pill,
|
|
345
|
+
.status-pill {
|
|
296
346
|
display: inline-flex;
|
|
297
347
|
align-items: center;
|
|
348
|
+
border: 1px solid var(--plugin-border);
|
|
298
349
|
border-radius: 999px;
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
border: 1px solid var(--border);
|
|
350
|
+
color: inherit;
|
|
351
|
+
background: transparent;
|
|
302
352
|
white-space: nowrap;
|
|
303
353
|
}
|
|
304
354
|
|
|
305
|
-
.pill
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
color: #86efac;
|
|
309
|
-
}
|
|
310
|
-
|
|
311
|
-
.pill.warn {
|
|
312
|
-
background: rgba(245, 158, 11, 0.12);
|
|
313
|
-
border-color: rgba(245, 158, 11, 0.4);
|
|
314
|
-
color: #fcd34d;
|
|
355
|
+
.pill {
|
|
356
|
+
padding: 6px 10px;
|
|
357
|
+
font-size: 0.8rem;
|
|
315
358
|
}
|
|
316
359
|
|
|
317
360
|
.status-pill {
|
|
318
|
-
|
|
319
|
-
border-radius: 999px;
|
|
320
|
-
color: var(--muted);
|
|
361
|
+
padding: 7px 11px;
|
|
321
362
|
font-size: 0.82rem;
|
|
322
363
|
font-weight: 600;
|
|
323
|
-
padding: 7px 11px;
|
|
324
|
-
white-space: nowrap;
|
|
325
364
|
}
|
|
326
365
|
|
|
366
|
+
.pill.good,
|
|
327
367
|
.status-pill.good {
|
|
328
|
-
background:
|
|
329
|
-
border-color: rgba(
|
|
330
|
-
color:
|
|
368
|
+
background: var(--plugin-success-surface);
|
|
369
|
+
border-color: rgba(34, 197, 94, 0.42);
|
|
370
|
+
color: inherit;
|
|
331
371
|
}
|
|
332
372
|
|
|
373
|
+
.pill.warn,
|
|
333
374
|
.status-pill.warn {
|
|
334
|
-
background:
|
|
335
|
-
border-color: rgba(
|
|
336
|
-
color:
|
|
375
|
+
background: var(--plugin-warning-surface);
|
|
376
|
+
border-color: rgba(245, 158, 11, 0.42);
|
|
377
|
+
color: inherit;
|
|
337
378
|
}
|
|
338
379
|
|
|
339
380
|
@keyframes slide-in {
|
|
@@ -353,7 +394,7 @@ button:hover {
|
|
|
353
394
|
}
|
|
354
395
|
|
|
355
396
|
.container {
|
|
356
|
-
padding:
|
|
397
|
+
padding: 20px 16px;
|
|
357
398
|
}
|
|
358
399
|
|
|
359
400
|
.settings-grid,
|