fix(sns): keep header area always visible

This commit is contained in:
tisonhuang
2026-03-02 13:49:16 +08:00
parent b5507b9f5d
commit 89f0758fbb
2 changed files with 83 additions and 74 deletions

View File

@@ -23,7 +23,7 @@
========================================= */
.sns-main-viewport {
flex: 1;
overflow-y: scroll;
overflow: hidden;
position: relative;
display: flex;
justify-content: center;
@@ -35,7 +35,9 @@
padding: 20px 24px 60px 24px;
display: flex;
flex-direction: column;
gap: 24px;
gap: 0;
min-height: 0;
height: 100%;
}
.feed-header {
@@ -44,9 +46,7 @@
justify-content: space-between;
margin-bottom: 8px;
padding: 0 4px;
position: sticky;
top: 0;
z-index: 20;
z-index: 2;
background: var(--sns-bg-color);
border-bottom: 1px solid var(--border-color);
padding-top: 10px;
@@ -109,6 +109,13 @@
}
}
.sns-posts-scroll {
flex: 1;
min-height: 0;
overflow-y: auto;
padding-top: 16px;
}
.posts-list {
display: flex;
flex-direction: column;

View File

@@ -360,7 +360,7 @@ export default function SnsPage() {
return (
<div className="sns-page-layout">
<div className="sns-main-viewport" onScroll={handleScroll} onWheel={handleWheel} ref={postsContainerRef}>
<div className="sns-main-viewport">
<div className="sns-feed-container">
<div className="feed-header">
<div className="feed-header-main">
@@ -417,6 +417,7 @@ export default function SnsPage() {
</div>
</div>
<div className="sns-posts-scroll" onScroll={handleScroll} onWheel={handleWheel} ref={postsContainerRef}>
{loadingNewer && (
<div className="status-indicator loading-newer">
<RefreshCw size={16} className="spinning" />
@@ -491,6 +492,7 @@ export default function SnsPage() {
)}
</div>
</div>
</div>
<SnsFilterPanel
searchKeyword={searchKeyword}