a9daa5bnumbl figure viewer: upload a numbl .h5 figure and render it via numbl/graphicsJeremy Magland 1:root {
2 font-family: system-ui, -apple-system, sans-serif;
3 color: #1a1a1a;
4 background: #fafafa;
5}
7* {
8 box-sizing: border-box;
9}
11body {
12 margin: 0;
13}
15.app {
16 max-width: 960px;
17 margin: 0 auto;
18 padding: 24px 16px 48px;
19}
21header h1 {
22 margin: 0 0 4px;
23 font-size: 1.5rem;
24}
26.sub {
27 margin: 0 0 20px;
28 color: #555;
29 font-size: 0.9rem;
30}
32.dropzone {
33 border: 2px dashed #bbb;
34 border-radius: 8px;
35 padding: 36px 16px;
36 text-align: center;
37 color: #666;
38 cursor: pointer;
39 background: #fff;
40 transition:
41 border-color 0.15s,
42 background 0.15s;
43}
45.dropzone:hover,
46.dropzone.over {
47 border-color: #4a90d9;
48 background: #f0f7ff;
49}
51.actions {
52 margin-top: 12px;
53}
55.actions button {
56 font: inherit;
57 font-size: 0.85rem;
58 padding: 6px 14px;
59 border: 1px solid #c8c8c8;
60 border-radius: 6px;
61 background: #fff;
62 cursor: pointer;
63}
65.actions button:hover:not(:disabled) {
66 border-color: #4a90d9;
67 color: #1a5fa8;
68}
70.actions button:disabled {
71 opacity: 0.5;
72 cursor: default;
73}
75.error {
76 margin-top: 16px;
77 padding: 10px 14px;
78 border-radius: 6px;
79 background: #fdecea;
80 color: #a12;
81 font-size: 0.9rem;
82}
84.figure-wrap {
85 margin-top: 20px;
86 background: #fff;
87 border: 1px solid #e2e2e2;
88 border-radius: 8px;
89 padding: 8px;
90}
92/* FigureView fills its positioned parent, mirroring the numbl plot viewer. */
93.figure-inner {
94 position: relative;
95 width: 100%;
96 height: 70vh;
97 min-height: 420px;
98}