状态栏修复更新

1.添加状态栏间距来防止内容遮挡
2.添加了跟随页面自动变色的状态栏标题色改变

src/pages/diy/index.tsx

@@ -5,9 +5,13 @@ import './index.scss'
 import { getProductById } from '../../utils/productConfig'
 import { getDesignList, setDesignList, updateDesign, type DesignItem, type StickerItem } from '../../utils/store'
 import { useThemeContext } from '../../context/ThemeContext'
+import { useSafeArea } from '../../hooks/useSafeArea'
+import { useStatusBar } from '../../hooks/useStatusBar'
 
 export default function DIYPage() {
   const { theme, resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [category, setCategory] = useState<any>(null)
   const [step, setStep] = useState(1)
   const [designId, setDesignId] = useState('')
@@ -264,7 +268,7 @@ export default function DIYPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='diy-page'>
 
-        <View className='page-header dashed-card mt-20'>
+        <View className='page-header dashed-card mt-20' style={{ marginTop: `${safe.headerPaddingTop}px` }}>
           <View className='star-badge' />
           <View className='flex-between' style={{ width: '100%' }}>
             <Text className='back-btn' onTap={goBack}>←</Text>

src/pages/diy/stickerEdit/index.tsx

@@ -5,6 +5,8 @@ import './index.scss'
 import { getProductById } from '../../../utils/productConfig'
 import { getDesignList, setDesignList, updateDesign, type DesignItem, type StickerItem } from '../../../utils/store'
 import { useThemeContext } from '../../../context/ThemeContext'
+import { useSafeArea } from '../../../hooks/useSafeArea'
+import { useStatusBar } from '../../../hooks/useStatusBar'
 
 /* ============================================================
    使用 Canvas 实现贴纸编辑（亮度/色相/线稿）
@@ -77,6 +79,8 @@ function TouchSlider({ value, min, max, step = 1, onChange, format }: SliderProp
 
 export default function StickerEditPage() {
   const { resolvedTheme } = useThemeContext()
+  const safe = useSafeArea()
+  useStatusBar(resolvedTheme)
   const [designId, setDesignId] = useState('')
   const [stickerId, setStickerId] = useState('')
   const [sticker, setSticker] = useState<StickerItem | null>(null)
@@ -302,7 +306,7 @@ export default function StickerEditPage() {
     <View className={`theme-${resolvedTheme}`}>
       <View className='sticker-edit-page'>
         {/* Header */}
-        <View className='edit-header'>
+        <View className='edit-header' style={{ paddingTop: `${safe.headerPaddingTop}px` }}>
           <Text className='edit-back' onTap={() => Taro.navigateBack()}>←</Text>
           <Text className='edit-title'>编辑贴纸</Text>
           <Text className='edit-save' onTap={handleSave}>保存</Text>