xiaoxue_admin
/
Folo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: add horizontal scroll functionality to TimelineTabs (#1081) 

Co-authored-by: xhuajin <xhuajin@users.noreply.github.com>
Co-authored-by: Stephen Zhou <38493346+hyoban@users.noreply.github.com>
This commit is contained in:
Huajin 2024-10-24 08:50:23 +08:00 committed by GitHub
parent bef80de315
commit 9778ce2037
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
apps/renderer/src/modules/entry-column/layouts/TimelineTabs.tsx
View File

@ -20,9 +20,15 @@ export const TimelineTabs = () => {
const navigate = useNavigateEntry()
if (!hasData) return null
const handleWheel = (e: React.WheelEvent<HTMLDivElement>) => {
e.preventDefault()
e.currentTarget.scrollLeft += e.deltaY
}
return (
<Tabs
className="-ml-3 -mr-4 mt-1 overflow-x-auto scrollbar-none"
className="-ml-3 -mr-4 mt-1 flex overflow-x-auto scrollbar-none"
value={timeline}
onValueChange={(val) => {
if (!val) {
@ -34,7 +40,7 @@ export const TimelineTabs = () => {
}
}}
>
<TabsList className="h-10 border-b-0">
<TabsList className="h-10 justify-start overflow-hidden border-b-0" onWheel={handleWheel}>
<TabsTrigger variant={"rounded"} className="p-0" value="">
Yours
</TabsTrigger>
@ -44,7 +50,7 @@ export const TimelineTabs = () => {
listId={s.listId!}
view={view}
iconSize={16}
className="h-5 !bg-transparent p-0 leading-none"
className="h-5 !bg-transparent p-0"
/>
</TabsTrigger>
))}
@ -54,7 +60,7 @@ export const TimelineTabs = () => {
inboxId={s.inboxId!}
view={view}
iconSize={16}
className="h-5 !bg-transparent p-0 leading-none"
className="h-5 !bg-transparent p-0"
/>
</TabsTrigger>
))}