diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 14f85e7..0109e8b 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -8,15 +8,6 @@ importers: .: dependencies: - '@dnd-kit/core': - specifier: ^6.3.1 - version: 6.3.1(react-dom@19.2.0(react@19.2.0))(react@19.2.0) - '@dnd-kit/sortable': - specifier: ^10.0.0 - version: 10.0.0(@dnd-kit/core@6.3.1(react-dom@19.2.0(react@19.2.0))(react@19.2.0))(react@19.2.0) - '@dnd-kit/utilities': - specifier: ^3.2.2 - version: 3.2.2(react@19.2.0) axios: specifier: ^1.12.2 version: 1.12.2 @@ -180,28 +171,6 @@ packages: resolution: {integrity: sha512-bkFqkLhh3pMBUQQkpVgWDWq/lqzc2678eUyDlTBhRqhCHFguYYGM0Efga7tYk4TogG/3x0EEl66/OQ+WGbWB/Q==} engines: {node: '>=6.9.0'} - '@dnd-kit/accessibility@3.1.1': - resolution: {integrity: sha512-2P+YgaXF+gRsIihwwY1gCsQSYnu9Zyj2py8kY5fFvUM1qm2WA2u639R6YNVfU4GWr+ZM5mqEsfHZZLoRONbemw==} - peerDependencies: - react: '>=16.8.0' - - '@dnd-kit/core@6.3.1': - resolution: {integrity: sha512-xkGBRQQab4RLwgXxoqETICr6S5JlogafbhNsidmrkVv2YRs5MLwpjoF2qpiGjQt8S9AoxtIV603s0GIUpY5eYQ==} - peerDependencies: - react: '>=16.8.0' - react-dom: '>=16.8.0' - - '@dnd-kit/sortable@10.0.0': - resolution: {integrity: sha512-+xqhmIIzvAYMGfBYYnbKuNicfSsk4RksY2XdmJhT+HAC01nix6fHCztU68jooFiMUB01Ky3F0FyOvhG/BZrWkg==} - peerDependencies: - '@dnd-kit/core': ^6.3.0 - react: '>=16.8.0' - - '@dnd-kit/utilities@3.2.2': - resolution: {integrity: sha512-+MKAJEOfaBe5SmV6t34p80MMKhjvUz0vRrvVJbPT0WElzaOJ/1xs+D+KDv+tD/NE5ujfrChEcshd4fLn0wpiqg==} - peerDependencies: - react: '>=16.8.0' - '@esbuild/aix-ppc64@0.25.11': resolution: {integrity: sha512-Xt1dOL13m8u0WE8iplx9Ibbm+hFAO0GsU2P34UNoDGvZYkY8ifSiy6Zuc1lYxfG7svWE2fzqCUmFp5HCn51gJg==} engines: {node: '>=18'} @@ -1464,9 +1433,6 @@ packages: peerDependencies: typescript: '>=4.8.4' - tslib@2.8.1: - resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==} - type-check@0.4.0: resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==} engines: {node: '>= 0.8.0'} @@ -1671,31 +1637,6 @@ snapshots: '@babel/helper-string-parser': 7.27.1 '@babel/helper-validator-identifier': 7.27.1 - '@dnd-kit/accessibility@3.1.1(react@19.2.0)': - dependencies: - react: 19.2.0 - tslib: 2.8.1 - - '@dnd-kit/core@6.3.1(react-dom@19.2.0(react@19.2.0))(react@19.2.0)': - dependencies: - '@dnd-kit/accessibility': 3.1.1(react@19.2.0) - '@dnd-kit/utilities': 3.2.2(react@19.2.0) - react: 19.2.0 - react-dom: 19.2.0(react@19.2.0) - tslib: 2.8.1 - - '@dnd-kit/sortable@10.0.0(@dnd-kit/core@6.3.1(react-dom@19.2.0(react@19.2.0))(react@19.2.0))(react@19.2.0)': - dependencies: - '@dnd-kit/core': 6.3.1(react-dom@19.2.0(react@19.2.0))(react@19.2.0) - '@dnd-kit/utilities': 3.2.2(react@19.2.0) - react: 19.2.0 - tslib: 2.8.1 - - '@dnd-kit/utilities@3.2.2(react@19.2.0)': - dependencies: - react: 19.2.0 - tslib: 2.8.1 - '@esbuild/aix-ppc64@0.25.11': optional: true @@ -2814,8 +2755,6 @@ snapshots: dependencies: typescript: 5.9.3 - tslib@2.8.1: {} - type-check@0.4.0: dependencies: prelude-ls: 1.2.1 diff --git a/src/assets/images/content/交流与展示活动-未选中.png b/src/assets/images/content/交流与展示活动-未选中.png new file mode 100644 index 0000000..fe53c30 Binary files /dev/null and b/src/assets/images/content/交流与展示活动-未选中.png differ diff --git a/src/assets/images/content/交流与展示活动-选中.png b/src/assets/images/content/交流与展示活动-选中.png new file mode 100644 index 0000000..c5d3cd8 Binary files /dev/null and b/src/assets/images/content/交流与展示活动-选中.png differ diff --git a/src/assets/images/content/内页底图02.png b/src/assets/images/content/内页底图02.png new file mode 100644 index 0000000..206c43b Binary files /dev/null and b/src/assets/images/content/内页底图02.png differ diff --git a/src/assets/images/content/图文.png b/src/assets/images/content/图文.png new file mode 100644 index 0000000..8f0a90d Binary files /dev/null and b/src/assets/images/content/图文.png differ diff --git a/src/assets/images/content/工作室介绍未选中.png b/src/assets/images/content/工作室介绍未选中.png new file mode 100644 index 0000000..59bf5ba Binary files /dev/null and b/src/assets/images/content/工作室介绍未选中.png differ diff --git a/src/assets/images/content/工作室介绍选中.png b/src/assets/images/content/工作室介绍选中.png new file mode 100644 index 0000000..1482745 Binary files /dev/null and b/src/assets/images/content/工作室介绍选中.png differ diff --git a/src/assets/images/content/带教心得未选中.png b/src/assets/images/content/带教心得未选中.png new file mode 100644 index 0000000..325c15e Binary files /dev/null and b/src/assets/images/content/带教心得未选中.png differ diff --git a/src/assets/images/content/带教心得选中.png b/src/assets/images/content/带教心得选中.png new file mode 100644 index 0000000..7352244 Binary files /dev/null and b/src/assets/images/content/带教心得选中.png differ diff --git a/src/assets/images/content/带教活动未选中.png b/src/assets/images/content/带教活动未选中.png new file mode 100644 index 0000000..f784e61 Binary files /dev/null and b/src/assets/images/content/带教活动未选中.png differ diff --git a/src/assets/images/content/带教活动选中.png b/src/assets/images/content/带教活动选中.png new file mode 100644 index 0000000..46e0bb0 Binary files /dev/null and b/src/assets/images/content/带教活动选中.png differ diff --git a/src/assets/images/content/成果展示未选中.png b/src/assets/images/content/成果展示未选中.png new file mode 100644 index 0000000..4acd0db Binary files /dev/null and b/src/assets/images/content/成果展示未选中.png differ diff --git a/src/assets/images/content/成果展示选中.png b/src/assets/images/content/成果展示选中.png new file mode 100644 index 0000000..708df11 Binary files /dev/null and b/src/assets/images/content/成果展示选中.png differ diff --git a/src/assets/images/content/教学实践与反思-未选中.png b/src/assets/images/content/教学实践与反思-未选中.png new file mode 100644 index 0000000..c55cc38 Binary files /dev/null and b/src/assets/images/content/教学实践与反思-未选中.png differ diff --git a/src/assets/images/content/教学实践与反思-选中.png b/src/assets/images/content/教学实践与反思-选中.png new file mode 100644 index 0000000..5d753c8 Binary files /dev/null and b/src/assets/images/content/教学实践与反思-选中.png differ diff --git a/src/assets/images/content/理论与技能专项培训-未选中.png b/src/assets/images/content/理论与技能专项培训-未选中.png new file mode 100644 index 0000000..51ff260 Binary files /dev/null and b/src/assets/images/content/理论与技能专项培训-未选中.png differ diff --git a/src/assets/images/content/理论与技能专项培训-选中.png b/src/assets/images/content/理论与技能专项培训-选中.png new file mode 100644 index 0000000..f96ecaa Binary files /dev/null and b/src/assets/images/content/理论与技能专项培训-选中.png differ diff --git a/src/assets/images/content/经验传承与资源共享-未选中.png b/src/assets/images/content/经验传承与资源共享-未选中.png new file mode 100644 index 0000000..4f8640a Binary files /dev/null and b/src/assets/images/content/经验传承与资源共享-未选中.png differ diff --git a/src/assets/images/content/经验传承与资源共享-选中.png b/src/assets/images/content/经验传承与资源共享-选中.png new file mode 100644 index 0000000..464711c Binary files /dev/null and b/src/assets/images/content/经验传承与资源共享-选中.png differ diff --git a/src/assets/images/content/视频区域框.png b/src/assets/images/content/视频区域框.png new file mode 100644 index 0000000..c11cb73 Binary files /dev/null and b/src/assets/images/content/视频区域框.png differ diff --git a/src/assets/images/content/项目与课题研究-未选中.png b/src/assets/images/content/项目与课题研究-未选中.png new file mode 100644 index 0000000..a7a2704 Binary files /dev/null and b/src/assets/images/content/项目与课题研究-未选中.png differ diff --git a/src/assets/images/content/项目与课题研究-选中.png b/src/assets/images/content/项目与课题研究-选中.png new file mode 100644 index 0000000..82079da Binary files /dev/null and b/src/assets/images/content/项目与课题研究-选中.png differ diff --git a/src/assets/images/publicity/01工作室介绍选中.png b/src/assets/images/publicity/01工作室介绍选中.png new file mode 100644 index 0000000..b672c64 Binary files /dev/null and b/src/assets/images/publicity/01工作室介绍选中.png differ diff --git a/src/assets/images/publicity/01未选中.png b/src/assets/images/publicity/01未选中.png new file mode 100644 index 0000000..b95c1be Binary files /dev/null and b/src/assets/images/publicity/01未选中.png differ diff --git a/src/assets/images/publicity/02带教活动选中.png b/src/assets/images/publicity/02带教活动选中.png new file mode 100644 index 0000000..c16f6d7 Binary files /dev/null and b/src/assets/images/publicity/02带教活动选中.png differ diff --git a/src/assets/images/publicity/02未选中.png b/src/assets/images/publicity/02未选中.png new file mode 100644 index 0000000..03747a1 Binary files /dev/null and b/src/assets/images/publicity/02未选中.png differ diff --git a/src/assets/images/publicity/03带教心得选中.png b/src/assets/images/publicity/03带教心得选中.png new file mode 100644 index 0000000..af93c52 Binary files /dev/null and b/src/assets/images/publicity/03带教心得选中.png differ diff --git a/src/assets/images/publicity/03未选中.png b/src/assets/images/publicity/03未选中.png new file mode 100644 index 0000000..fe0dedb Binary files /dev/null and b/src/assets/images/publicity/03未选中.png differ diff --git a/src/assets/images/publicity/04成果展示选中.png b/src/assets/images/publicity/04成果展示选中.png new file mode 100644 index 0000000..86c6e0b Binary files /dev/null and b/src/assets/images/publicity/04成果展示选中.png differ diff --git a/src/assets/images/publicity/04未选中.png b/src/assets/images/publicity/04未选中.png new file mode 100644 index 0000000..dbe213e Binary files /dev/null and b/src/assets/images/publicity/04未选中.png differ diff --git a/src/assets/images/publicity/内页底图01.png b/src/assets/images/publicity/内页底图01.png new file mode 100644 index 0000000..65e8a11 Binary files /dev/null and b/src/assets/images/publicity/内页底图01.png differ diff --git a/src/assets/images/publicity/功能-发送.png b/src/assets/images/publicity/功能-发送.png new file mode 100644 index 0000000..ea7fc63 Binary files /dev/null and b/src/assets/images/publicity/功能-发送.png differ diff --git a/src/assets/images/publicity/功能-语音输入.png b/src/assets/images/publicity/功能-语音输入.png new file mode 100644 index 0000000..edcc0a1 Binary files /dev/null and b/src/assets/images/publicity/功能-语音输入.png differ diff --git a/src/assets/images/publicity/功能-输入.png b/src/assets/images/publicity/功能-输入.png new file mode 100644 index 0000000..35d3d7a Binary files /dev/null and b/src/assets/images/publicity/功能-输入.png differ diff --git a/src/assets/images/publicity/名师工作室-标题.png b/src/assets/images/publicity/名师工作室-标题.png new file mode 100644 index 0000000..0699c7a Binary files /dev/null and b/src/assets/images/publicity/名师工作室-标题.png differ diff --git a/src/assets/images/publicity/按钮-关闭.png b/src/assets/images/publicity/按钮-关闭.png new file mode 100644 index 0000000..cc6cb98 Binary files /dev/null and b/src/assets/images/publicity/按钮-关闭.png differ diff --git a/src/assets/images/publicity/数字人-头像框.png b/src/assets/images/publicity/数字人-头像框.png new file mode 100644 index 0000000..4c87ef9 Binary files /dev/null and b/src/assets/images/publicity/数字人-头像框.png differ diff --git a/src/assets/images/publicity/曹君名师数字人分身.png b/src/assets/images/publicity/曹君名师数字人分身.png new file mode 100644 index 0000000..0fcadf5 Binary files /dev/null and b/src/assets/images/publicity/曹君名师数字人分身.png differ diff --git a/src/assets/images/publicity/点击提示.png b/src/assets/images/publicity/点击提示.png new file mode 100644 index 0000000..5922a89 Binary files /dev/null and b/src/assets/images/publicity/点击提示.png differ diff --git a/src/assets/images/publicity/输入框.png b/src/assets/images/publicity/输入框.png new file mode 100644 index 0000000..5eb1108 Binary files /dev/null and b/src/assets/images/publicity/输入框.png differ diff --git a/src/components/BackgroundImage.tsx b/src/components/BackgroundImage.tsx index a5f3df5..d11fdcd 100644 --- a/src/components/BackgroundImage.tsx +++ b/src/components/BackgroundImage.tsx @@ -19,6 +19,7 @@ interface BackgroundImageProps { overlay?: boolean; overlayColor?: string; overlayOpacity?: number; + overflowHidden?: boolean; } export default function BackgroundImage({ @@ -39,6 +40,7 @@ export default function BackgroundImage({ overlay = false, overlayColor = "rgba(0, 0, 0, 0.5)", overlayOpacity = 0.5, + overflowHidden = true, }: BackgroundImageProps) { const [imageSrc, setImageSrc] = useState(src); const [isLoading, setIsLoading] = useState(true); @@ -133,7 +135,11 @@ export default function BackgroundImage({ return (
diff --git a/src/components/DraggableItem.tsx b/src/components/DraggableItem.tsx deleted file mode 100644 index 0e69493..0000000 --- a/src/components/DraggableItem.tsx +++ /dev/null @@ -1,45 +0,0 @@ -import { ReactNode } from "react"; -import { useSortable } from "@dnd-kit/sortable"; -import { CSS } from "@dnd-kit/utilities"; -import { GripVertical } from "lucide-react"; - -interface DraggableItemProps { - id: string; - children: ReactNode; -} - -export default function DraggableItem({ id, children }: DraggableItemProps) { - const { - attributes, - listeners, - setNodeRef, - transform, - transition, - isDragging, - } = useSortable({ id }); - - const style = { - transform: CSS.Transform.toString(transform), - transition, - opacity: isDragging ? 0.5 : 1, - }; - - return ( -
-
- -
-
{children}
-
- ); -} diff --git a/src/components/index.ts b/src/components/index.ts index 1baccda..0cc8fb5 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -1,3 +1,2 @@ export { default as Image } from "./Image"; export { default as BackgroundImage } from "./BackgroundImage"; -export { default as DraggableItem } from "./DraggableItem"; diff --git a/src/index.css b/src/index.css index 1479c45..f803077 100644 --- a/src/index.css +++ b/src/index.css @@ -1,4 +1,5 @@ @import "tailwindcss"; +@import "./styles/input.css"; /* *{ */ /* margin: 0; @@ -16,4 +17,4 @@ body{ #root{ width: 100%; height: 100%; -} \ No newline at end of file +} diff --git a/src/pages/Content.tsx b/src/pages/Content.tsx new file mode 100644 index 0000000..a9c1c11 --- /dev/null +++ b/src/pages/Content.tsx @@ -0,0 +1,207 @@ +import { BackgroundImage, Image } from "@/components"; +import { getStaticImage } from "@/utils"; +import clsx from "clsx"; +import { useState } from "react"; +import { useNavigate } from "react-router-dom"; + +/** + * tab列表 + * 1. 01工作室介绍 + * 2. 02带教活动 + * 3. 03带教心得 + * 4. 04成果展示 + */ +const tabList = [ + { + id: 1, + name: "01工作室介绍", + image: getStaticImage("content/工作室介绍未选中.png"), + selectedImage: getStaticImage("content/工作室介绍选中.png"), + }, + { + id: 2, + name: "02带教活动", + image: getStaticImage("content/带教活动未选中.png"), + selectedImage: getStaticImage("content/带教活动选中.png"), + }, + { + id: 3, + name: "03带教心得", + image: getStaticImage("content/带教心得未选中.png"), + selectedImage: getStaticImage("content/带教心得选中.png"), + }, + { + id: 4, + name: "04成果展示", + image: getStaticImage("content/成果展示未选中.png"), + selectedImage: getStaticImage("content/成果展示选中.png"), + }, +]; + +/** + * 侧边栏 + * 论与技能转向培训 + * 教学实践与反思 + * 项目与课题研究 + * 经验传承与资源共享 + * 交流与展示活动 + */ +const sideBarList = [ + { + name: "理论与技能转向培训", + image: getStaticImage("content/理论与技能专项培训-未选中.png"), + selectedImage: getStaticImage("content/理论与技能专项培训-选中.png"), + }, + { + name: "教学实践与反思", + image: getStaticImage("content/教学实践与反思-未选中.png"), + selectedImage: getStaticImage("content/教学实践与反思-选中.png"), + }, + { + name: "项目与课题研究", + image: getStaticImage("content/项目与课题研究-未选中.png"), + selectedImage: getStaticImage("content/项目与课题研究-选中.png"), + }, + { + name: "经验传承与资源共享", + image: getStaticImage("content/经验传承与资源共享-未选中.png"), + selectedImage: getStaticImage("content/经验传承与资源共享-选中.png"), + }, + { + name: "交流与展示活动", + image: getStaticImage("content/交流与展示活动-未选中.png"), + selectedImage: getStaticImage("content/交流与展示活动-选中.png"), + }, +]; + +export const Tab = ({ + changeTab, + className, +}: { + changeTab?: (id: number) => void; + className?: string; +}) => { + const [selectedTabId, setSelectedTabId] = useState(1); + return ( + <> + {/* tab */} +
+ {tabList.map((item) => ( + {item.name} { + setSelectedTabId(item.id); + changeTab?.(item.id); + }} + /> + ))} +
+ + + + ); +}; + +const TabContent = ({ + className, + selectedTabId, +}: { + className?: string; + selectedTabId: number; +}) => { + const [selectedSideBarId, setSelectedSideBarId] = useState(0); + return ( + <> +
+ {/* 通过tab切换内容 */} + {selectedTabId === 1 && ( + 工作室介绍 + )} + {selectedTabId === 2 && ( +
+ {/* 侧边栏 */} +
+ {sideBarList.map((item, index) => ( + {item.name} { + setSelectedSideBarId(index); + }} + /> + ))} +
+ +
+ + 图文、视频展示理论与技能专项培训内容 + +
+
+
+ )} + {selectedTabId === 3 && ( +
+ 暂无内容 +
+ )} + {selectedTabId === 4 && ( +
+ 暂无内容 +
+ )} +
+ + ); +}; + +export default function PublicityPage() { + const navigate = useNavigate(); + + const changeTab = (id: number) => { + console.log(id); + }; + + return ( + +
+ 返回 { + navigate("/publicity"); + }} + /> + + +
+
+ ); +} diff --git a/src/pages/Menu.tsx b/src/pages/Menu.tsx index a95b99a..e6b4bf1 100644 --- a/src/pages/Menu.tsx +++ b/src/pages/Menu.tsx @@ -47,6 +47,7 @@ export default function Home() { const handleSelectTeacher = (teacherId: number) => { setSelectedTeacherId(teacherId); + navigate("/Publicity"); }; const handleStartExperiment = () => { @@ -66,7 +67,7 @@ export default function Home() { alt="返回" button className="absolute top-0 right-0" - onClick={handleStartExperiment} + onClick={() => navigate("/")} /> -
-
-

404

-

- 页面未找到 -

-

- 抱歉,您访问的页面不存在或已被移除。 -

-
+
+
+
+
+

404

+

+ 页面未找到 +

+

+ 抱歉,您访问的页面不存在或已被移除。 +

+
-
- - - 返回首页 - - +
+ + + 返回首页 + + +
diff --git a/src/pages/Publicity.tsx b/src/pages/Publicity.tsx new file mode 100644 index 0000000..b602325 --- /dev/null +++ b/src/pages/Publicity.tsx @@ -0,0 +1,184 @@ +import { BackgroundImage, Image } from "@/components"; +import { getStaticImage } from "@/utils"; +import { useState } from "react"; +import { useNavigate } from "react-router-dom"; + +// 解答弹窗组件 +interface DialogBoxProps { + isOpen: boolean; + onClose: () => void; +} + +/** + * 功能列表 + * 1. 01工作室介绍 + * 2. 02带教活动 + * 3. 03带教心得 + * 4. 04成果展示 + */ +const functionList = [ + { + id: 1, + name: "01工作室介绍", + image: getStaticImage("publicity/01未选中.png"), + selectedImage: getStaticImage("publicity/01工作室介绍选中.png"), + position: "absolute bottom-25 left-[35%]", + }, + { + id: 2, + name: "02带教活动", + image: getStaticImage("publicity/02未选中.png"), + selectedImage: getStaticImage("publicity/02带教活动选中.png"), + position: "absolute bottom-65 left-[50%]", + }, + { + id: 3, + name: "03带教心得", + image: getStaticImage("publicity/03未选中.png"), + selectedImage: getStaticImage("publicity/03带教心得选中.png"), + position: "absolute bottom-100 left-[65%]", + }, + { + id: 4, + name: "04成果展示", + image: getStaticImage("publicity/04未选中.png"), + selectedImage: getStaticImage("publicity/04成果展示选中.png"), + position: "absolute bottom-130 left-[80%]", + }, +]; + +function DialogBox({ isOpen, onClose }: DialogBoxProps) { + if (!isOpen) return null; + + return ( +
+ {/* 遮罩层 */} + {/*
*/} + + {/* 解答框 */} + +
+ {/* 数字人头像 */} + 数字人头像 + {/* 关闭按钮 */} + 关闭按钮 + {/* 输入框 */} + + + + {/* icon语音输入和发送按钮 */} + + + +
+
+
+ ); +} + +export default function PublicityPage() { + const navigate = useNavigate(); + const [isDialogOpen, setIsDialogOpen] = useState(false); + const [selectedFunctionId, setSelectedFunctionId] = useState(0); + + const handleOpenDialog = () => { + setIsDialogOpen(true); + }; + + const handleCloseDialog = () => { + setIsDialogOpen(false); + }; + + return ( + + {/* 功能列表 */} + {functionList.map((item) => ( + {item.name} { + setSelectedFunctionId(item.id); + navigate(`/content/${item.id}`); + }} + /> + ))} + + 返回 { + navigate("/menu"); + }} + /> + + {/* 标题 */} + 标题 + + {/* 数字人 */} + 数字人 + + {/* 提示 */} + 提示 + + {/* 解答弹窗 */} + + + ); +} diff --git a/src/router/index.tsx b/src/router/index.tsx index ba34f7a..69fe68b 100644 --- a/src/router/index.tsx +++ b/src/router/index.tsx @@ -1,13 +1,14 @@ -import { createBrowserRouter, Navigate } from "react-router-dom"; +import { createHashRouter, Navigate } from "react-router-dom"; import Home from "@/pages/Home"; import Menu from "@/pages/Menu"; import NotFound from "@/pages/NotFound"; - +import Publicity from "@/pages/Publicity"; +import Content from "@/pages/Content"; /** * 应用路由配置 - * 使用 React Router v7 的 createBrowserRouter + * 使用 React Router v7 的 createHashRouter */ -const router = createBrowserRouter([ +const router = createHashRouter([ { path: "/", element: , @@ -21,6 +22,14 @@ const router = createBrowserRouter([ path: "/menu", element: , }, + { + path: "/publicity", + element: , + }, + { + path: "/content/:id", + element: , + }, { path: "*", element: , diff --git a/src/styles/input.css b/src/styles/input.css new file mode 100644 index 0000000..b087088 --- /dev/null +++ b/src/styles/input.css @@ -0,0 +1,23 @@ +input, textarea { + font-size: 20px; + letter-spacing: 1px; + outline: none; +} + +/* 输入框placeholder颜色 */ +input::placeholder, textarea::placeholder{ + font-size: 20px; + letter-spacing: 1px; +} + +/* 自定义滚动容器 - 隐藏滚动条 */ +.custom-scrollbar { + scrollbar-width: none; /* Firefox隐藏滚动条 */ + -ms-overflow-style: none; /* IE和Edge隐藏滚动条 */ + perspective: 1000px; +} + +/* Webkit浏览器(Chrome, Safari等)隐藏滚动条 */ +.custom-scrollbar::-webkit-scrollbar { + display: none; +} \ No newline at end of file diff --git a/vite.config.ts b/vite.config.ts index 2680889..2e22c82 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -4,6 +4,7 @@ import path from "path"; // https://vite.dev/config/ export default defineConfig({ + base: "./", plugins: [react()], resolve: { alias: {