diff --git a/app/static/css/style.css b/app/static/css/style.css index 1b0e993..30fd1f8 100644 --- a/app/static/css/style.css +++ b/app/static/css/style.css @@ -46,6 +46,7 @@ * { box-sizing: border-box; + -webkit-tap-highlight-color: transparent; } [x-cloak] { @@ -56,6 +57,7 @@ html, body { margin: 0; padding: 0; + overscroll-behavior-y: none; } body { @@ -239,6 +241,7 @@ p { text-decoration: none; color: var(--color-text-muted); font-size: 11px; + touch-action: manipulation; } .bottom-tab-bar .tab-item svg { @@ -277,6 +280,7 @@ p { cursor: pointer; font-family: inherit; transition: background-color 0.15s ease, opacity 0.15s ease; + touch-action: manipulation; } .btn-primary { @@ -452,6 +456,7 @@ label { gap: 8px var(--space-2); padding: 12px 4px; border-bottom: 1px solid var(--color-border); + touch-action: manipulation; } .habit-item:last-child { diff --git a/app/static/icons/icon-apple-180.png b/app/static/icons/icon-apple-180.png new file mode 100644 index 0000000..f85dc10 Binary files /dev/null and b/app/static/icons/icon-apple-180.png differ diff --git a/app/static/offline.html b/app/static/offline.html new file mode 100644 index 0000000..ea8c3ac --- /dev/null +++ b/app/static/offline.html @@ -0,0 +1,23 @@ + + + + + + 오프라인 - 습관 트래커 + + + + +
+
+

+ 오프라인 상태예요. 이 화면은 아직 캐시에 저장되지 않았어요. +

+

+ 네트워크 연결을 확인한 뒤 다시 시도해주세요. +

+ +
+
+ + diff --git a/app/static/service-worker.js b/app/static/service-worker.js index 1da5d7e..7f4c777 100644 --- a/app/static/service-worker.js +++ b/app/static/service-worker.js @@ -1,4 +1,4 @@ -const CACHE_NAME = "habit-tracker-v3"; +const CACHE_NAME = "habit-tracker-v4"; const APP_SHELL = [ "/static/css/style.css", "/static/js/app.js", @@ -9,7 +9,9 @@ const APP_SHELL = [ "/static/js/vendor/sortable.min.js", "/static/icons/icon-192.png", "/static/icons/icon-512.png", + "/static/icons/icon-apple-180.png", "/static/manifest.json", + "/static/offline.html", ]; self.addEventListener("install", (event) => { @@ -50,7 +52,7 @@ self.addEventListener("fetch", (event) => { } return response; }) - .catch(() => caches.match(request)) + .catch(() => caches.match(request).then((cached) => cached || caches.match("/static/offline.html"))) ); return; } diff --git a/app/templates/base.html b/app/templates/base.html index 2e0d1d3..d3019d1 100644 --- a/app/templates/base.html +++ b/app/templates/base.html @@ -6,10 +6,12 @@ {% block title %}습관 트래커{% endblock %} - + + + @@ -37,6 +39,7 @@ {% if current_user %}
+ {% if account_level %}Lv.{{ account_level.level }}{% endif %} {{ current_user.name or current_user.email }}
diff --git a/scripts/generate_icons.py b/scripts/generate_icons.py index b72137b..9a5dcd0 100644 --- a/scripts/generate_icons.py +++ b/scripts/generate_icons.py @@ -43,6 +43,8 @@ def main() -> None: draw_icon(512).save(OUT_DIR / "icon-512.png") # 배경이 전체를 채우고 체크마크가 중앙 58%에만 있어 마스커블 세이프존(중앙 80%)을 만족한다. draw_icon(512).save(OUT_DIR / "icon-maskable-512.png") + # iOS apple-touch-icon 권장 사이즈(180x180) — 192px를 그대로 쓰면 iOS가 다운스케일한다. + draw_icon(180).save(OUT_DIR / "icon-apple-180.png") print(f"generated icons in {OUT_DIR}")