feat: add scroll top mask, unify page top spacing and docs

src/pages/profile/index.tsx

@@ -7,6 +7,7 @@ import { useThemeContext } from '../../context/ThemeContext'
 import { useSafeArea } from '../../hooks/useSafeArea'
 import { useStatusBar } from '../../hooks/useStatusBar'
 import ThemedPageMeta from '../../components/ThemedPageMeta'
+import ScrollTopMask from '../../components/ScrollTopMask'
 import { login, getMe, updateProfile, getToken } from '../../utils/api'
 import { safeHideLoading } from '../../utils/request'
 import { assetUrl } from '../../utils/asset'
@@ -279,10 +280,11 @@ export default function ProfilePage() {
   return (
     <View className={`theme-${resolvedTheme}`} style={{ minHeight: '100vh' }}>
       <ThemedPageMeta />
+      <ScrollTopMask title="我的" targetSelector=".profile-header" />
       <View className='profile-page'>
 
         {/* 用户信息头部 */}
-        <View className='profile-header surface-card' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
+        <View className='profile-header surface-card' style={{ marginTop: `${safe.statusBarHeight + 12}px` }}>
           <View className='user-info'>
             {isLoggedIn && userInfo.avatarUrl ? (
               <Image className='avatar' src={userInfo.avatarUrl} mode='aspectFill' />