Add offline.html served by the service worker when a never-visited route is requested without network. Disable rubber-band overscroll bounce and gray tap highlights so standalone mode feels less like a webview. Split theme-color by prefers-color-scheme so the iOS status bar matches dark mode, and add a proper 180x180 apple-touch-icon instead of downscaling the 192px icon.
69 lines
3.6 KiB
HTML
69 lines
3.6 KiB
HTML
<!doctype html>
|
|
<html lang="ko">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
|
|
<title>{% block title %}습관 트래커{% endblock %}</title>
|
|
|
|
<link rel="manifest" href="/static/manifest.json" />
|
|
<meta name="theme-color" content="#d97757" media="(prefers-color-scheme: light)" />
|
|
<meta name="theme-color" content="#e08962" media="(prefers-color-scheme: dark)" />
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
|
|
<meta name="apple-mobile-web-app-title" content="습관 트래커" />
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/static/icons/icon-apple-180.png" />
|
|
<link rel="apple-touch-icon" href="/static/icons/icon-192.png" />
|
|
<link rel="icon" href="/static/icons/icon-192.png" />
|
|
|
|
<link rel="stylesheet" href="/static/css/style.css" />
|
|
<script src="/static/js/vendor/htmx.min.js" defer></script>
|
|
<script src="/static/js/push-register.js" defer></script>
|
|
<script src="/static/js/vendor/sortable.min.js" defer></script>
|
|
<script src="/static/js/habit-reorder.js" defer></script>
|
|
<script src="/static/js/vendor/alpine.min.js" defer></script>
|
|
<script src="/static/js/app.js" defer></script>
|
|
</head>
|
|
<body>
|
|
<div class="app-shell{% block shell_class %}{% endblock %}">
|
|
{% if logged_in %}
|
|
<div id="ios-install-banner" class="ios-install-banner">
|
|
<span>홈 화면에 추가하면 알림도 받을 수 있어요. 공유 버튼 → ‘홈 화면에 추가’를 눌러보세요.</span>
|
|
<button type="button" onclick="dismissIosInstallBanner()" aria-label="닫기">×</button>
|
|
</div>
|
|
<nav class="top-nav">
|
|
<span class="brand">습관 트래커</span>
|
|
<div class="nav-links">
|
|
<a href="/today" class="{% block nav_today %}{% endblock %}">오늘</a>
|
|
<a href="/habits" class="{% block nav_habits %}{% endblock %}">습관 관리</a>
|
|
<a href="/history" class="{% block nav_history %}{% endblock %}">기록</a>
|
|
</div>
|
|
{% if current_user %}
|
|
<div class="nav-user">
|
|
{% if account_level %}<span class="nav-level-pill">Lv.{{ account_level.level }}</span>{% endif %}
|
|
<span>{{ current_user.name or current_user.email }}</span>
|
|
<form method="post" action="/auth/logout">
|
|
<button type="submit" class="btn-link">로그아웃</button>
|
|
</form>
|
|
</div>
|
|
{% endif %}
|
|
</nav>
|
|
<nav class="bottom-tab-bar">
|
|
<a href="/today" class="tab-item {{ self.nav_today() }}">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="9" /><path d="M8 12l3 3 5-6" /></svg>
|
|
<span>오늘</span>
|
|
</a>
|
|
<a href="/habits" class="tab-item {{ self.nav_habits() }}">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="4" y1="6" x2="20" y2="6" /><line x1="4" y1="12" x2="20" y2="12" /><line x1="4" y1="18" x2="20" y2="18" /></svg>
|
|
<span>습관 관리</span>
|
|
</a>
|
|
<a href="/history" class="tab-item {{ self.nav_history() }}">
|
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="5" width="18" height="16" rx="2" /><line x1="3" y1="10" x2="21" y2="10" /><line x1="8" y1="3" x2="8" y2="7" /><line x1="16" y1="3" x2="16" y2="7" /></svg>
|
|
<span>기록</span>
|
|
</a>
|
|
</nav>
|
|
{% endif %}
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
</body>
|
|
</html>
|