[Perl] DAQ system for the FAPG.
Increase dashboard mobile friendliness.
roles/dashboard/public/css/app.css
@@ -156,6 +156,7 @@
156
156
.tab-button {
157
157
border: 1px solid var(--border);
158
158
border-radius: 999px;
159
Added:
min-height: 2.75rem;
159
160
padding: 0.6rem 1rem;
160
161
background: white;
161
162
color: var(--text);
@@ -217,6 +218,7 @@
217
218
218
219
.timeframe-button {
219
220
min-width: 4.75rem;
221
Added:
min-height: 2.75rem;
220
222
border: 0;
221
223
border-left: 1px solid var(--border);
222
224
padding: 0.45rem 0.75rem;
@@ -279,6 +281,7 @@
279
281
280
282
.message-table-wrap {
281
283
overflow-x: auto;
284
Added:
-webkit-overflow-scrolling: touch;
282
285
border: 1px solid var(--border);
283
286
border-radius: 0.5rem;
284
287
}
@@ -315,15 +318,54 @@
315
318
margin: 1rem auto;
316
319
}
317
320
321
Added:
.page-header {
322
Added:
margin-bottom: 1rem;
323
Added:
}
324
Added:
325
Added:
.page-header h1 {
326
Added:
font-size: 1.75rem;
327
Added:
}
328
Added:
329
Added:
.status-pill-list {
330
Added:
display: grid;
331
Added:
grid-template-columns: 1fr 1fr;
332
Added:
}
333
Added:
334
Added:
.status-pill-list li {
335
Added:
min-width: 0;
336
Added:
}
337
Added:
338
Added:
.status-pill {
339
Added:
flex-wrap: wrap;
340
Added:
width: 100%;
341
Added:
min-width: 0;
342
Added:
min-height: 2.75rem;
343
Added:
padding-inline: 0.65rem;
344
Added:
text-align: center;
345
Added:
white-space: normal;
346
Added:
}
347
Added:
318
348
.tabs {
319
349
display: grid;
320
350
grid-template-columns: 1fr 1fr;
351
Added:
gap: 0.45rem;
352
Added:
padding: 0.75rem;
321
353
}
322
354
355
Added:
.tab-button {
356
Added:
width: 100%;
357
Added:
border-radius: 0.5rem;
358
Added:
padding-inline: 0.65rem;
359
Added:
}
360
Added:
323
361
.panel-heading {
324
362
display: block;
325
363
}
326
364
365
Added:
.tab-panel {
366
Added:
padding: 1rem;
367
Added:
}
368
Added:
327
369
.panel-tools {
328
370
justify-content: flex-start;
329
371
margin-top: 0.75rem;
@@ -351,6 +393,7 @@
351
393
352
394
.smoothing-control {
353
395
width: 100%;
396
Added:
min-height: 2.75rem;
354
397
}
355
398
356
399
.section-heading {
@@ -359,5 +402,33 @@
359
402
360
403
.chart-wrap {
361
404
min-height: 320px;
405
Added:
}
406
Added:
407
Added:
.reading-status {
408
Added:
overflow-wrap: anywhere;
409
Added:
}
410
Added:
411
Added:
.message-log h3 {
412
Added:
font-size: 0.95rem;
413
Added:
}
414
Added:
415
Added:
.message-table {
416
Added:
min-width: 560px;
417
Added:
}
418
Added:
419
Added:
.message-table th,
420
Added:
.message-table td {
421
Added:
padding: 0.65rem 0.7rem;
422
Added:
}
423
Added:
}
424
Added:
425
Added:
@media (max-width: 380px) {
426
Added:
.status-pill-list {
427
Added:
grid-template-columns: 1fr;
428
Added:
}
429
Added:
430
Added:
.timeframe-button {
431
Added:
min-width: 0;
432
Added:
padding-inline: 0.5rem;
362
433
}
363
434
}