fix: フレックス内スクロール復元(#main に min-height:0、#app をビューポート高に固定)
Made-with: Cursor
This commit is contained in:
parent
ffedf3cff2
commit
9812dc601c
10
index.html
10
index.html
|
|
@ -70,7 +70,7 @@
|
|||
}
|
||||
html{height:100%}
|
||||
html,body{background:var(--bg);color:var(--text);font-family:'Geist',sans-serif;overflow:hidden}
|
||||
body{min-height:100%;min-height:-webkit-fill-available}
|
||||
body{min-height:100%;min-height:-webkit-fill-available;height:100%}
|
||||
|
||||
.aurora{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:0}
|
||||
.aurora-blob{position:absolute;border-radius:50%;will-change:transform}
|
||||
|
|
@ -82,7 +82,7 @@ body{min-height:100%;min-height:-webkit-fill-available}
|
|||
@keyframes ab3{from{transform:translate(0,0) scale(1)}to{transform:translate(-50px,60px) scale(0.93)}}
|
||||
[data-theme="light"] .aurora-blob{opacity:0.35}
|
||||
|
||||
#app{position:relative;z-index:1;box-sizing:border-box;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left)}
|
||||
#app{position:relative;z-index:1;box-sizing:border-box;height:100vh;height:100dvh;max-height:100dvh;display:flex;flex-direction:column;min-height:0;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left)}
|
||||
|
||||
/* Header */
|
||||
header{display:flex;align-items:center;justify-content:space-between;padding:0 16px;height:52px;border-bottom:1px solid var(--border);background:rgba(12,18,33,0.75);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);flex-shrink:0}
|
||||
|
|
@ -95,10 +95,10 @@ header{display:flex;align-items:center;justify-content:space-between;padding:0 1
|
|||
.icon-btn:hover{color:var(--accent);border-color:var(--accent-border)}
|
||||
|
||||
/* Body */
|
||||
#body{flex:1;display:flex;overflow:hidden}
|
||||
#body{flex:1;min-height:0;display:flex;overflow:hidden}
|
||||
|
||||
/* Sidebar */
|
||||
#sidebar{width:240px;flex-shrink:0;border-right:1px solid var(--border);overflow-y:auto;background:rgba(12,18,33,0.5);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;flex-direction:column}
|
||||
#sidebar{width:240px;flex-shrink:0;min-height:0;border-right:1px solid var(--border);overflow-y:auto;-webkit-overflow-scrolling:touch;background:rgba(12,18,33,0.5);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;flex-direction:column}
|
||||
[data-theme="light"] #sidebar{background:rgba(239,246,255,0.6)}
|
||||
.sidebar-search{padding:10px 12px;border-bottom:1px solid var(--border)}
|
||||
.search-wrap{position:relative}
|
||||
|
|
@ -123,7 +123,7 @@ header{display:flex;align-items:center;justify-content:space-between;padding:0 1
|
|||
.sidebar-item.done .item-check{opacity:1}
|
||||
|
||||
/* Main */
|
||||
#main{flex:1;overflow-y:auto;padding:24px 28px}
|
||||
#main{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:24px 28px;touch-action:pan-y}
|
||||
|
||||
/* Home */
|
||||
.home-hero{text-align:center;padding:36px 0 28px;max-width:500px;margin:0 auto}
|
||||
|
|
|
|||
Loading…
Reference in New Issue