Update app.css and ViewportCanvas.tsx for WebGL fallback handling

2026-03-31 01:38:24 +02:00
parent f13c5852b8
commit d2e45e525b
2 changed files with 58 additions and 9 deletions
--- a/src/app/app.css
+++ b/src/app/app.css
@@ -290,6 +290,27 @@ button:disabled {
  height: 100%;
 }

+.viewport-canvas__fallback {
+  position: absolute;
+  inset: 18px;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end;
+  gap: 8px;
+  padding: 18px;
+  color: #f3e8da;
+  background: linear-gradient(180deg, rgba(8, 10, 14, 0.12) 0%, rgba(8, 10, 14, 0.58) 100%);
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  border-radius: 18px;
+}
+
+.viewport-canvas__fallback-title {
+  font-size: 0.78rem;
+  font-weight: 700;
+  letter-spacing: 0.14em;
+  text-transform: uppercase;
+}
+
 .status-bar {
  display: flex;
  align-items: center;