迁移以下 10 个组件使用 glassConfig.ts 统一配置: - GlassCard: GLASS_BLUR/GLASS_SHADOW 替换硬编码 blur/glow - SubTabContainer: GLASS_BLUR.lg 替换 blur(20px) - HomeNavbar: GLASS_BLUR.sm 替换 blur(10px) - AuthModalManager: GLASS_BLUR.sm 替换 blur(10px) - WechatRegister: GLASS_BLUR.xs 替换 blur(4px) - SubscriptionModal: GLASS_BLUR.xs 替换 blur(4px) - SubscriptionContentNew: GLASS_BLUR.sm/lg/xl 替换多处硬编码 - ImageLightbox: GLASS_BLUR.sm 替换 blur(10px) - ImagePreviewModal: GLASS_BLUR.sm 替换 blur(10px) - FuiContainer: GLASS_BLUR.md 替换 blur(16px) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
44 lines
1.2 KiB
JavaScript
44 lines
1.2 KiB
JavaScript
// src/components/Subscription/SubscriptionModal.js
|
|
import React from 'react';
|
|
import {
|
|
Modal,
|
|
ModalOverlay,
|
|
ModalContent,
|
|
ModalHeader,
|
|
ModalBody,
|
|
ModalCloseButton,
|
|
Icon,
|
|
HStack,
|
|
Text,
|
|
useColorModeValue,
|
|
} from '@chakra-ui/react';
|
|
import { Star } from 'lucide-react';
|
|
import PropTypes from 'prop-types';
|
|
import SubscriptionContent from './SubscriptionContent';
|
|
import { GLASS_BLUR } from '@/constants/glassConfig';
|
|
|
|
export default function SubscriptionModal({ isOpen, onClose }) {
|
|
return (
|
|
<Modal isOpen={isOpen} onClose={onClose} size="4xl" isCentered scrollBehavior="inside">
|
|
<ModalOverlay backdropFilter={GLASS_BLUR.xs} />
|
|
<ModalContent maxH="90vh">
|
|
<ModalHeader borderBottomWidth="1px" borderColor={useColorModeValue('gray.200', 'gray.600')}>
|
|
<HStack>
|
|
<Icon as={Star} color="blue.500" boxSize={5} />
|
|
<Text>订阅管理</Text>
|
|
</HStack>
|
|
</ModalHeader>
|
|
<ModalCloseButton />
|
|
<ModalBody py={6}>
|
|
<SubscriptionContent />
|
|
</ModalBody>
|
|
</ModalContent>
|
|
</Modal>
|
|
);
|
|
}
|
|
|
|
SubscriptionModal.propTypes = {
|
|
isOpen: PropTypes.bool.isRequired,
|
|
onClose: PropTypes.func.isRequired,
|
|
};
|