From ecc16520bea0acaf64e916288902f433640d8e9c Mon Sep 17 00:00:00 2001
From: projectdx <com114@gmail.com>
Date: Mon, 12 Jan 2026 21:32:24 +0900
Subject: [PATCH] Add horizontal scroll hint (fade) to mobile menus (v0.7.6)

---
 README.md                    |  6 ++++++
 info.yaml                    |  2 +-
 static/css/mobile_custom.css | 36 +++++++++++++++++++++++++++++++++---
 3 files changed, 40 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 209d75c..eb26861 100644
--- a/README.md
+++ b/README.md
@@ -84,6 +84,12 @@
 
 ## 📝 변경 이력 (Changelog)
 
+### v0.7.6 (2026-01-12)
+- **모바일 상단 메뉴 스크롤 힌트 도입**: 
+    - 메뉴가 가로로 길어질 때 우측에 은은한 페이드 효과를 추가하여 '더 많은 메뉴'가 있음을 직관적으로 알 수 있도록 개선했습니다.
+    - 아주 가늘고 투명한 스크롤바 가이드를 추가하여 모던한 감성을 더했습니다.
+    - CSS 구문 최적화 및 미디어 쿼리 중복을 정리했습니다.
+
 ### v0.7.5 (2026-01-12)
 - **모바일 레이아웃 가로 핏 완벽 최적화**: 
     - 화면이 70%만 보이고 오른쪽으로 밀리던 현상을 해결하기 위해 전역적인 너비 정규화(`width: 100%`)와 오버플로우 차단을 적용했습니다.
diff --git a/info.yaml b/info.yaml
index 6bc5039..16f678d 100644
--- a/info.yaml
+++ b/info.yaml
@@ -1,5 +1,5 @@
 title: "애니 다운로더"
-version: 0.7.5
+version: 0.7.6
 package_name: "anime_downloader"
 developer: "projectdx"
 description: "anime downloader"
diff --git a/static/css/mobile_custom.css b/static/css/mobile_custom.css
index 88b8e38..5492974 100644
--- a/static/css/mobile_custom.css
+++ b/static/css/mobile_custom.css
@@ -107,7 +107,27 @@
         margin: 0 !important;
     }
     
-    /* Global Navigation Pills Fix */
+    /* Scroll Hint Container Fix */
+    #menu_module_div, #menu_page_div {
+        position: relative;
+        width: 100% !important;
+        overflow: hidden;
+    }
+
+    /* Gradient Hint to indicate more items (Scroll Hint) */
+    #menu_module_div::after, #menu_page_div::after {
+        content: '';
+        position: absolute;
+        top: 4px; bottom: 4px; right: 0;
+        width: 40px;
+        background: linear-gradient(to right, transparent, rgba(30, 41, 59, 0.9));
+        pointer-events: none;
+        z-index: 10;
+        border-top-right-radius: 8px;
+        border-bottom-right-radius: 8px;
+    }
+
+    /* Navigation Pills Styling */
     ul.nav.nav-pills.bg-light {
         background-color: rgba(30, 41, 59, 0.6) !important;
         backdrop-filter: blur(10px);
@@ -123,7 +143,17 @@
         max-width: 100% !important;
         box-sizing: border-box !important;
         margin-top: 2px !important;
-        justify-content: flex-start !important; /* Critical for scrollable access */
+        justify-content: flex-start !important;
+        scrollbar-width: thin; /* Firefox */
+    }
+
+    /* Subtle scrollbar hint for mobile */
+    ul.nav.nav-pills.bg-light::-webkit-scrollbar {
+        height: 3px;
+    }
+    ul.nav.nav-pills.bg-light::-webkit-scrollbar-thumb {
+        background: rgba(255, 255, 255, 0.15);
+        border-radius: 10px;
     }
 
     ul.nav.nav-pills .nav-item {
@@ -132,7 +162,7 @@
 
     ul.nav.nav-pills .nav-link {
         border-radius: 6px !important;
-        padding: 6px 12px !important;
+        padding: 6px 14px !important;
         color: #94a3b8 !important;
         font-weight: 600;
         transition: all 0.3s ease;