refactor(layout): 统一 z-index 配置
- layoutConfig.js: 添加 Z_INDEX.FOOTER (1000,与 NAVBAR 同级)
- HomeNavbar.js: zIndex 从硬编码 1000 改为 Z_INDEX.NAVBAR
- AppFooter.js: 添加 zIndex={Z_INDEX.FOOTER}
导航栏和页脚的 z-index 现在统一在 layoutConfig.js 中配置。
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -55,7 +55,7 @@ import { useProfileCompleteness } from '../../hooks/useProfileCompleteness';
|
|||||||
import NavbarActions from './components/NavbarActions';
|
import NavbarActions from './components/NavbarActions';
|
||||||
|
|
||||||
// 布局配置
|
// 布局配置
|
||||||
import { LAYOUT_PADDING } from '../../layouts/config/layoutConfig';
|
import { LAYOUT_PADDING, Z_INDEX } from '../../layouts/config/layoutConfig';
|
||||||
|
|
||||||
// Phase 4: MoreNavMenu 和 NavItems 组件已提取到 Navigation 目录
|
// Phase 4: MoreNavMenu 和 NavItems 组件已提取到 Navigation 目录
|
||||||
|
|
||||||
@@ -146,7 +146,7 @@ export default function HomeNavbar() {
|
|||||||
top={showCompletenessAlert ? "60px" : 0}
|
top={showCompletenessAlert ? "60px" : 0}
|
||||||
left={0}
|
left={0}
|
||||||
right={0}
|
right={0}
|
||||||
zIndex={1000}
|
zIndex={Z_INDEX.NAVBAR}
|
||||||
bg={navbarBg}
|
bg={navbarBg}
|
||||||
backdropFilter="blur(10px)"
|
backdropFilter="blur(10px)"
|
||||||
borderBottom="1px"
|
borderBottom="1px"
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Box, VStack, HStack, Text, Link, useColorModeValue } from '@chakra-ui/react';
|
import { Box, VStack, HStack, Text, Link, useColorModeValue } from '@chakra-ui/react';
|
||||||
import RiskDisclaimer from '../components/RiskDisclaimer';
|
import RiskDisclaimer from '../components/RiskDisclaimer';
|
||||||
import { LAYOUT_PADDING } from './config/layoutConfig';
|
import { LAYOUT_PADDING, Z_INDEX } from './config/layoutConfig';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 应用通用页脚组件
|
* 应用通用页脚组件
|
||||||
@@ -9,7 +9,7 @@ import { LAYOUT_PADDING } from './config/layoutConfig';
|
|||||||
*/
|
*/
|
||||||
const AppFooter = () => {
|
const AppFooter = () => {
|
||||||
return (
|
return (
|
||||||
<Box bg={useColorModeValue('gray.100', 'gray.800')} py={2} px={LAYOUT_PADDING.x}>
|
<Box bg={useColorModeValue('gray.100', 'gray.800')} py={2} px={LAYOUT_PADDING.x} zIndex={Z_INDEX.FOOTER} position="relative">
|
||||||
<VStack spacing={1}>
|
<VStack spacing={1}>
|
||||||
<RiskDisclaimer />
|
<RiskDisclaimer />
|
||||||
<Text color="gray.500" fontSize="sm">
|
<Text color="gray.500" fontSize="sm">
|
||||||
|
|||||||
@@ -40,6 +40,7 @@ export const Z_INDEX = {
|
|||||||
|
|
||||||
// === 导航相关 (1000-1499) ===
|
// === 导航相关 (1000-1499) ===
|
||||||
NAVBAR: 1000, // 顶部导航栏
|
NAVBAR: 1000, // 顶部导航栏
|
||||||
|
FOOTER: 1000, // 页脚(与导航栏同级)
|
||||||
CONNECTION_STATUS: 1050, // 连接状态栏
|
CONNECTION_STATUS: 1050, // 连接状态栏
|
||||||
PROFILE_ALERT: 1100, // 个人资料提示
|
PROFILE_ALERT: 1100, // 个人资料提示
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user