ninelands-reddit/scripts/capture/capture.html
Lukas Müllner 426776ee77 feat: Aufnahme der Katalog-Assets (Video, GIF, Standbild, Kachel)
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-11-13 17:20:40 +01:00

66 lines
1.6 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ninelands capture</title>
<link rel="stylesheet" href="capture.css">
<style>
body {
display: grid;
place-items: center;
height: 100vh;
overflow: hidden;
}
#board {
height: 94vh;
aspect-ratio: 1 / 1;
}
/* Kachel: Ausschnitt des Bretts mit Schriftzug */
body.tile #board {
height: auto;
width: 100vw;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
#logo {
display: none;
}
body.tile #logo {
display: block;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
font-family: var(--font-pixel);
font-weight: 700;
font-size: 72px;
color: var(--px-gold);
background: var(--px-ink);
padding: 6px 28px 10px;
border: 6px solid var(--px-gold-dark);
text-shadow: 4px 4px 0 #000;
letter-spacing: 0.04em;
white-space: nowrap;
}
</style>
</head>
<body>
<svg width="0" height="0" style="position: absolute" aria-hidden="true">
<symbol id="i-warn" viewBox="0 0 24 24">
<g
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M12 3 2 20h20zM12 10v4M12 17v.5" />
</g>
</symbol>
</svg>
<div id="board"></div>
<div id="logo">Ninelands</div>
<script src="capture.js" type="module"></script>
</body>
</html>