feat: 首页添加小程序入口按钮(仅移动端显示)
- 右上角固定定位,导航栏下方 - 微信绿色圆角按钮 - PC 端自动隐藏 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -14,6 +14,8 @@ import type { Feature } from '@/types/home';
|
||||
import { HeroHeader } from './components/HeroHeader';
|
||||
import { FeaturedFeatureCard } from './components/FeaturedFeatureCard';
|
||||
import { FeatureCard } from './components/FeatureCard';
|
||||
import MiniProgramLauncher from '@/components/MiniProgramLauncher';
|
||||
import { isMobileDevice } from '@/components/MiniProgramLauncher/hooks/useWechatEnvironment';
|
||||
import '@/styles/home-animations.css';
|
||||
|
||||
/**
|
||||
@@ -79,6 +81,9 @@ const HomePage: React.FC = () => {
|
||||
// 其他功能
|
||||
const regularFeatures = CORE_FEATURES.slice(1);
|
||||
|
||||
// 移动端判断(用于显示小程序入口)
|
||||
const isMobile = isMobileDevice();
|
||||
|
||||
return (
|
||||
<Box>
|
||||
{/* Hero Section - 深色科技风格 */}
|
||||
@@ -131,6 +136,31 @@ const HomePage: React.FC = () => {
|
||||
</VStack>
|
||||
</Container>
|
||||
</Box>
|
||||
|
||||
{/* 移动端右上角固定按钮 - 小程序入口 */}
|
||||
{isMobile && (
|
||||
<Box
|
||||
position="fixed"
|
||||
top="70px"
|
||||
right="16px"
|
||||
zIndex={1000}
|
||||
>
|
||||
<MiniProgramLauncher
|
||||
path="/pages/index/index"
|
||||
buttonStyle={{
|
||||
backgroundColor: '#07c160',
|
||||
color: '#fff',
|
||||
padding: '8px 16px',
|
||||
fontSize: '14px',
|
||||
fontWeight: '500',
|
||||
borderRadius: '20px',
|
||||
boxShadow: '0 2px 8px rgba(7, 193, 96, 0.3)',
|
||||
}}
|
||||
>
|
||||
小程序
|
||||
</MiniProgramLauncher>
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user