fix: tooltip

Signed-off-by: Innei <[email protected]>

Author: Innei

src/app/(page-detail)/[slug]/layout.tsx

@@ -111,7 +111,9 @@ export default async (props: NextPageParams<PageParams>) => {
               </BottomToUpTransitionView>
             </article>
 
-            <PagePaginator />
+            <BottomToUpSoftScaleTransitionView delay={1000}>
+              <PagePaginator />
+            </BottomToUpSoftScaleTransitionView>
           </div>
         </PageLoading>
 

src/app/notes/[id]/Transtion.tsx

@@ -0,0 +1,19 @@
+'use client'
+
+import { createTransitionView } from '~/components/ui/transition/factor'
+
+export const Transition = createTransitionView({
+  from: {
+    translateY: 80,
+    opacity: 0.001,
+  },
+  to: {
+    translateY: 0,
+    opacity: 1,
+  },
+  preset: {
+    type: 'spring',
+    damping: 20,
+    stiffness: 200,
+  },
+})

src/app/notes/[id]/layout.tsx

@@ -3,7 +3,6 @@ import type { Metadata } from 'next'
 
 import { NotSupport } from '~/components/common/NotSupport'
 import { BottomToUpSoftScaleTransitionView } from '~/components/ui/transition/BottomToUpSoftScaleTransitionView'
-import { BottomToUpTransitionView } from '~/components/ui/transition/BottomToUpTransitionView'
 import { OnlyMobile } from '~/components/ui/viewport/OnlyMobile'
 import { CommentAreaRoot } from '~/components/widgets/comment'
 import { NoteMainContainer } from '~/components/widgets/note/NoteMainContainer'
@@ -20,6 +19,7 @@ import { CurrentNoteIdProvider } from '~/providers/note/CurrentNoteIdProvider'
 import { queries } from '~/queries/definition'
 
 import { Paper } from '../Paper'
+import { Transition } from './Transtion'
 
 export const generateMetadata = async ({
   params,
@@ -89,7 +89,7 @@ export default async (
       <CurrentNoteDataProvider data={data} />
       <SyncNoteDataAfterLoggedIn />
 
-      <BottomToUpTransitionView className="min-w-0">
+      <Transition className="min-w-0">
         <Paper as={NoteMainContainer}>{props.children}</Paper>
         <BottomToUpSoftScaleTransitionView delay={500}>
           {isCN ? (
@@ -98,7 +98,7 @@ export default async (
             <CommentAreaRoot refId={noteObjectId} allowComment={allowComment} />
           )}
         </BottomToUpSoftScaleTransitionView>
-      </BottomToUpTransitionView>
+      </Transition>
 
       <OnlyMobile>
         <TocFAB />

src/app/notes/[id]/page.tsx

@@ -53,9 +53,6 @@ const SubscribeBell = dynamic(() =>
     (mod) => mod.SubscribeBell,
   ),
 )
-const TocAside = dynamic(() =>
-  import('~/components/widgets/toc').then((mod) => mod.TocAside),
-)
 
 const PageImpl = () => {
   return (

src/components/layout/header/internal/Activity.tsx

@@ -89,6 +89,7 @@ export function Activity() {
             TriggerComponent={TriggerComponent}
             triggerComponentProps={cMusicProps}
             type="tooltip"
+            strategy="fixed"
           >
             {ownerName} 正在听 {media.title} - {media.artist}
           </FloatPopover>
@@ -112,6 +113,7 @@ export function Activity() {
           TriggerComponent={TriggerComponent}
           triggerComponentProps={memoProcessName}
           type="tooltip"
+          strategy="fixed"
         >
           {ownerName} 正在使用 {processName}
         </FloatPopover>

src/components/ui/float-popover/FloatPopover.tsx

@@ -243,7 +243,7 @@ export function FloatPopover<T extends {}>(
                   headless && styles['headless'],
                   animate && styles['animate'],
                   type === 'tooltip'
-                    ? `max-w-[25rem] break-all rounded-xl bg-base-100 px-4 py-2 ${styles['headless']}`
+                    ? `max-w-[25rem] break-all rounded-xl px-4 py-2 ${styles['headless']}`
                     : styles['popover-root'],
                   popoverClassNames,
                 )}

src/components/ui/transition/factor.tsx

@@ -1,3 +1,5 @@
+'use client'
+
 import { memo } from 'react'
 import { m } from 'framer-motion'
 import type {