@a2f0/skyline 0.2.33 → 0.2.34
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/docs/package.md +3 -3
- package/package.json +1 -1
- package/site/viewer.css +16 -1
package/docs/package.md
CHANGED
|
@@ -148,9 +148,9 @@ styles and the host's apart. `mountSkyline` returns at once with an instance:
|
|
|
148
148
|
frame, the viewer doesn't stop when its element merely leaves the page: always call
|
|
149
149
|
`destroy`.
|
|
150
150
|
|
|
151
|
-
The viewer shows what the embedded viewer always has: the
|
|
152
|
-
|
|
153
|
-
credit, a small **show original** button until the first 3D frame (and again if the
|
|
151
|
+
The viewer shows what the embedded viewer always has: the traced loading silhouette,
|
|
152
|
+
the 3D skyline with its control bar, the twinkling stars, which come out after the
|
|
153
|
+
skyline's first frame, the OpenStreetMap credit, a small **show original** button until the first 3D frame (and again if the
|
|
154
154
|
graphics context is lost), so the original drawing stays reachable even if WebGL or
|
|
155
155
|
the scene's code cannot load, building details in a panel over the skyline, and
|
|
156
156
|
reduced motion. `F`, pressed inside the viewer, shows its element fullscreen.
|
package/package.json
CHANGED
package/site/viewer.css
CHANGED
|
@@ -30,16 +30,31 @@
|
|
|
30
30
|
background: transparent;
|
|
31
31
|
}
|
|
32
32
|
|
|
33
|
+
/* The stars come out after the skyline, in either theme: hidden while the scene boots, or
|
|
34
|
+
once its graphics context is lost, they fade in after its first frame, or, with reduced
|
|
35
|
+
motion, simply appear. The original drawing shows them as soon as it is opened. */
|
|
33
36
|
.stars {
|
|
34
37
|
z-index: 0;
|
|
35
38
|
pointer-events: none;
|
|
39
|
+
transition: opacity 1.6s ease-in-out 0.4s;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.skyline-viewer[data-booting] > .stars {
|
|
43
|
+
visibility: hidden;
|
|
44
|
+
opacity: 0;
|
|
45
|
+
transition: none;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.skyline-viewer:has(> .drawing:not([hidden])) > .stars { transition: none; }
|
|
49
|
+
|
|
50
|
+
@media (prefers-reduced-motion: reduce) {
|
|
51
|
+
.stars { transition: none; }
|
|
36
52
|
}
|
|
37
53
|
|
|
38
54
|
/* Keep this boot palette in sync with skyline-shell.ts and index.html. It gives
|
|
39
55
|
way to the scene's own sky at the first frame. The original drawing always
|
|
40
56
|
keeps its dark sky, including when opened during loading or after a failure. */
|
|
41
57
|
.skyline-viewer[data-theme="light"][data-booting] { color-scheme: light; background: #f5f5f5; color: #444; }
|
|
42
|
-
.skyline-viewer[data-theme="light"][data-booting] > .stars { visibility: hidden; }
|
|
43
58
|
.skyline-viewer[data-theme="light"][data-booting] .loading { color: #444; }
|
|
44
59
|
.skyline-viewer[data-theme="light"][data-booting] .skyline-trace { stroke: #555; }
|
|
45
60
|
.skyline-viewer[data-theme="light"][data-booting] .skyline-trace-tip { stroke: #222; filter: drop-shadow(0 0 9px #22222266); }
|