mirror of
https://github.com/Tria-plc/emaui.git
synced 2026-08-26 19:12:50 +00:00
82 lines
3.8 KiB
HTML
82 lines
3.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<link rel="icon" type="image/png" href="/ema-logo.png" />
|
|
<link rel="apple-touch-icon" href="/ema-logo.png" />
|
|
<title>EMA Portal</title>
|
|
<script>
|
|
// Apply the saved Mantine color scheme before paint to avoid a flash.
|
|
try {
|
|
var s = localStorage.getItem('mantine-color-scheme-value') || 'light';
|
|
document.documentElement.setAttribute('data-mantine-color-scheme', s);
|
|
} catch (e) {}
|
|
</script>
|
|
<style>
|
|
/* Boot splash — shown until React mounts into #root. Colors are
|
|
hardcoded (not CSS vars from portal.css) so the splash never depends
|
|
on the app's own stylesheet finishing its load. */
|
|
#ema-boot-splash {
|
|
position: fixed;
|
|
inset: 0;
|
|
z-index: 9999;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #f5f8fc;
|
|
}
|
|
html[data-mantine-color-scheme='dark'] #ema-boot-splash {
|
|
background: #0e1521;
|
|
}
|
|
#ema-boot-splash svg {
|
|
width: 140px;
|
|
height: auto;
|
|
color: #3160b7;
|
|
animation: ema-boot-pulse 1.6s ease-in-out infinite;
|
|
}
|
|
@keyframes ema-boot-pulse {
|
|
0%, 100% { opacity: 1; }
|
|
50% { opacity: 0.55; }
|
|
}
|
|
@media (prefers-reduced-motion: reduce) {
|
|
#ema-boot-splash svg { animation: none; }
|
|
}
|
|
/* React has committed into #root once it has a child; hide the splash. */
|
|
#root:not(:empty) ~ #ema-boot-splash {
|
|
display: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<!--
|
|
Static boot splash. Kept intentionally minimal (hull, funnel, mast,
|
|
flag — no cargo containers, no animated water) since this markup can't
|
|
import React. Source of truth for the full animated version is
|
|
libs/ui/src/lib/components/MaritimeLoader.tsx.
|
|
-->
|
|
<div id="ema-boot-splash" role="status" aria-live="polite" aria-label="Loading">
|
|
<svg viewBox="0 0 260 138" aria-hidden="true" focusable="false">
|
|
<ellipse cx="132" cy="113" rx="78" ry="7" fill="currentColor" opacity="0.12" />
|
|
<path d="M42 72H214l-4 6H48z" fill="currentColor" opacity="0.82" />
|
|
<path d="M166 25h10l3 17h-15z" fill="#eef3f5" stroke="currentColor" stroke-width="2" stroke-linejoin="round" />
|
|
<path d="M166.9 29h9.9l.6 3.5h-11.1z" fill="#078930" />
|
|
<path d="M166.2 32.5h11.2l.6 3.5h-12.4z" fill="#fcd116" />
|
|
<path d="M165.6 36h12.4l.6 3.5h-13.6z" fill="#da121a" />
|
|
<path d="M194 31V12M188 20h12M194 13l11 8M194 13l-9 8" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" />
|
|
<circle cx="194" cy="11" r="2" fill="currentColor" />
|
|
<path d="M184 20V8" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" />
|
|
<path d="M184 8c7-3 11 3 18 0v4c-7 3-11-3-18 0z" fill="#078930" />
|
|
<path d="M184 12c7-3 11 3 18 0v4c-7 3-11-3-18 0z" fill="#fcd116" />
|
|
<path d="M184 16c7-3 11 3 18 0v4c-7 3-11-3-18 0z" fill="#da121a" />
|
|
<path d="M28 76h205l-15 18c-8 10-20 15-33 15H66c-13 0-24-5-31-15L23 80c-2-2 0-4 5-4z" fill="#f8fbfc" stroke="currentColor" stroke-width="1.4" stroke-linejoin="round" />
|
|
<path d="M34 88h190l-6 6c-8 10-20 15-33 15H66c-13 0-24-5-31-15z" fill="currentColor" opacity="0.92" />
|
|
<path d="M36 87h188" fill="none" stroke="rgb(255 255 255 / 52%)" stroke-width="2.4" stroke-linecap="round" />
|
|
<path d="M206 81l15 1-8 9" fill="none" stroke="rgb(255 255 255 / 46%)" stroke-width="2.3" stroke-linecap="round" stroke-linejoin="round" />
|
|
</svg>
|
|
</div>
|
|
<script type="module" src="/src/main.tsx"></script>
|
|
</body>
|
|
</html>
|