修改样式
This commit is contained in:
parent
bcbcf9b489
commit
068bfaef5d
|
@ -1,9 +1,9 @@
|
||||||
|
|
||||||
.customTabs {
|
.customTabs {
|
||||||
border: none;
|
border: none;
|
||||||
--active-line-color: #ff8383;
|
--active-line-color: #ff8383!important;
|
||||||
--active-title-color: #fff;
|
--active-title-color: #fff!important;
|
||||||
--title-color: #a0a0a0;
|
--title-color: #a0a0a0!important;
|
||||||
--inactive-title-color: #FFFFFF80;
|
--inactive-title-color: #FFFFFF80;
|
||||||
--tab-border-color: #ff8383;
|
--tab-border-color: #ff8383;
|
||||||
}
|
}
|
||||||
|
|
|
@ -9,6 +9,12 @@
|
||||||
.jumboTabs>div>div:last-child{
|
.jumboTabs>div>div:last-child{
|
||||||
grid-template-columns: repeat(2, 1fr);
|
grid-template-columns: repeat(2, 1fr);
|
||||||
}
|
}
|
||||||
|
.jumboTabs {
|
||||||
|
&>div:first-child{
|
||||||
|
position: sticky;
|
||||||
|
top: 52px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.listTimeBox>div,.listTimeBox>div>div{
|
.listTimeBox>div,.listTimeBox>div>div{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
|
|
|
@ -106,7 +106,7 @@ export default function Relationship() {
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<div className={styles.relationshipBox}>
|
<div className={styles.relationshipBox}>
|
||||||
<div className="p-4 fixed top-0 z-10 w-full">
|
<div className="px-4 pt-4 sticky top-0 z-10 w-full bg-[#070415]">
|
||||||
<div className="w-9 h-9 flex items-center justify-center bg-[#FFFFFF1A] rounded-full absolute">
|
<div className="w-9 h-9 flex items-center justify-center bg-[#FFFFFF1A] rounded-full absolute">
|
||||||
<FontAwesomeIcon
|
<FontAwesomeIcon
|
||||||
icon={faAngleLeft}
|
icon={faAngleLeft}
|
||||||
|
@ -119,7 +119,7 @@ export default function Relationship() {
|
||||||
<p className="text-base text-center leading-9">关系</p>
|
<p className="text-base text-center leading-9">关系</p>
|
||||||
</div>
|
</div>
|
||||||
{/* 内容 */}
|
{/* 内容 */}
|
||||||
<div className="pt-16 px-4">
|
<div className="px-4">
|
||||||
<JumboTabs
|
<JumboTabs
|
||||||
onChange={(key) => setCurrentKey(key)}
|
onChange={(key) => setCurrentKey(key)}
|
||||||
activeKey={currentKey}
|
activeKey={currentKey}
|
||||||
|
|
|
@ -276,7 +276,7 @@ const FollowPostList = forwardRef(({ scrollHeight }, ref) => {
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
// debugger;
|
// debugger;
|
||||||
console.log("offset", followsResponse.data.offset);
|
// console.log("offset", followsResponse.data.offset);
|
||||||
setOffset(followsResponse.data.offset);
|
setOffset(followsResponse.data.offset);
|
||||||
setHasMore(followsResponse.data.more);
|
setHasMore(followsResponse.data.more);
|
||||||
setLoading(false);
|
setLoading(false);
|
||||||
|
|
|
@ -35,7 +35,6 @@ export default function Space() {
|
||||||
const [scrollHeight, setScrollHeight] = useState(0);
|
const [scrollHeight, setScrollHeight] = useState(0);
|
||||||
const [offset, setOffset] = useState(0);
|
const [offset, setOffset] = useState(0);
|
||||||
const [loading, setLoading] = useState(false);
|
const [loading, setLoading] = useState(false);
|
||||||
const scrollRef = useRef(null);
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
// 获取屏幕高度
|
// 获取屏幕高度
|
||||||
// const scrollHeight = 600;
|
// const scrollHeight = 600;
|
||||||
|
@ -259,7 +258,7 @@ export default function Space() {
|
||||||
</Swiper.Item>
|
</Swiper.Item>
|
||||||
<Swiper.Item>
|
<Swiper.Item>
|
||||||
{!!activeIndex && (
|
{!!activeIndex && (
|
||||||
<div className="px-4 pb-20" ref={scrollRef}>
|
<div className="px-4 pb-20" >
|
||||||
<List className="scrollbarBox_hidden">
|
<List className="scrollbarBox_hidden">
|
||||||
{loading && !dataList.length && (
|
{loading && !dataList.length && (
|
||||||
<>
|
<>
|
||||||
|
@ -305,7 +304,12 @@ export default function Space() {
|
||||||
size="xl"
|
size="xl"
|
||||||
// onClick={firstRequest}
|
// onClick={firstRequest}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
scrollRef.current?.scrollTo(0, 0);
|
// scrollRef.current?.scrollTo(0, 0);
|
||||||
|
window.scrollTo({
|
||||||
|
top: 0,
|
||||||
|
left: 0,
|
||||||
|
behavior: "smooth", // 可选,平滑滚动效果
|
||||||
|
});
|
||||||
firstRequest();
|
firstRequest();
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
|
Loading…
Reference in New Issue