Initial commit
This commit is contained in:
127
src/components/Footer/Footer.js
Normal file
127
src/components/Footer/Footer.js
Normal file
@@ -0,0 +1,127 @@
|
||||
/*!
|
||||
|
||||
=========================================================
|
||||
* Argon Dashboard Chakra PRO - v1.0.0
|
||||
=========================================================
|
||||
|
||||
* Product Page: https://www.creative-tim.com/product/argon-dashboard-chakra-pro
|
||||
* Copyright 2022 Creative Tim (https://www.creative-tim.com/)
|
||||
|
||||
* Designed and Coded by Simmmple & Creative Tim
|
||||
|
||||
=========================================================
|
||||
|
||||
* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
|
||||
*/
|
||||
|
||||
/*eslint-disable*/
|
||||
import React from "react";
|
||||
import { Flex, Link, List, ListItem, Text, VStack, HStack } from "@chakra-ui/react";
|
||||
|
||||
export default function Footer() {
|
||||
return (
|
||||
<Flex
|
||||
flexDirection={{
|
||||
base: "column",
|
||||
xl: "row",
|
||||
}}
|
||||
alignItems={{
|
||||
base: "center",
|
||||
xl: "start",
|
||||
}}
|
||||
justifyContent='space-between'
|
||||
px='30px'
|
||||
pb='20px'>
|
||||
<Text
|
||||
color='gray.400'
|
||||
textAlign={{
|
||||
base: "center",
|
||||
xl: "start",
|
||||
}}
|
||||
mb={{ base: "20px", xl: "0px" }}>
|
||||
© {1900 + new Date().getYear()},{" "}
|
||||
<Text as='span'>
|
||||
{document.documentElement.dir === "rtl"
|
||||
? " مصنوع من ❤️ بواسطة"
|
||||
: "Made with ❤️ by "}
|
||||
</Text>
|
||||
<Link
|
||||
color='blue.400'
|
||||
href='https://www.creative-tim.com'
|
||||
target='_blank'>
|
||||
{document.documentElement.dir === "rtl"
|
||||
? " توقيت الإبداعية"
|
||||
: "Creative Tim "}
|
||||
</Link>
|
||||
&
|
||||
<Link color='blue.400' href='https://www.simmmple.com' target='_blank'>
|
||||
{document.documentElement.dir === "rtl" ? "سيممبل " : " Simmmple"}
|
||||
</Link>
|
||||
{document.documentElement.dir === "rtl"
|
||||
? "للحصول على ويب أفضل"
|
||||
: " for a better web"}
|
||||
</Text>
|
||||
|
||||
{/* 添加备案信息 */}
|
||||
<VStack spacing={1} align={{base: "center", xl: "start"}} mb={{base: "20px", xl: "0px"}}>
|
||||
<HStack spacing={4} flexWrap="wrap" justify={{base: "center", xl: "start"}}>
|
||||
<Link
|
||||
color='gray.400'
|
||||
href='https://beian.mps.gov.cn/#/query/webSearch?code=11010802046286'
|
||||
target='_blank'
|
||||
rel='noreferrer'
|
||||
fontSize='xs'
|
||||
_hover={{color: 'gray.300'}}
|
||||
>
|
||||
京公网安备11010802046286号
|
||||
</Link>
|
||||
<Text color='gray.400' fontSize='xs'>
|
||||
京ICP备2025107343号-1
|
||||
</Text>
|
||||
</HStack>
|
||||
</VStack>
|
||||
|
||||
<List display='flex'>
|
||||
<ListItem
|
||||
me={{
|
||||
base: "20px",
|
||||
md: "44px",
|
||||
}}>
|
||||
<Link color='gray.400' href='https://www.creative-tim.com'>
|
||||
{document.documentElement.dir === "rtl"
|
||||
? "توقيت الإبداعية"
|
||||
: "Creative Tim"}
|
||||
</Link>
|
||||
</ListItem>
|
||||
<ListItem
|
||||
me={{
|
||||
base: "20px",
|
||||
md: "44px",
|
||||
}}>
|
||||
<Link color='gray.400' href='https://www.simmmple.com'>
|
||||
{document.documentElement.dir === "rtl" ? "سيممبل" : "Simmmple"}
|
||||
</Link>
|
||||
</ListItem>
|
||||
<ListItem
|
||||
me={{
|
||||
base: "20px",
|
||||
md: "44px",
|
||||
}}>
|
||||
<Link
|
||||
color='gray.400'
|
||||
href='https://creative-tim.com/blog'>
|
||||
{document.documentElement.dir === "rtl" ? "مدونة" : "Blog"}
|
||||
</Link>
|
||||
</ListItem>
|
||||
<ListItem>
|
||||
<Link
|
||||
color='gray.400'
|
||||
href='https://www.creative-tim.com/license'>
|
||||
{document.documentElement.dir === "rtl" ? "رخصة" : "License"}
|
||||
</Link>
|
||||
</ListItem>
|
||||
</List>
|
||||
</Flex>
|
||||
);
|
||||
}
|
||||
52
src/components/Footer/index.js
Normal file
52
src/components/Footer/index.js
Normal file
@@ -0,0 +1,52 @@
|
||||
import Section from "../Section/index.tsx";
|
||||
import Logo from "../Logo/index.js";
|
||||
|
||||
const Footer = () => (
|
||||
<Section
|
||||
className="pt-11 pb-6 px-5 lg:pt-[6.5rem] lg:px-7.5 lg:pb-12 xl:px-10"
|
||||
crosses
|
||||
customPaddings
|
||||
>
|
||||
<div className="flex items-center justify-center h-[6.5rem] mb-6 border-b border-n-6 lg:justify-start">
|
||||
<Logo />
|
||||
<nav className="hidden lg:flex items-center justify-center ml-auto">
|
||||
<a
|
||||
className="text-n-1/50 font-code text-xs font-bold uppercase tracking-wider transition-colors hover:text-n-1 mr-10"
|
||||
href="/features"
|
||||
>
|
||||
特性功能
|
||||
</a>
|
||||
<a
|
||||
className="text-n-1/50 font-code text-xs font-bold uppercase tracking-wider transition-colors hover:text-n-1 mr-10"
|
||||
href="/pricing"
|
||||
>
|
||||
定价方案
|
||||
</a>
|
||||
<a
|
||||
className="text-n-1/50 font-code text-xs font-bold uppercase tracking-wider transition-colors hover:text-n-1"
|
||||
href="/how-to-use"
|
||||
>
|
||||
使用指南
|
||||
</a>
|
||||
</nav>
|
||||
</div>
|
||||
<div className="flex flex-col items-center space-y-2">
|
||||
<p className="caption text-n-4 lg:block">
|
||||
© 2024 价值前沿. 保留所有权利.
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row items-center space-y-1 sm:space-y-0 sm:space-x-4 text-xs text-n-4">
|
||||
<a
|
||||
href="https://beian.mps.gov.cn/#/query/webSearch?code=11010802046286"
|
||||
rel="noreferrer"
|
||||
target="_blank"
|
||||
className="hover:text-n-1 transition-colors"
|
||||
>
|
||||
京公网安备11010802046286号
|
||||
</a>
|
||||
<span className="text-n-4">京ICP备2025107343号-1</span>
|
||||
</div>
|
||||
</div>
|
||||
</Section>
|
||||
);
|
||||
|
||||
export default Footer;
|
||||
Reference in New Issue
Block a user