agomizi1cmandClaude Opus 5.5
ed5617a47a
iOS Safari ignores user-scalable=no, so zoom is blocked in three layers: - viewport meta: maximum-scale=1, user-scalable=no on every page (covers Android, home-screen apps and iOS focus zoom on inputs) - CSS: touch-action: pan-x pan-y on html, so scrolling still works but pinch and double-tap zoom do not - JS (fluid.js): cancel Safari's gesture* events and two-finger touchmove Double-tap is left to CSS rather than JS so rapid repeated taps on buttons still register as clicks. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
41 lines
1.9 KiB
HTML
41 lines
1.9 KiB
HTML
<!doctype html>
|
|
<html lang="ja">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover">
|
|
<meta name="theme-color" media="(prefers-color-scheme: light)" content="#f2f2f7">
|
|
<meta name="theme-color" media="(prefers-color-scheme: dark)" content="#000000">
|
|
<meta name="robots" content="noindex, nofollow">
|
|
<title>Hold'em Night</title>
|
|
<link rel="icon" href="/assets/favicon.ico">
|
|
<link rel="stylesheet" href="/assets/style.css">
|
|
</head>
|
|
<body class="page-key">
|
|
<main class="key-screen">
|
|
<div class="app-mark" aria-hidden="true">
|
|
<svg viewBox="0 0 24 24"><path d="M12 2.2c-2.3 3.1-7.6 6.3-7.6 10.4a4.1 4.1 0 0 0 7 2.9c-.1 2.3-1 4-2.6 5.3h6.4c-1.6-1.3-2.5-3-2.6-5.3a4.1 4.1 0 0 0 7-2.9c0-4.1-5.3-7.3-7.6-10.4z"/></svg>
|
|
</div>
|
|
<h1 class="brand">Hold'em Night</h1>
|
|
<p class="brand-sub">PRIVATE CLUB</p>
|
|
|
|
<form id="form" class="key-form" autocomplete="off">
|
|
<h2 class="key-title" id="key-title">参加キーを入力</h2>
|
|
<p class="key-hint" id="key-hint">オーナーから教えてもらった6桁の数字</p>
|
|
<div class="key-inputs" id="digits">
|
|
<input type="tel" inputmode="numeric" aria-label="1桁目" autocomplete="one-time-code">
|
|
<input type="tel" inputmode="numeric" aria-label="2桁目">
|
|
<input type="tel" inputmode="numeric" aria-label="3桁目">
|
|
<input type="tel" inputmode="numeric" aria-label="4桁目">
|
|
<input type="tel" inputmode="numeric" aria-label="5桁目">
|
|
<input type="tel" inputmode="numeric" aria-label="6桁目">
|
|
</div>
|
|
<p class="error-text" id="error" role="alert"></p>
|
|
<button class="btn btn-tint btn-lg btn-block" id="submit" type="submit">入室する</button>
|
|
</form>
|
|
</main>
|
|
<script src="/assets/fluid.js"></script>
|
|
<script src="/assets/common.js"></script>
|
|
<script src="/assets/key.js"></script>
|
|
</body>
|
|
</html>
|