@tomorrowos/sdk 0.2.2 → 0.2.3

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.
@@ -1,329 +1,329 @@
1
- * {
2
- box-sizing: border-box;
3
- }
4
-
5
- body {
6
- margin: 0;
7
- font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
8
- background: #f4f3f0;
9
- color: #0a0908;
10
- }
11
-
12
- .app-header {
13
- padding: 1rem 1.5rem;
14
- background: #0a0908;
15
- color: #fafaf9;
16
- }
17
-
18
- .app-header h1 {
19
- margin: 0;
20
- font-size: 1.25rem;
21
- font-weight: 600;
22
- }
23
-
24
- .app-header p {
25
- margin: 0.35rem 0 0;
26
- font-size: 0.875rem;
27
- opacity: 0.8;
28
- }
29
-
30
- .layout {
31
- display: flex;
32
- gap: 0;
33
- min-height: calc(100vh - 4.5rem);
34
- }
35
-
36
- .panel-main {
37
- flex: 1;
38
- padding: 1.25rem 1.5rem 2rem;
39
- overflow: auto;
40
- }
41
-
42
- .panel-playlist {
43
- width: 320px;
44
- flex-shrink: 0;
45
- background: #fff;
46
- border-left: 1px solid #e4e1dc;
47
- display: flex;
48
- flex-direction: column;
49
- }
50
-
51
- .card {
52
- background: #fff;
53
- border: 1px solid #e4e1dc;
54
- border-radius: 10px;
55
- padding: 1rem 1.1rem;
56
- margin-bottom: 1rem;
57
- }
58
-
59
- .card h2 {
60
- margin: 0 0 0.75rem;
61
- font-size: 0.95rem;
62
- font-weight: 600;
63
- }
64
-
65
- .hint {
66
- margin: 0 0 0.75rem;
67
- font-size: 0.8rem;
68
- color: #666;
69
- }
70
-
71
- .devices-grid {
72
- display: grid;
73
- grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
74
- gap: 0.85rem;
75
- }
76
-
77
- .devices-empty {
78
- margin: 0;
79
- color: #666;
80
- font-size: 0.875rem;
81
- grid-column: 1 / -1;
82
- }
83
-
84
- .device-card {
85
- border: 1px solid #e4e1dc;
86
- border-radius: 8px;
87
- padding: 0.85rem 0.95rem;
88
- background: #fafaf9;
89
- }
90
-
91
- .device-card-header {
92
- display: flex;
93
- align-items: center;
94
- gap: 0.5rem;
95
- margin-bottom: 0.65rem;
96
- }
97
-
98
- .device-card-title {
99
- margin: 0;
100
- font-size: 0.95rem;
101
- font-weight: 600;
102
- line-height: 1.2;
103
- }
104
-
105
- .status-led {
106
- width: 11px;
107
- height: 11px;
108
- border-radius: 50%;
109
- flex-shrink: 0;
110
- box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06);
111
- }
112
-
113
- .status-led--online {
114
- background: #12b76a;
115
- box-shadow: 0 0 8px rgba(18, 183, 106, 0.55);
116
- }
117
-
118
- .status-led--offline {
119
- background: #f04438;
120
- box-shadow: 0 0 8px rgba(240, 68, 56, 0.45);
121
- }
122
-
123
- .device-meta {
124
- display: grid;
125
- gap: 0.35rem;
126
- font-size: 0.78rem;
127
- color: #444;
128
- margin-bottom: 0.75rem;
129
- }
130
-
131
- .device-meta dt {
132
- font-weight: 600;
133
- color: #666;
134
- display: inline;
135
- }
136
-
137
- .device-meta dt::after {
138
- content: ": ";
139
- }
140
-
141
- .device-meta dd {
142
- display: inline;
143
- margin: 0;
144
- word-break: break-all;
145
- }
146
-
147
- .device-meta-row {
148
- display: block;
149
- }
150
-
151
- .device-card-actions {
152
- display: flex;
153
- flex-wrap: wrap;
154
- gap: 0.4rem;
155
- }
156
-
157
- .device-card-actions button {
158
- font-size: 0.78rem;
159
- padding: 0.35rem 0.6rem;
160
- }
161
-
162
- .row {
163
- display: flex;
164
- flex-wrap: wrap;
165
- gap: 0.5rem;
166
- align-items: center;
167
- }
168
-
169
- input[type="text"],
170
- input[type="date"],
171
- input[type="time"],
172
- select {
173
- font: inherit;
174
- padding: 0.45rem 0.6rem;
175
- border: 1px solid #d6d2cb;
176
- border-radius: 6px;
177
- background: #fff;
178
- }
179
-
180
- button {
181
- font: inherit;
182
- padding: 0.45rem 0.85rem;
183
- border-radius: 6px;
184
- border: 1px solid #d6d2cb;
185
- background: #fff;
186
- cursor: pointer;
187
- }
188
-
189
- button:hover {
190
- background: #f5f3ef;
191
- }
192
-
193
- button.primary {
194
- background: #ff8a3d;
195
- border-color: #e67320;
196
- color: #0a0908;
197
- font-weight: 600;
198
- }
199
-
200
- button.primary:hover {
201
- background: #ff9a57;
202
- }
203
-
204
- button.danger {
205
- color: #b42318;
206
- border-color: #fecdca;
207
- }
208
-
209
- .schedule-grid {
210
- display: grid;
211
- grid-template-columns: 1fr 1fr;
212
- gap: 0.65rem 1rem;
213
- }
214
-
215
- .schedule-grid label {
216
- display: flex;
217
- flex-direction: column;
218
- gap: 0.25rem;
219
- font-size: 0.8rem;
220
- color: #444;
221
- }
222
-
223
- .days-row {
224
- grid-column: 1 / -1;
225
- display: flex;
226
- flex-wrap: wrap;
227
- gap: 0.5rem 0.75rem;
228
- font-size: 0.8rem;
229
- }
230
-
231
- .days-row label {
232
- flex-direction: row;
233
- align-items: center;
234
- gap: 0.35rem;
235
- color: #0a0908;
236
- }
237
-
238
- .playlist-header {
239
- display: flex;
240
- align-items: center;
241
- justify-content: space-between;
242
- padding: 1rem 1rem 0.75rem;
243
- border-bottom: 1px solid #e4e1dc;
244
- }
245
-
246
- .playlist-header h2 {
247
- margin: 0;
248
- font-size: 0.95rem;
249
- }
250
-
251
- .playlist-list {
252
- list-style: none;
253
- margin: 0;
254
- padding: 0.5rem;
255
- flex: 1;
256
- overflow-y: auto;
257
- }
258
-
259
- .playlist-empty {
260
- padding: 1.5rem 1rem;
261
- text-align: center;
262
- color: #888;
263
- font-size: 0.875rem;
264
- }
265
-
266
- .playlist-item {
267
- border: 1px solid #e4e1dc;
268
- border-radius: 8px;
269
- padding: 0.65rem;
270
- margin-bottom: 0.5rem;
271
- background: #fafaf9;
272
- }
273
-
274
- .playlist-item-thumb {
275
- width: 100%;
276
- aspect-ratio: 16 / 9;
277
- object-fit: cover;
278
- border-radius: 4px;
279
- background: #e4e1dc;
280
- display: block;
281
- margin-bottom: 0.5rem;
282
- }
283
-
284
- .playlist-item-name {
285
- font-size: 0.8rem;
286
- font-weight: 600;
287
- word-break: break-all;
288
- margin-bottom: 0.35rem;
289
- }
290
-
291
- .playlist-item-meta {
292
- font-size: 0.75rem;
293
- color: #666;
294
- margin-bottom: 0.45rem;
295
- }
296
-
297
- .playlist-item-actions {
298
- display: flex;
299
- gap: 0.35rem;
300
- align-items: center;
301
- }
302
-
303
- .playlist-item-actions input[type="number"] {
304
- width: 5rem;
305
- font: inherit;
306
- padding: 0.25rem 0.4rem;
307
- border: 1px solid #d6d2cb;
308
- border-radius: 4px;
309
- }
310
-
311
- .publish-bar {
312
- padding: 1rem 0 0;
313
- }
314
-
315
- #result {
316
- margin: 0;
317
- padding: 0.75rem;
318
- background: #0a0908;
319
- color: #e8e6e3;
320
- border-radius: 8px;
321
- font-size: 0.75rem;
322
- max-height: 10rem;
323
- overflow: auto;
324
- white-space: pre-wrap;
325
- }
326
-
327
- .hidden {
328
- display: none !important;
329
- }
1
+ * {
2
+ box-sizing: border-box;
3
+ }
4
+
5
+ body {
6
+ margin: 0;
7
+ font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
8
+ background: #f4f3f0;
9
+ color: #0a0908;
10
+ }
11
+
12
+ .app-header {
13
+ padding: 1rem 1.5rem;
14
+ background: #0a0908;
15
+ color: #fafaf9;
16
+ }
17
+
18
+ .app-header h1 {
19
+ margin: 0;
20
+ font-size: 1.25rem;
21
+ font-weight: 600;
22
+ }
23
+
24
+ .app-header p {
25
+ margin: 0.35rem 0 0;
26
+ font-size: 0.875rem;
27
+ opacity: 0.8;
28
+ }
29
+
30
+ .layout {
31
+ display: flex;
32
+ gap: 0;
33
+ min-height: calc(100vh - 4.5rem);
34
+ }
35
+
36
+ .panel-main {
37
+ flex: 1;
38
+ padding: 1.25rem 1.5rem 2rem;
39
+ overflow: auto;
40
+ }
41
+
42
+ .panel-playlist {
43
+ width: 320px;
44
+ flex-shrink: 0;
45
+ background: #fff;
46
+ border-left: 1px solid #e4e1dc;
47
+ display: flex;
48
+ flex-direction: column;
49
+ }
50
+
51
+ .card {
52
+ background: #fff;
53
+ border: 1px solid #e4e1dc;
54
+ border-radius: 10px;
55
+ padding: 1rem 1.1rem;
56
+ margin-bottom: 1rem;
57
+ }
58
+
59
+ .card h2 {
60
+ margin: 0 0 0.75rem;
61
+ font-size: 0.95rem;
62
+ font-weight: 600;
63
+ }
64
+
65
+ .hint {
66
+ margin: 0 0 0.75rem;
67
+ font-size: 0.8rem;
68
+ color: #666;
69
+ }
70
+
71
+ .devices-grid {
72
+ display: grid;
73
+ grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
74
+ gap: 0.85rem;
75
+ }
76
+
77
+ .devices-empty {
78
+ margin: 0;
79
+ color: #666;
80
+ font-size: 0.875rem;
81
+ grid-column: 1 / -1;
82
+ }
83
+
84
+ .device-card {
85
+ border: 1px solid #e4e1dc;
86
+ border-radius: 8px;
87
+ padding: 0.85rem 0.95rem;
88
+ background: #fafaf9;
89
+ }
90
+
91
+ .device-card-header {
92
+ display: flex;
93
+ align-items: center;
94
+ gap: 0.5rem;
95
+ margin-bottom: 0.65rem;
96
+ }
97
+
98
+ .device-card-title {
99
+ margin: 0;
100
+ font-size: 0.95rem;
101
+ font-weight: 600;
102
+ line-height: 1.2;
103
+ }
104
+
105
+ .status-led {
106
+ width: 11px;
107
+ height: 11px;
108
+ border-radius: 50%;
109
+ flex-shrink: 0;
110
+ box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.06);
111
+ }
112
+
113
+ .status-led--online {
114
+ background: #12b76a;
115
+ box-shadow: 0 0 8px rgba(18, 183, 106, 0.55);
116
+ }
117
+
118
+ .status-led--offline {
119
+ background: #f04438;
120
+ box-shadow: 0 0 8px rgba(240, 68, 56, 0.45);
121
+ }
122
+
123
+ .device-meta {
124
+ display: grid;
125
+ gap: 0.35rem;
126
+ font-size: 0.78rem;
127
+ color: #444;
128
+ margin-bottom: 0.75rem;
129
+ }
130
+
131
+ .device-meta dt {
132
+ font-weight: 600;
133
+ color: #666;
134
+ display: inline;
135
+ }
136
+
137
+ .device-meta dt::after {
138
+ content: ": ";
139
+ }
140
+
141
+ .device-meta dd {
142
+ display: inline;
143
+ margin: 0;
144
+ word-break: break-all;
145
+ }
146
+
147
+ .device-meta-row {
148
+ display: block;
149
+ }
150
+
151
+ .device-card-actions {
152
+ display: flex;
153
+ flex-wrap: wrap;
154
+ gap: 0.4rem;
155
+ }
156
+
157
+ .device-card-actions button {
158
+ font-size: 0.78rem;
159
+ padding: 0.35rem 0.6rem;
160
+ }
161
+
162
+ .row {
163
+ display: flex;
164
+ flex-wrap: wrap;
165
+ gap: 0.5rem;
166
+ align-items: center;
167
+ }
168
+
169
+ input[type="text"],
170
+ input[type="date"],
171
+ input[type="time"],
172
+ select {
173
+ font: inherit;
174
+ padding: 0.45rem 0.6rem;
175
+ border: 1px solid #d6d2cb;
176
+ border-radius: 6px;
177
+ background: #fff;
178
+ }
179
+
180
+ button {
181
+ font: inherit;
182
+ padding: 0.45rem 0.85rem;
183
+ border-radius: 6px;
184
+ border: 1px solid #d6d2cb;
185
+ background: #fff;
186
+ cursor: pointer;
187
+ }
188
+
189
+ button:hover {
190
+ background: #f5f3ef;
191
+ }
192
+
193
+ button.primary {
194
+ background: #ff8a3d;
195
+ border-color: #e67320;
196
+ color: #0a0908;
197
+ font-weight: 600;
198
+ }
199
+
200
+ button.primary:hover {
201
+ background: #ff9a57;
202
+ }
203
+
204
+ button.danger {
205
+ color: #b42318;
206
+ border-color: #fecdca;
207
+ }
208
+
209
+ .schedule-grid {
210
+ display: grid;
211
+ grid-template-columns: 1fr 1fr;
212
+ gap: 0.65rem 1rem;
213
+ }
214
+
215
+ .schedule-grid label {
216
+ display: flex;
217
+ flex-direction: column;
218
+ gap: 0.25rem;
219
+ font-size: 0.8rem;
220
+ color: #444;
221
+ }
222
+
223
+ .days-row {
224
+ grid-column: 1 / -1;
225
+ display: flex;
226
+ flex-wrap: wrap;
227
+ gap: 0.5rem 0.75rem;
228
+ font-size: 0.8rem;
229
+ }
230
+
231
+ .days-row label {
232
+ flex-direction: row;
233
+ align-items: center;
234
+ gap: 0.35rem;
235
+ color: #0a0908;
236
+ }
237
+
238
+ .playlist-header {
239
+ display: flex;
240
+ align-items: center;
241
+ justify-content: space-between;
242
+ padding: 1rem 1rem 0.75rem;
243
+ border-bottom: 1px solid #e4e1dc;
244
+ }
245
+
246
+ .playlist-header h2 {
247
+ margin: 0;
248
+ font-size: 0.95rem;
249
+ }
250
+
251
+ .playlist-list {
252
+ list-style: none;
253
+ margin: 0;
254
+ padding: 0.5rem;
255
+ flex: 1;
256
+ overflow-y: auto;
257
+ }
258
+
259
+ .playlist-empty {
260
+ padding: 1.5rem 1rem;
261
+ text-align: center;
262
+ color: #888;
263
+ font-size: 0.875rem;
264
+ }
265
+
266
+ .playlist-item {
267
+ border: 1px solid #e4e1dc;
268
+ border-radius: 8px;
269
+ padding: 0.65rem;
270
+ margin-bottom: 0.5rem;
271
+ background: #fafaf9;
272
+ }
273
+
274
+ .playlist-item-thumb {
275
+ width: 100%;
276
+ aspect-ratio: 16 / 9;
277
+ object-fit: cover;
278
+ border-radius: 4px;
279
+ background: #e4e1dc;
280
+ display: block;
281
+ margin-bottom: 0.5rem;
282
+ }
283
+
284
+ .playlist-item-name {
285
+ font-size: 0.8rem;
286
+ font-weight: 600;
287
+ word-break: break-all;
288
+ margin-bottom: 0.35rem;
289
+ }
290
+
291
+ .playlist-item-meta {
292
+ font-size: 0.75rem;
293
+ color: #666;
294
+ margin-bottom: 0.45rem;
295
+ }
296
+
297
+ .playlist-item-actions {
298
+ display: flex;
299
+ gap: 0.35rem;
300
+ align-items: center;
301
+ }
302
+
303
+ .playlist-item-actions input[type="number"] {
304
+ width: 5rem;
305
+ font: inherit;
306
+ padding: 0.25rem 0.4rem;
307
+ border: 1px solid #d6d2cb;
308
+ border-radius: 4px;
309
+ }
310
+
311
+ .publish-bar {
312
+ padding: 1rem 0 0;
313
+ }
314
+
315
+ #result {
316
+ margin: 0;
317
+ padding: 0.75rem;
318
+ background: #0a0908;
319
+ color: #e8e6e3;
320
+ border-radius: 8px;
321
+ font-size: 0.75rem;
322
+ max-height: 10rem;
323
+ overflow: auto;
324
+ white-space: pre-wrap;
325
+ }
326
+
327
+ .hidden {
328
+ display: none !important;
329
+ }