94 lines
4.5 KiB
HTML
94 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="ja" data-app-id="APP_ID">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="robots" content="noindex, nofollow">
|
|
<script>
|
|
(function () {
|
|
var t = localStorage.getItem('APP_ID-theme') || 'system';
|
|
var dark = t === 'dark' || (t === 'system' && matchMedia('(prefers-color-scheme:dark)').matches);
|
|
document.documentElement.setAttribute('data-theme', dark ? 'dark' : 'light');
|
|
document.documentElement.setAttribute('data-theme-pref', t);
|
|
})();
|
|
</script>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
|
|
<meta name="description" content="APP_DESCRIPTION">
|
|
<meta name="color-scheme" content="dark light">
|
|
<meta name="theme-color" content="#0D0D0D" media="(prefers-color-scheme: dark)">
|
|
<meta name="theme-color" content="#F9FAFB" media="(prefers-color-scheme: light)">
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-capable" content="yes">
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
|
<meta name="apple-mobile-web-app-title" content="APP_NAME">
|
|
<link rel="manifest" href="/manifest.json">
|
|
<link rel="icon" type="image/png" href="/logo.png">
|
|
<link rel="apple-touch-icon" href="/logo.png">
|
|
<title>APP_NAME</title>
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://posimai-ui.vercel.app/v1/base.css">
|
|
<script src="https://unpkg.com/lucide@0.344.0/dist/umd/lucide.min.js"></script>
|
|
|
|
<style>
|
|
/* ── APP-SPECIFIC STYLES: ここにアプリ固有のスタイルを追加 ── */
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<a href="#main-content" class="skip-link" tabindex="0" style="position:absolute;top:-100%;left:8px;background:var(--accent);color:#0D0D0D;padding:8px 16px;border-radius:8px;font-weight:600;font-size:13px;z-index:10000;text-decoration:none">コンテンツへスキップ</a>
|
|
|
|
<!-- Settings panel -->
|
|
<aside class="settings-panel" id="settingsPanel" role="complementary">
|
|
<div class="settings-panel-header">
|
|
<span class="settings-panel-title">設定</span>
|
|
<button class="icon-btn" id="settingsCloseBtn" aria-label="設定を閉じる">
|
|
<i data-lucide="x" style="width:18px;height:18px;stroke-width:1.75"></i>
|
|
</button>
|
|
</div>
|
|
<div class="settings-panel-body">
|
|
<div>
|
|
<div class="settings-group-label">外観</div>
|
|
<div class="settings-item">
|
|
<div class="settings-item-label">テーマ</div>
|
|
<div class="theme-selector">
|
|
<button class="theme-btn" data-theme-val="dark"><i data-lucide="moon" style="width:12px;height:12px;stroke-width:1.75"></i>ダーク</button>
|
|
<button class="theme-btn" data-theme-val="light"><i data-lucide="sun" style="width:12px;height:12px;stroke-width:1.75"></i>ライト</button>
|
|
<button class="theme-btn" data-theme-val="system"><i data-lucide="monitor" style="width:12px;height:12px;stroke-width:1.75"></i>自動</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
<div class="overlay" id="overlay" aria-hidden="true"></div>
|
|
|
|
<header class="header">
|
|
<div class="header-brand">
|
|
<div class="header-dot" aria-hidden="true"></div>
|
|
<span class="header-title">APP_NAME</span>
|
|
</div>
|
|
<button class="icon-btn" id="settingsBtn" aria-label="設定" aria-expanded="false">
|
|
<i data-lucide="settings" style="width:18px;height:18px;stroke-width:1.5"></i>
|
|
</button>
|
|
</header>
|
|
|
|
<main id="main-content">
|
|
<!-- ── APP-SPECIFIC HTML: ここにアプリ固有のコンテンツを追加 ── -->
|
|
|
|
<!-- Empty state placeholder — アプリ実装時に削除 -->
|
|
<div style="text-align:center;padding:80px 24px;color:var(--text3);">
|
|
<i data-lucide="box" style="width:40px;height:40px;stroke-width:1.25;margin-bottom:12px;display:block;margin-inline:auto;opacity:.5"></i>
|
|
<div style="font-size:14px;font-weight:500;">APP_NAME</div>
|
|
<div style="font-size:13px;margin-top:4px;">APP_DESCRIPTION</div>
|
|
</div>
|
|
</main>
|
|
|
|
<div id="toast" role="status" aria-live="polite"></div>
|
|
|
|
<script src="https://posimai-ui.vercel.app/v1/base.js" defer></script>
|
|
<script defer>
|
|
// ── APP-SPECIFIC JS: ここにアプリ固有のロジックを追加 ──
|
|
</script>
|
|
</body>
|
|
</html>
|