mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-13 23:16:47 +00:00
修复starter主题，部分不支持inline_config
This commit is contained in:
tangly1024.com
@@ -1,195 +1,178 @@
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
/* eslint-disable react/no-unescaped-entities */
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import CONFIG from '../config'
|
||||
|
||||
/**
|
||||
* 首页的关于模块
|
||||
*/
|
||||
export const About = () => {
|
||||
return <>
|
||||
{/* <!-- ====== About Section Start --> */}
|
||||
<section
|
||||
id="about"
|
||||
className="bg-gray-1 pb-8 pt-20 dark:bg-dark-2 lg:pb-[70px] lg:pt-[120px]"
|
||||
>
|
||||
<div className="container">
|
||||
<div className="wow fadeInUp" data-wow-delay=".2s">
|
||||
<div className="-mx-4 flex flex-wrap items-center">
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== About Section Start --> */}
|
||||
<section
|
||||
id='about'
|
||||
className='bg-gray-1 pb-8 pt-20 dark:bg-dark-2 lg:pb-[70px] lg:pt-[120px]'>
|
||||
<div className='container'>
|
||||
<div className='wow fadeInUp' data-wow-delay='.2s'>
|
||||
<div className='-mx-4 flex flex-wrap items-center'>
|
||||
{/* 左侧的文字说明板块 */}
|
||||
<div className='w-full px-4 lg:w-1/2'>
|
||||
<div className='mb-12 max-w-[540px] lg:mb-0'>
|
||||
<h2 className='mb-5 text-3xl font-bold leading-tight text-dark dark:text-white sm:text-[40px] sm:leading-[1.2]'>
|
||||
{siteConfig('STARTER_ABOUT_TITLE')}
|
||||
</h2>
|
||||
<p
|
||||
className='mb-10 text-base leading-relaxed text-body-color dark:text-dark-6'
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: siteConfig('STARTER_ABOUT_TEXT')
|
||||
}}></p>
|
||||
|
||||
{/* 左侧的文字说明板块 */}
|
||||
<div className="w-full px-4 lg:w-1/2">
|
||||
<div className="mb-12 max-w-[540px] lg:mb-0">
|
||||
<h2
|
||||
className="mb-5 text-3xl font-bold leading-tight text-dark dark:text-white sm:text-[40px] sm:leading-[1.2]"
|
||||
>
|
||||
{siteConfig('STARTER_ABOUT_TITLE', null, CONFIG)}
|
||||
</h2>
|
||||
<p className="mb-10 text-base leading-relaxed text-body-color dark:text-dark-6"
|
||||
dangerouslySetInnerHTML={
|
||||
{ __html: siteConfig('STARTER_ABOUT_TEXT', null, CONFIG) }
|
||||
}></p>
|
||||
|
||||
<a
|
||||
href={siteConfig('STARTER_ABOUT_BUTTON_URL', null, CONFIG)}
|
||||
className="inline-flex items-center justify-center rounded-md border border-primary bg-primary px-7 py-3 text-center text-base font-medium text-white hover:border-blue-dark hover:bg-blue-dark"
|
||||
>
|
||||
{siteConfig('STARTER_ABOUT_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 右侧的图片海报 */}
|
||||
<div className="w-full px-4 lg:w-1/2">
|
||||
<div className="-mx-2 flex flex-wrap sm:-mx-4 lg:-mx-2 xl:-mx-4">
|
||||
<div className="w-full px-2 sm:w-1/2 sm:px-4 lg:px-2 xl:px-4">
|
||||
<div
|
||||
className="mb-4 sm:mb-8 sm:h-[400px] md:h-[540px] lg:h-[400px] xl:h-[500px]"
|
||||
>
|
||||
<img
|
||||
src={siteConfig('STARTER_ABOUT_IMAGE_1', null, CONFIG)}
|
||||
alt="about image"
|
||||
className="h-full w-full object-cover object-center"
|
||||
/>
|
||||
</div>
|
||||
<a
|
||||
href={siteConfig('STARTER_ABOUT_BUTTON_URL')}
|
||||
className='inline-flex items-center justify-center rounded-md border border-primary bg-primary px-7 py-3 text-center text-base font-medium text-white hover:border-blue-dark hover:bg-blue-dark'>
|
||||
{siteConfig('STARTER_ABOUT_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full px-2 sm:w-1/2 sm:px-4 lg:px-2 xl:px-4">
|
||||
<div
|
||||
className="mb-4 sm:mb-8 sm:h-[220px] md:h-[346px] lg:mb-4 lg:h-[225px] xl:mb-8 xl:h-[310px]"
|
||||
>
|
||||
<img
|
||||
src={siteConfig('STARTER_ABOUT_IMAGE_2', null, CONFIG)}
|
||||
alt="about image"
|
||||
className="h-full w-full object-cover object-center"
|
||||
/>
|
||||
{/* 右侧的图片海报 */}
|
||||
<div className='w-full px-4 lg:w-1/2'>
|
||||
<div className='-mx-2 flex flex-wrap sm:-mx-4 lg:-mx-2 xl:-mx-4'>
|
||||
<div className='w-full px-2 sm:w-1/2 sm:px-4 lg:px-2 xl:px-4'>
|
||||
<div className='mb-4 sm:mb-8 sm:h-[400px] md:h-[540px] lg:h-[400px] xl:h-[500px]'>
|
||||
<img
|
||||
src={siteConfig('STARTER_ABOUT_IMAGE_1')}
|
||||
alt='about image'
|
||||
className='h-full w-full object-cover object-center'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
className="relative z-10 mb-4 flex items-center justify-center overflow-hidden bg-primary px-6 py-12 sm:mb-8 sm:h-[160px] sm:p-5 lg:mb-4 xl:mb-8"
|
||||
>
|
||||
<div>
|
||||
<span className="block text-5xl font-extrabold text-white">
|
||||
{siteConfig('STARTER_ABOUT_TIPS_1', null, CONFIG)}
|
||||
</span>
|
||||
<span className="block text-base font-semibold text-white">
|
||||
{siteConfig('STARTER_ABOUT_TIPS_2', null, CONFIG)}
|
||||
</span>
|
||||
<span
|
||||
className="block text-base font-medium text-white text-opacity-70"
|
||||
>
|
||||
{siteConfig('STARTER_ABOUT_TIPS_3', null, CONFIG)}
|
||||
</span>
|
||||
<div className='w-full px-2 sm:w-1/2 sm:px-4 lg:px-2 xl:px-4'>
|
||||
<div className='mb-4 sm:mb-8 sm:h-[220px] md:h-[346px] lg:mb-4 lg:h-[225px] xl:mb-8 xl:h-[310px]'>
|
||||
<img
|
||||
src={siteConfig('STARTER_ABOUT_IMAGE_2')}
|
||||
alt='about image'
|
||||
className='h-full w-full object-cover object-center'
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<span className="absolute left-0 top-0 -z-10">
|
||||
<svg
|
||||
width="106"
|
||||
height="144"
|
||||
viewBox="0 0 106 144"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect
|
||||
opacity="0.1"
|
||||
x="-67"
|
||||
y="47.127"
|
||||
width="113.378"
|
||||
height="131.304"
|
||||
transform="rotate(-42.8643 -67 47.127)"
|
||||
fill="url(#paint0_linear_1416_214)"
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id="paint0_linear_1416_214"
|
||||
x1="-10.3111"
|
||||
y1="47.127"
|
||||
x2="-10.3111"
|
||||
y2="178.431"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop stopColor="white" />
|
||||
<stop
|
||||
offset="1"
|
||||
stopColor="white"
|
||||
stopOpacity="0"
|
||||
/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</span>
|
||||
<span className="absolute right-0 top-0 -z-10">
|
||||
<svg
|
||||
width="130"
|
||||
height="97"
|
||||
viewBox="0 0 130 97"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect
|
||||
opacity="0.1"
|
||||
x="0.86792"
|
||||
y="-6.67725"
|
||||
width="155.563"
|
||||
height="140.614"
|
||||
transform="rotate(-42.8643 0.86792 -6.67725)"
|
||||
fill="url(#paint0_linear_1416_215)"
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id="paint0_linear_1416_215"
|
||||
x1="78.6495"
|
||||
y1="-6.67725"
|
||||
x2="78.6495"
|
||||
y2="133.937"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop stopColor="white" />
|
||||
<stop
|
||||
offset="1"
|
||||
stopColor="white"
|
||||
stopOpacity="0"
|
||||
/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</span>
|
||||
<span className="absolute bottom-0 right-0 -z-10">
|
||||
<svg
|
||||
width="175"
|
||||
height="104"
|
||||
viewBox="0 0 175 104"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect
|
||||
opacity="0.1"
|
||||
x="175.011"
|
||||
y="108.611"
|
||||
width="101.246"
|
||||
height="148.179"
|
||||
transform="rotate(137.136 175.011 108.611)"
|
||||
fill="url(#paint0_linear_1416_216)"
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id="paint0_linear_1416_216"
|
||||
x1="225.634"
|
||||
y1="108.611"
|
||||
x2="225.634"
|
||||
y2="256.79"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop stopColor="white" />
|
||||
<stop
|
||||
offset="1"
|
||||
stopColor="white"
|
||||
stopOpacity="0"
|
||||
/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<div className='relative z-10 mb-4 flex items-center justify-center overflow-hidden bg-primary px-6 py-12 sm:mb-8 sm:h-[160px] sm:p-5 lg:mb-4 xl:mb-8'>
|
||||
<div>
|
||||
<span className='block text-5xl font-extrabold text-white'>
|
||||
{siteConfig('STARTER_ABOUT_TIPS_1')}
|
||||
</span>
|
||||
<span className='block text-base font-semibold text-white'>
|
||||
{siteConfig('STARTER_ABOUT_TIPS_2')}
|
||||
</span>
|
||||
<span className='block text-base font-medium text-white text-opacity-70'>
|
||||
{siteConfig('STARTER_ABOUT_TIPS_3')}
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span className='absolute left-0 top-0 -z-10'>
|
||||
<svg
|
||||
width='106'
|
||||
height='144'
|
||||
viewBox='0 0 106 144'
|
||||
fill='none'
|
||||
xmlns='http://www.w3.org/2000/svg'>
|
||||
<rect
|
||||
opacity='0.1'
|
||||
x='-67'
|
||||
y='47.127'
|
||||
width='113.378'
|
||||
height='131.304'
|
||||
transform='rotate(-42.8643 -67 47.127)'
|
||||
fill='url(#paint0_linear_1416_214)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id='paint0_linear_1416_214'
|
||||
x1='-10.3111'
|
||||
y1='47.127'
|
||||
x2='-10.3111'
|
||||
y2='178.431'
|
||||
gradientUnits='userSpaceOnUse'>
|
||||
<stop stopColor='white' />
|
||||
<stop
|
||||
offset='1'
|
||||
stopColor='white'
|
||||
stopOpacity='0'
|
||||
/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</span>
|
||||
<span className='absolute right-0 top-0 -z-10'>
|
||||
<svg
|
||||
width='130'
|
||||
height='97'
|
||||
viewBox='0 0 130 97'
|
||||
fill='none'
|
||||
xmlns='http://www.w3.org/2000/svg'>
|
||||
<rect
|
||||
opacity='0.1'
|
||||
x='0.86792'
|
||||
y='-6.67725'
|
||||
width='155.563'
|
||||
height='140.614'
|
||||
transform='rotate(-42.8643 0.86792 -6.67725)'
|
||||
fill='url(#paint0_linear_1416_215)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id='paint0_linear_1416_215'
|
||||
x1='78.6495'
|
||||
y1='-6.67725'
|
||||
x2='78.6495'
|
||||
y2='133.937'
|
||||
gradientUnits='userSpaceOnUse'>
|
||||
<stop stopColor='white' />
|
||||
<stop
|
||||
offset='1'
|
||||
stopColor='white'
|
||||
stopOpacity='0'
|
||||
/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</span>
|
||||
<span className='absolute bottom-0 right-0 -z-10'>
|
||||
<svg
|
||||
width='175'
|
||||
height='104'
|
||||
viewBox='0 0 175 104'
|
||||
fill='none'
|
||||
xmlns='http://www.w3.org/2000/svg'>
|
||||
<rect
|
||||
opacity='0.1'
|
||||
x='175.011'
|
||||
y='108.611'
|
||||
width='101.246'
|
||||
height='148.179'
|
||||
transform='rotate(137.136 175.011 108.611)'
|
||||
fill='url(#paint0_linear_1416_216)'
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id='paint0_linear_1416_216'
|
||||
x1='225.634'
|
||||
y1='108.611'
|
||||
x2='225.634'
|
||||
y2='256.79'
|
||||
gradientUnits='userSpaceOnUse'>
|
||||
<stop stopColor='white' />
|
||||
<stop
|
||||
offset='1'
|
||||
stopColor='white'
|
||||
stopOpacity='0'
|
||||
/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -197,8 +180,8 @@ export const About = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* <!-- ====== About Section End --> */}
|
||||
</section>
|
||||
{/* <!-- ====== About Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,41 +1,45 @@
|
||||
import throttle from 'lodash.throttle';
|
||||
import throttle from 'lodash.throttle'
|
||||
import { useCallback, useEffect } from 'react'
|
||||
|
||||
/**
|
||||
* 回顶按钮
|
||||
* @returns
|
||||
*/
|
||||
export const BackToTopButton = () => {
|
||||
useEffect(() => {
|
||||
// ====== scroll top js
|
||||
function scrollTo(element, to = 0, duration = 500) {
|
||||
const start = element.scrollTop;
|
||||
const change = to - start;
|
||||
const increment = 20;
|
||||
let currentTime = 0;
|
||||
const start = element.scrollTop
|
||||
const change = to - start
|
||||
const increment = 20
|
||||
let currentTime = 0
|
||||
|
||||
const animateScroll = () => {
|
||||
currentTime += increment;
|
||||
currentTime += increment
|
||||
|
||||
const val = Math.easeInOutQuad(currentTime, start, change, duration);
|
||||
const val = Math.easeInOutQuad(currentTime, start, change, duration)
|
||||
|
||||
element.scrollTop = val;
|
||||
element.scrollTop = val
|
||||
|
||||
if (currentTime < duration) {
|
||||
setTimeout(animateScroll, increment);
|
||||
setTimeout(animateScroll, increment)
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
animateScroll();
|
||||
animateScroll()
|
||||
}
|
||||
|
||||
Math.easeInOutQuad = function (t, b, c, d) {
|
||||
t /= d / 2;
|
||||
if (t < 1) return (c / 2) * t * t + b;
|
||||
t--;
|
||||
return (-c / 2) * (t * (t - 2) - 1) + b;
|
||||
};
|
||||
t /= d / 2
|
||||
if (t < 1) return (c / 2) * t * t + b
|
||||
t--
|
||||
return (-c / 2) * (t * (t - 2) - 1) + b
|
||||
}
|
||||
const backToTop = document.querySelector('.back-to-top')
|
||||
if (backToTop) {
|
||||
backToTop.onclick = () => {
|
||||
scrollTo(document.documentElement);
|
||||
};
|
||||
scrollTo(document.documentElement)
|
||||
}
|
||||
}
|
||||
|
||||
window.addEventListener('scroll', navBarScollListener)
|
||||
@@ -48,20 +52,22 @@ export const BackToTopButton = () => {
|
||||
const throttleMs = 200
|
||||
const navBarScollListener = useCallback(
|
||||
throttle(() => {
|
||||
const scrollY = window.scrollY;
|
||||
const scrollY = window.scrollY
|
||||
// 显示或隐藏返回顶部按钮
|
||||
const backToTop = document.querySelector('.back-to-top');
|
||||
const backToTop = document.querySelector('.back-to-top')
|
||||
if (backToTop) {
|
||||
backToTop.style.display = scrollY > 50 ? 'flex' : 'none';
|
||||
backToTop.style.display = scrollY > 50 ? 'flex' : 'none'
|
||||
}
|
||||
}, throttleMs)
|
||||
)
|
||||
|
||||
return <>
|
||||
{/* <!-- ====== Back To Top Start --> */}
|
||||
<a className="back-to-top fixed bottom-16 left-auto right-8 z-[999] hidden h-10 w-10 items-center justify-center rounded-md bg-primary text-white shadow-md transition duration-300 ease-in-out hover:bg-dark">
|
||||
<span className="mt-[6px] h-3 w-3 rotate-45 border-l border-t border-white" ></span>
|
||||
</a>
|
||||
{/* <!-- ====== Back To Top End --> */}
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Back To Top Start --> */}
|
||||
<a className='back-to-top fixed bottom-16 left-auto right-8 z-[999] hidden h-10 w-10 items-center justify-center rounded-md bg-primary text-white shadow-md transition duration-300 ease-in-out hover:bg-dark'>
|
||||
<span className='mt-[6px] h-3 w-3 rotate-45 border-l border-t border-white'></span>
|
||||
</a>
|
||||
{/* <!-- ====== Back To Top End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,30 +1,25 @@
|
||||
/**
|
||||
* 详情页面顶部条
|
||||
* 页面顶部宣传栏
|
||||
* @returns
|
||||
*/
|
||||
export const Banner = ({ title, description }) => {
|
||||
return <>
|
||||
{/* <!-- ====== Banner Section Start --> */}
|
||||
<div
|
||||
className="relative z-10 overflow-hidden pb-[60px] pt-[120px] dark:bg-dark md:pt-[130px] lg:pt-[160px]"
|
||||
>
|
||||
<div
|
||||
className="absolute bottom-0 left-0 w-full h-px bg-gradient-to-r from-stroke/0 via-stroke to-stroke/0 dark:via-dark-3"
|
||||
></div>
|
||||
<div className="container">
|
||||
<div className="flex flex-wrap items-center -mx-4">
|
||||
<div className="w-full px-4">
|
||||
<div className="text-center">
|
||||
<h1
|
||||
className="mb-4 text-3xl font-bold text-dark dark:text-white sm:text-4xl md:text-[40px] md:leading-[1.2]"
|
||||
>
|
||||
{title}
|
||||
</h1>
|
||||
<p className="mb-5 text-base text-body-color dark:text-dark-6">
|
||||
{description}
|
||||
</p>
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Banner Section Start --> */}
|
||||
<div className='relative z-10 overflow-hidden pb-[60px] pt-[120px] dark:bg-dark md:pt-[130px] lg:pt-[160px]'>
|
||||
<div className='absolute bottom-0 left-0 w-full h-px bg-gradient-to-r from-stroke/0 via-stroke to-stroke/0 dark:via-dark-3'></div>
|
||||
<div className='container'>
|
||||
<div className='flex flex-wrap items-center -mx-4'>
|
||||
<div className='w-full px-4'>
|
||||
<div className='text-center'>
|
||||
<h1 className='mb-4 text-3xl font-bold text-dark dark:text-white sm:text-4xl md:text-[40px] md:leading-[1.2]'>
|
||||
{title}
|
||||
</h1>
|
||||
<p className='mb-5 text-base text-body-color dark:text-dark-6'>
|
||||
{description}
|
||||
</p>
|
||||
|
||||
{/* <ul className="flex items-center justify-center gap-[10px]">
|
||||
{/* <ul className="flex items-center justify-center gap-[10px]">
|
||||
<li>
|
||||
<a
|
||||
href="index.html"
|
||||
@@ -43,11 +38,12 @@ export const Banner = ({ title, description }) => {
|
||||
</a>
|
||||
</li>
|
||||
</ul> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <!-- ====== Banner Section End --> */}
|
||||
{/* <!-- ====== Banner Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import Link from 'next/link'
|
||||
import CONFIG from '../config'
|
||||
|
||||
/**
|
||||
* 博文列表
|
||||
@@ -19,14 +18,14 @@ export const Blog = ({ posts }) => {
|
||||
<div className='w-full px-4'>
|
||||
<div className='mx-auto mb-[60px] max-w-[485px] text-center'>
|
||||
<span className='mb-2 block text-lg font-semibold text-primary'>
|
||||
{siteConfig('STARTER_BLOG_TITLE', null, CONFIG)}
|
||||
{siteConfig('STARTER_BLOG_TITLE')}
|
||||
</span>
|
||||
<h2 className='mb-4 text-3xl font-bold text-dark dark:text-white sm:text-4xl md:text-[40px] md:leading-[1.2]'>
|
||||
{siteConfig('STARTER_BLOG_TEXT_1', null, CONFIG)}
|
||||
{siteConfig('STARTER_BLOG_TEXT_1')}
|
||||
</h2>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: siteConfig('STARTER_BLOG_TEXT_2', null, CONFIG)
|
||||
__html: siteConfig('STARTER_BLOG_TEXT_2')
|
||||
}}
|
||||
className='text-base text-body-color dark:text-dark-6'></p>
|
||||
</div>
|
||||
|
||||
@@ -1,37 +1,39 @@
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
|
||||
import CONFIG from '../config'
|
||||
import { siteConfig } from '@/lib/config'
|
||||
|
||||
/**
|
||||
* 合作伙伴
|
||||
* @returns
|
||||
*/
|
||||
export const Brand = () => {
|
||||
return <>
|
||||
|
||||
{/* <!-- ====== Brands Section Start --> */}
|
||||
<section className="pb-20 dark:bg-dark">
|
||||
<div className="container px-4">
|
||||
<div
|
||||
className="-mx-4 flex flex-wrap items-center justify-center gap-8 xl:gap-11"
|
||||
>
|
||||
{CONFIG.STARTER_BRANDS?.map((item, index) => {
|
||||
return <a key={index} href={item.URL}>
|
||||
<img
|
||||
src={item.IMAGE}
|
||||
alt={item.TITLE}
|
||||
className="dark:hidden"
|
||||
/>
|
||||
<img
|
||||
src={item.IMAGE_WHITE}
|
||||
alt={item.TITLE}
|
||||
className="hidden dark:block"
|
||||
/>
|
||||
</a>
|
||||
})}
|
||||
const brands = siteConfig('STARTER_BRANDS')
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Brands Section Start --> */}
|
||||
<section className='pb-20 dark:bg-dark'>
|
||||
<div className='container px-4'>
|
||||
<div className='-mx-4 flex flex-wrap items-center justify-center gap-8 xl:gap-11'>
|
||||
{brands?.map((item, index) => {
|
||||
return (
|
||||
<a key={index} href={item.URL}>
|
||||
<img
|
||||
src={item.IMAGE}
|
||||
alt={item.TITLE}
|
||||
className='dark:hidden'
|
||||
/>
|
||||
<img
|
||||
src={item.IMAGE_WHITE}
|
||||
alt={item.TITLE}
|
||||
className='hidden dark:block'
|
||||
/>
|
||||
</a>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* <!-- ====== Brands Section End --> */}
|
||||
</section>
|
||||
{/* <!-- ====== Brands Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,106 +1,111 @@
|
||||
import { siteConfig } from '@/lib/config'
|
||||
|
||||
/**
|
||||
* CTA，用于创建一个呼吁用户行动的部分（Call To Action，简称 CTA）。
|
||||
* 该组件通过以下方式激励用户进行特定操作
|
||||
* 用户的公告栏内容将在此显示
|
||||
**/
|
||||
export const CTA = () => {
|
||||
return <>
|
||||
|
||||
{/* <!-- ====== CTA Section Start --> */}
|
||||
<section
|
||||
className="relative z-10 overflow-hidden bg-primary py-20 lg:py-[115px]"
|
||||
>
|
||||
<div className="container mx-auto">
|
||||
<div className="relative overflow-hidden">
|
||||
<div className="-mx-4 flex flex-wrap items-stretch">
|
||||
<div className="w-full px-4">
|
||||
<div className="mx-auto max-w-[570px] text-center">
|
||||
<h2
|
||||
className="mb-2.5 text-3xl font-bold text-white md:text-[38px] md:leading-[1.44]"
|
||||
>
|
||||
<span>What Are You Looking For?</span>
|
||||
<span className="text-3xl font-normal md:text-[40px]">
|
||||
Get Started Now
|
||||
</span>
|
||||
</h2>
|
||||
<p
|
||||
className="mx-auto mb-6 max-w-[515px] text-base leading-[1.5] text-white"
|
||||
>
|
||||
There are many variations of passages of Lorem Ipsum but the
|
||||
majority have suffered in some form.
|
||||
</p>
|
||||
<a
|
||||
|
||||
className="inline-block rounded-md border border-transparent bg-secondary px-7 py-3 text-base font-medium text-white transition hover:bg-[#0BB489]"
|
||||
>
|
||||
Start using Play
|
||||
</a>
|
||||
if (!siteConfig('STARTER_CTA_ENABLE')) {
|
||||
return <></>
|
||||
}
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== CTA Section Start --> */}
|
||||
<section className='relative z-10 overflow-hidden bg-primary py-20 lg:py-[115px]'>
|
||||
<div className='container mx-auto'>
|
||||
<div className='relative overflow-hidden'>
|
||||
<div className='-mx-4 flex flex-wrap items-stretch'>
|
||||
<div className='w-full px-4'>
|
||||
<div className='mx-auto max-w-[570px] text-center'>
|
||||
<h2 className='mb-2.5 text-3xl font-bold text-white md:text-[38px] md:leading-[1.44]'>
|
||||
<span>{siteConfig('STARTER_CTA_TITLE')}</span>
|
||||
<span className='text-3xl font-normal md:text-[40px]'>
|
||||
{siteConfig('STARTER_CTA_TITLE_2')}
|
||||
</span>
|
||||
</h2>
|
||||
<p className='mx-auto mb-6 max-w-[515px] text-base leading-[1.5] text-white'>
|
||||
{siteConfig('STARTER_CTA_DESCRIOTN')}
|
||||
</p>
|
||||
{siteConfig('STARTER_CTA_BUTTON') && (
|
||||
<>
|
||||
<a
|
||||
href={siteConfig('STARTER_CTA_BUTTON_URL')}
|
||||
className='inline-block rounded-md border border-transparent bg-secondary px-7 py-3 text-base font-medium text-white transition hover:bg-[#0BB489]'>
|
||||
{siteConfig('STARTER_CTA_BUTTON_TEXT')}
|
||||
</a>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<span className="absolute left-0 top-0">
|
||||
<svg
|
||||
width="495"
|
||||
height="470"
|
||||
viewBox="0 0 495 470"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<circle
|
||||
cx="55"
|
||||
cy="442"
|
||||
r="138"
|
||||
stroke="white"
|
||||
stroke-opacity="0.04"
|
||||
stroke-width="50"
|
||||
/>
|
||||
<circle
|
||||
cx="446"
|
||||
r="39"
|
||||
stroke="white"
|
||||
stroke-opacity="0.04"
|
||||
stroke-width="20"
|
||||
/>
|
||||
<path
|
||||
d="M245.406 137.609L233.985 94.9852L276.609 106.406L245.406 137.609Z"
|
||||
stroke="white"
|
||||
stroke-opacity="0.08"
|
||||
stroke-width="12"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span className="absolute bottom-0 right-0">
|
||||
<svg
|
||||
width="493"
|
||||
height="470"
|
||||
viewBox="0 0 493 470"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<circle
|
||||
cx="462"
|
||||
cy="5"
|
||||
r="138"
|
||||
stroke="white"
|
||||
stroke-opacity="0.04"
|
||||
stroke-width="50"
|
||||
/>
|
||||
<circle
|
||||
cx="49"
|
||||
cy="470"
|
||||
r="39"
|
||||
stroke="white"
|
||||
stroke-opacity="0.04"
|
||||
stroke-width="20"
|
||||
/>
|
||||
<path
|
||||
d="M222.393 226.701L272.808 213.192L259.299 263.607L222.393 226.701Z"
|
||||
stroke="white"
|
||||
stroke-opacity="0.06"
|
||||
stroke-width="13"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
{/* <!-- ====== CTA Section End --> */}
|
||||
<div>
|
||||
<span className='absolute left-0 top-0'>
|
||||
<svg
|
||||
width='495'
|
||||
height='470'
|
||||
viewBox='0 0 495 470'
|
||||
fill='none'
|
||||
xmlns='http://www.w3.org/2000/svg'>
|
||||
<circle
|
||||
cx='55'
|
||||
cy='442'
|
||||
r='138'
|
||||
stroke='white'
|
||||
stroke-opacity='0.04'
|
||||
stroke-width='50'
|
||||
/>
|
||||
<circle
|
||||
cx='446'
|
||||
r='39'
|
||||
stroke='white'
|
||||
stroke-opacity='0.04'
|
||||
stroke-width='20'
|
||||
/>
|
||||
<path
|
||||
d='M245.406 137.609L233.985 94.9852L276.609 106.406L245.406 137.609Z'
|
||||
stroke='white'
|
||||
stroke-opacity='0.08'
|
||||
stroke-width='12'
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span className='absolute bottom-0 right-0'>
|
||||
<svg
|
||||
width='493'
|
||||
height='470'
|
||||
viewBox='0 0 493 470'
|
||||
fill='none'
|
||||
xmlns='http://www.w3.org/2000/svg'>
|
||||
<circle
|
||||
cx='462'
|
||||
cy='5'
|
||||
r='138'
|
||||
stroke='white'
|
||||
stroke-opacity='0.04'
|
||||
stroke-width='50'
|
||||
/>
|
||||
<circle
|
||||
cx='49'
|
||||
cy='470'
|
||||
r='39'
|
||||
stroke='white'
|
||||
stroke-opacity='0.04'
|
||||
stroke-width='20'
|
||||
/>
|
||||
<path
|
||||
d='M222.393 226.701L272.808 213.192L259.299 263.607L222.393 226.701Z'
|
||||
stroke='white'
|
||||
stroke-opacity='0.06'
|
||||
stroke-width='13'
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
{/* <!-- ====== CTA Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -5,6 +5,7 @@ import { SVGLocation } from './svg/SVGLocation'
|
||||
|
||||
/* eslint-disable react/no-unescaped-entities */
|
||||
export const Contact = () => {
|
||||
const url = siteConfig('STARTER_CONTACT_MSG_EXTERNAL_URL')
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Contact Start ====== --> */}
|
||||
@@ -18,10 +19,10 @@ export const Contact = () => {
|
||||
<div className='ud-contact-content-wrapper'>
|
||||
<div className='ud-contact-title mb-12 lg:mb-[150px]'>
|
||||
<span className='mb-6 block text-base font-medium text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_CONTACT_TITLE', null, CONFIG)}
|
||||
{siteConfig('STARTER_CONTACT_TITLE')}
|
||||
</span>
|
||||
<h2 className='max-w-[260px] text-[35px] font-semibold leading-[1.14] text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_CONTACT_TEXT', null, CONFIG)}
|
||||
{siteConfig('STARTER_CONTACT_TEXT')}
|
||||
</h2>
|
||||
</div>
|
||||
<div className='mb-12 flex flex-wrap justify-between lg:mb-0'>
|
||||
@@ -59,7 +60,7 @@ export const Contact = () => {
|
||||
)}
|
||||
</h5>
|
||||
<p className='text-base text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_CONTACT_EMAIL_TEXT', null, CONFIG)}
|
||||
{siteConfig('STARTER_CONTACT_EMAIL_TEXT')}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -67,7 +68,7 @@ export const Contact = () => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{siteConfig('STARTER_CONTACT_MSG_EXTERNAL_URL', null, CONFIG) && (
|
||||
{url && url !== '' && (
|
||||
<>
|
||||
{/* 联系方式右侧留言 */}
|
||||
<div className='w-full px-4 lg:w-5/12 xl:w-4/12'>
|
||||
|
||||
@@ -1,137 +1,120 @@
|
||||
import { siteConfig } from '@/lib/config';
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import { useEffect } from 'react'
|
||||
import CONFIG from '../config';
|
||||
import { SVGQuestion } from './svg/SVGQuestion';
|
||||
import { SVGCircleBG } from './svg/SVGCircleBG';
|
||||
import { SVGCircleBG } from './svg/SVGCircleBG'
|
||||
import { SVGQuestion } from './svg/SVGQuestion'
|
||||
|
||||
export const FAQ = () => {
|
||||
useEffect(() => {
|
||||
// ===== Faq accordion
|
||||
const faqs = document.querySelectorAll('.single-faq');
|
||||
faqs.forEach((el) => {
|
||||
const faqs = document.querySelectorAll('.single-faq')
|
||||
faqs.forEach(el => {
|
||||
el.querySelector('.faq-btn').addEventListener('click', () => {
|
||||
el.querySelector('.icon').classList.toggle('rotate-180');
|
||||
el.querySelector('.faq-content').classList.toggle('hidden');
|
||||
});
|
||||
});
|
||||
el.querySelector('.icon').classList.toggle('rotate-180')
|
||||
el.querySelector('.faq-content').classList.toggle('hidden')
|
||||
})
|
||||
})
|
||||
})
|
||||
return <>
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== FAQ Section Start --> */}
|
||||
<section
|
||||
className="relative z-20 overflow-hidden bg-white pb-8 pt-20 dark:bg-dark lg:pb-[50px] lg:pt-[120px]"
|
||||
>
|
||||
<div className="container mx-auto">
|
||||
<div className="-mx-4 flex flex-wrap">
|
||||
<div className="w-full px-4">
|
||||
<div className="mx-auto mb-[60px] max-w-[520px] text-center">
|
||||
<span className="mb-2 block text-lg font-semibold text-primary">
|
||||
{siteConfig('STARTER_FAQ_TITLE', null, CONFIG)}
|
||||
</span>
|
||||
<h2
|
||||
className="mb-3 text-3xl font-bold leading-[1.2] text-dark dark:text-white sm:text-4xl md:text-[40px]"
|
||||
>
|
||||
{siteConfig('STARTER_FAQ_TEXT_1', null, CONFIG)}
|
||||
</h2>
|
||||
<p
|
||||
className="mx-auto max-w-[485px] text-base text-body-color dark:text-dark-6"
|
||||
>
|
||||
{siteConfig('STARTER_FAQ_TEXT_2', null, CONFIG)}
|
||||
</p>
|
||||
<section className='relative z-20 overflow-hidden bg-white pb-8 pt-20 dark:bg-dark lg:pb-[50px] lg:pt-[120px]'>
|
||||
<div className='container mx-auto'>
|
||||
<div className='-mx-4 flex flex-wrap'>
|
||||
<div className='w-full px-4'>
|
||||
<div className='mx-auto mb-[60px] max-w-[520px] text-center'>
|
||||
<span className='mb-2 block text-lg font-semibold text-primary'>
|
||||
{siteConfig('STARTER_FAQ_TITLE')}
|
||||
</span>
|
||||
<h2 className='mb-3 text-3xl font-bold leading-[1.2] text-dark dark:text-white sm:text-4xl md:text-[40px]'>
|
||||
{siteConfig('STARTER_FAQ_TEXT_1')}
|
||||
</h2>
|
||||
<p className='mx-auto max-w-[485px] text-base text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_FAQ_TEXT_2')}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='-mx-4 flex flex-wrap'>
|
||||
<div className='w-full px-4 lg:w-1/2'>
|
||||
<div className='mb-12 flex lg:mb-[70px]'>
|
||||
<div className='mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]'>
|
||||
<SVGQuestion />
|
||||
</div>
|
||||
<div className='w-full'>
|
||||
<h3 className='mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl'>
|
||||
{siteConfig('STARTER_FAQ_1_QUESTION')}
|
||||
</h3>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: siteConfig('STARTER_FAQ_1_ANSWER')
|
||||
}}
|
||||
className='text-base text-body-color dark:text-dark-6'></p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='mb-12 flex lg:mb-[70px]'>
|
||||
<div className='mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]'>
|
||||
<SVGQuestion />
|
||||
</div>
|
||||
<div className='w-full'>
|
||||
<h3 className='mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl'>
|
||||
{siteConfig('STARTER_FAQ_2_QUESTION')}
|
||||
</h3>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: siteConfig('STARTER_FAQ_2_ANSWER')
|
||||
}}
|
||||
className='text-base text-body-color dark:text-dark-6'></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='w-full px-4 lg:w-1/2'>
|
||||
<div className='mb-12 flex lg:mb-[70px]'>
|
||||
<div className='mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]'>
|
||||
<SVGQuestion />
|
||||
</div>
|
||||
<div className='w-full'>
|
||||
<h3 className='mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl'>
|
||||
{siteConfig('STARTER_FAQ_3_QUESTION')}
|
||||
</h3>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: siteConfig('STARTER_FAQ_3_ANSWER')
|
||||
}}
|
||||
className='text-base text-body-color dark:text-dark-6'></p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='mb-12 flex lg:mb-[70px]'>
|
||||
<div className='mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]'>
|
||||
<SVGQuestion />
|
||||
</div>
|
||||
<div className='w-full'>
|
||||
<h3 className='mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl'>
|
||||
{siteConfig('STARTER_FAQ_4_QUESTION')}
|
||||
</h3>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: siteConfig('STARTER_FAQ_4_ANSWER')
|
||||
}}
|
||||
className='text-base text-body-color dark:text-dark-6'></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="-mx-4 flex flex-wrap">
|
||||
<div className="w-full px-4 lg:w-1/2">
|
||||
<div className="mb-12 flex lg:mb-[70px]">
|
||||
<div
|
||||
className="mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]"
|
||||
>
|
||||
<SVGQuestion/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<h3
|
||||
className="mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl"
|
||||
>
|
||||
{siteConfig('STARTER_FAQ_1_QUESTION', null, CONFIG)}
|
||||
</h3>
|
||||
<p dangerouslySetInnerHTML={
|
||||
{ __html: siteConfig('STARTER_FAQ_1_ANSWER', null, CONFIG) }
|
||||
} className="text-base text-body-color dark:text-dark-6">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mb-12 flex lg:mb-[70px]">
|
||||
<div
|
||||
className="mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]"
|
||||
>
|
||||
<SVGQuestion/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<h3
|
||||
className="mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl"
|
||||
>
|
||||
{siteConfig('STARTER_FAQ_2_QUESTION', null, CONFIG)}
|
||||
</h3>
|
||||
<p dangerouslySetInnerHTML={
|
||||
{ __html: siteConfig('STARTER_FAQ_2_ANSWER', null, CONFIG) }
|
||||
} className="text-base text-body-color dark:text-dark-6">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full px-4 lg:w-1/2">
|
||||
<div className="mb-12 flex lg:mb-[70px]">
|
||||
<div
|
||||
className="mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]"
|
||||
>
|
||||
<SVGQuestion/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<h3
|
||||
className="mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl"
|
||||
>
|
||||
{siteConfig('STARTER_FAQ_3_QUESTION', null, CONFIG)}
|
||||
</h3>
|
||||
<p dangerouslySetInnerHTML={
|
||||
{ __html: siteConfig('STARTER_FAQ_3_ANSWER', null, CONFIG) }
|
||||
} className="text-base text-body-color dark:text-dark-6">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="mb-12 flex lg:mb-[70px]">
|
||||
<div
|
||||
className="mr-4 flex h-[50px] w-full max-w-[50px] items-center justify-center rounded-xl bg-primary text-white sm:mr-6 sm:h-[60px] sm:max-w-[60px]"
|
||||
>
|
||||
<SVGQuestion/>
|
||||
</div>
|
||||
<div className="w-full">
|
||||
<h3
|
||||
className="mb-6 text-xl font-semibold text-dark dark:text-white sm:text-2xl lg:text-xl xl:text-2xl"
|
||||
>
|
||||
{siteConfig('STARTER_FAQ_4_QUESTION', null, CONFIG)}
|
||||
</h3>
|
||||
<p dangerouslySetInnerHTML={
|
||||
{ __html: siteConfig('STARTER_FAQ_4_ANSWER', null, CONFIG) }
|
||||
} className="text-base text-body-color dark:text-dark-6">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* 背景图案 */}
|
||||
<div>
|
||||
<span className='absolute left-4 top-4 -z-[1]'>
|
||||
<SVGCircleBG />
|
||||
</span>
|
||||
<span className='absolute bottom-4 right-4 -z-[1]'>
|
||||
<SVGCircleBG />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 背景图案 */}
|
||||
<div>
|
||||
<span className="absolute left-4 top-4 -z-[1]">
|
||||
<SVGCircleBG/>
|
||||
</span>
|
||||
<span className="absolute bottom-4 right-4 -z-[1]">
|
||||
<SVGCircleBG/>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
{/* <!-- ====== FAQ Section End --> */}
|
||||
</section>
|
||||
{/* <!-- ====== FAQ Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,135 +1,114 @@
|
||||
import CONFIG from '../config'
|
||||
import { siteConfig } from '@/lib/config';
|
||||
import { SVGGifts } from './svg/SVGGifts';
|
||||
import { SVGTemplate } from './svg/SVGTemplate';
|
||||
import { SVGDesign } from './svg/SVGDesign';
|
||||
import { SVGEssential } from './svg/SVGEssential';
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import { SVGDesign } from './svg/SVGDesign'
|
||||
import { SVGEssential } from './svg/SVGEssential'
|
||||
import { SVGGifts } from './svg/SVGGifts'
|
||||
import { SVGTemplate } from './svg/SVGTemplate'
|
||||
/**
|
||||
* 产品特性相关，将显示在首页中
|
||||
* @returns
|
||||
*/
|
||||
export const Features = () => {
|
||||
return <>
|
||||
{/* <!-- ====== Features Section Start --> */}
|
||||
<section className="pb-8 pt-20 dark:bg-dark lg:pb-[70px] lg:pt-[120px]">
|
||||
<div className="container">
|
||||
<div className="-mx-4 flex flex-wrap">
|
||||
<div className="w-full px-4">
|
||||
<div className="mx-auto mb-12 max-w-[485px] text-center lg:mb-[70px]">
|
||||
<span className="mb-2 block text-lg font-semibold text-primary">
|
||||
{siteConfig('STARTER_FEATURE_TITLE', null, CONFIG)}
|
||||
</span>
|
||||
<h2
|
||||
className="mb-3 text-3xl font-bold text-dark dark:text-white sm:text-4xl md:text-[40px] md:leading-[1.2]"
|
||||
>
|
||||
{siteConfig('STARTER_FEATURE_TEXT_1', null, CONFIG)}
|
||||
</h2>
|
||||
<p className="text-base text-body-color dark:text-dark-6">
|
||||
{siteConfig('STARTER_FEATURE_TEXT_2', null, CONFIG)}
|
||||
</p>
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Features Section Start --> */}
|
||||
<section className='pb-8 pt-20 dark:bg-dark lg:pb-[70px] lg:pt-[120px]'>
|
||||
<div className='container'>
|
||||
<div className='-mx-4 flex flex-wrap'>
|
||||
<div className='w-full px-4'>
|
||||
<div className='mx-auto mb-12 max-w-[485px] text-center lg:mb-[70px]'>
|
||||
<span className='mb-2 block text-lg font-semibold text-primary'>
|
||||
{siteConfig('STARTER_FEATURE_TITLE')}
|
||||
</span>
|
||||
<h2 className='mb-3 text-3xl font-bold text-dark dark:text-white sm:text-4xl md:text-[40px] md:leading-[1.2]'>
|
||||
{siteConfig('STARTER_FEATURE_TEXT_1')}
|
||||
</h2>
|
||||
<p className='text-base text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_FEATURE_TEXT_2')}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='-mx-4 flex flex-wrap'>
|
||||
<div className='w-full px-4 md:w-1/2 lg:w-1/4'>
|
||||
<div className='wow fadeInUp group mb-12' data-wow-delay='.1s'>
|
||||
<div className='relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary'>
|
||||
<span className='absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45'></span>
|
||||
<SVGGifts />
|
||||
</div>
|
||||
<h4 className='mb-3 text-xl font-bold text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_FEATURE_1_TITLE_1')}
|
||||
</h4>
|
||||
<p className='mb-8 text-body-color dark:text-dark-6 lg:mb-9'>
|
||||
{siteConfig('STARTER_FEATURE_1_TEXT_1')}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_1_BUTTON_URL')}
|
||||
className='text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary'>
|
||||
{siteConfig('STARTER_FEATURE_1_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-full px-4 md:w-1/2 lg:w-1/4'>
|
||||
<div className='wow fadeInUp group mb-12' data-wow-delay='.15s'>
|
||||
<div className='relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary'>
|
||||
<span className='absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45'></span>
|
||||
<SVGTemplate />
|
||||
</div>
|
||||
<h4 className='mb-3 text-xl font-bold text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_FEATURE_2_TITLE_1')}
|
||||
</h4>
|
||||
<p className='mb-8 text-body-color dark:text-dark-6 lg:mb-9'>
|
||||
{siteConfig('STARTER_FEATURE_2_TEXT_1')}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_2_BUTTON_URL')}
|
||||
className='text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary'>
|
||||
{siteConfig('STARTER_FEATURE_2_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-full px-4 md:w-1/2 lg:w-1/4'>
|
||||
<div className='wow fadeInUp group mb-12' data-wow-delay='.2s'>
|
||||
<div className='relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary'>
|
||||
<span className='absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45'></span>
|
||||
<SVGDesign />
|
||||
</div>
|
||||
<h4 className='mb-3 text-xl font-bold text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_FEATURE_3_TITLE_1')}
|
||||
</h4>
|
||||
<p className='mb-8 text-body-color dark:text-dark-6 lg:mb-9'>
|
||||
{siteConfig('STARTER_FEATURE_3_TEXT_1')}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_3_BUTTON_URL')}
|
||||
className='text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary'>
|
||||
{siteConfig('STARTER_FEATURE_3_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-full px-4 md:w-1/2 lg:w-1/4'>
|
||||
<div className='wow fadeInUp group mb-12' data-wow-delay='.25s'>
|
||||
<div className='relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary'>
|
||||
<span className='absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45'></span>
|
||||
<SVGEssential />
|
||||
</div>
|
||||
<h4 className='mb-3 text-xl font-bold text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_FEATURE_4_TITLE_1')}
|
||||
</h4>
|
||||
<p className='mb-8 text-body-color dark:text-dark-6 lg:mb-9'>
|
||||
{siteConfig('STARTER_FEATURE_4_TEXT_1')}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_4_BUTTON_URL')}
|
||||
className='text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary'>
|
||||
{siteConfig('STARTER_FEATURE_3_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="-mx-4 flex flex-wrap">
|
||||
<div className="w-full px-4 md:w-1/2 lg:w-1/4">
|
||||
<div className="wow fadeInUp group mb-12" data-wow-delay=".1s">
|
||||
<div
|
||||
className="relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary"
|
||||
>
|
||||
<span
|
||||
className="absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45"
|
||||
></span>
|
||||
<SVGGifts/>
|
||||
</div>
|
||||
<h4 className="mb-3 text-xl font-bold text-dark dark:text-white">
|
||||
{siteConfig('STARTER_FEATURE_1_TITLE_1', null, CONFIG)}
|
||||
</h4>
|
||||
<p className="mb-8 text-body-color dark:text-dark-6 lg:mb-9">
|
||||
{siteConfig('STARTER_FEATURE_1_TEXT_1', null, CONFIG)}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_1_BUTTON_URL', null, CONFIG)}
|
||||
className="text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary"
|
||||
>
|
||||
{siteConfig('STARTER_FEATURE_1_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-full px-4 md:w-1/2 lg:w-1/4">
|
||||
<div className="wow fadeInUp group mb-12" data-wow-delay=".15s">
|
||||
<div
|
||||
className="relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary"
|
||||
>
|
||||
<span
|
||||
className="absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45"
|
||||
></span>
|
||||
<SVGTemplate/>
|
||||
</div>
|
||||
<h4 className="mb-3 text-xl font-bold text-dark dark:text-white">
|
||||
{siteConfig('STARTER_FEATURE_2_TITLE_1', null, CONFIG)}
|
||||
</h4>
|
||||
<p className="mb-8 text-body-color dark:text-dark-6 lg:mb-9">
|
||||
{siteConfig('STARTER_FEATURE_2_TEXT_1', null, CONFIG)}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_2_BUTTON_URL', null, CONFIG)}
|
||||
className="text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary"
|
||||
>
|
||||
{siteConfig('STARTER_FEATURE_2_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-full px-4 md:w-1/2 lg:w-1/4">
|
||||
<div className="wow fadeInUp group mb-12" data-wow-delay=".2s">
|
||||
<div
|
||||
className="relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary"
|
||||
>
|
||||
<span
|
||||
className="absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45"
|
||||
></span>
|
||||
<SVGDesign/>
|
||||
</div>
|
||||
<h4 className="mb-3 text-xl font-bold text-dark dark:text-white">
|
||||
{siteConfig('STARTER_FEATURE_3_TITLE_1', null, CONFIG)}
|
||||
</h4>
|
||||
<p className="mb-8 text-body-color dark:text-dark-6 lg:mb-9">
|
||||
{siteConfig('STARTER_FEATURE_3_TEXT_1', null, CONFIG)}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_3_BUTTON_URL', null, CONFIG)}
|
||||
className="text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary"
|
||||
>
|
||||
{siteConfig('STARTER_FEATURE_3_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-full px-4 md:w-1/2 lg:w-1/4">
|
||||
<div className="wow fadeInUp group mb-12" data-wow-delay=".25s">
|
||||
<div
|
||||
className="relative z-10 mb-10 flex h-[70px] w-[70px] items-center justify-center rounded-[14px] bg-primary"
|
||||
>
|
||||
<span
|
||||
className="absolute left-0 top-0 -z-[1] mb-8 flex h-[70px] w-[70px] rotate-[25deg] items-center justify-center rounded-[14px] bg-primary bg-opacity-20 duration-300 group-hover:rotate-45"
|
||||
></span>
|
||||
<SVGEssential/>
|
||||
</div>
|
||||
<h4 className="mb-3 text-xl font-bold text-dark dark:text-white">
|
||||
{siteConfig('STARTER_FEATURE_4_TITLE_1', null, CONFIG)}
|
||||
</h4>
|
||||
<p className="mb-8 text-body-color dark:text-dark-6 lg:mb-9">
|
||||
{siteConfig('STARTER_FEATURE_4_TEXT_1', null, CONFIG)}
|
||||
</p>
|
||||
<a
|
||||
href={siteConfig('STARTER_FEATURE_4_BUTTON_URL', null, CONFIG)}
|
||||
className="text-base font-medium text-dark hover:text-primary dark:text-white dark:hover:text-primary"
|
||||
>
|
||||
{siteConfig('STARTER_FEATURE_3_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* <!-- ====== Features Section End --> */}
|
||||
</section>
|
||||
{/* <!-- ====== Features Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,17 +1,12 @@
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import SocialButton from '@/themes/fukasawa/components/SocialButton'
|
||||
import CONFIG from '../config'
|
||||
import { Logo } from './Logo'
|
||||
import { SVGFooterCircleBG } from './svg/SVGFooterCircleBG'
|
||||
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
export const Footer = props => {
|
||||
const latestPosts = props?.latestPosts ? props?.latestPosts.slice(0, 2) : []
|
||||
const STARTER_FOOTER_LINK_GROUP = siteConfig(
|
||||
'STARTER_FOOTER_LINK_GROUP',
|
||||
[],
|
||||
CONFIG
|
||||
)
|
||||
const STARTER_FOOTER_LINK_GROUP = siteConfig('STARTER_FOOTER_LINK_GROUP')
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Footer Section Start --> */}
|
||||
@@ -26,7 +21,7 @@ export const Footer = props => {
|
||||
<Logo white={true} />
|
||||
</a>
|
||||
<p className='mb-8 max-w-[270px] text-base text-gray-7'>
|
||||
{siteConfig('STARTER_FOOTER_SLOGAN', null, CONFIG)}
|
||||
{siteConfig('STARTER_FOOTER_SLOGAN')}
|
||||
</p>
|
||||
<div className='-mx-3 flex items-center'>
|
||||
<div className='mx-3'>
|
||||
@@ -68,7 +63,7 @@ export const Footer = props => {
|
||||
<div className='w-full px-4 md:w-2/3 lg:w-6/12 xl:w-3/12'>
|
||||
<div className='mb-10 w-full'>
|
||||
<h4 className='mb-9 text-lg font-semibold text-white'>
|
||||
{siteConfig('STARTER_FOOTER_BLOG_LATEST_TITLE', null, CONFIG)}
|
||||
{siteConfig('STARTER_FOOTER_BLOG_LATEST_TITLE')}
|
||||
</h4>
|
||||
{/* 展示两条最新博客文章 */}
|
||||
<div className='flex flex-col gap-8'>
|
||||
@@ -102,42 +97,24 @@ export const Footer = props => {
|
||||
<div className='my-1'>
|
||||
<div className='-mx-3 flex items-center justify-center md:justify-start'>
|
||||
<a
|
||||
href={siteConfig(
|
||||
'STARTER_FOOTER_PRIVACY_POLICY_URL',
|
||||
null,
|
||||
CONFIG
|
||||
)}
|
||||
href={siteConfig('STARTER_FOOTER_PRIVACY_POLICY_URL')}
|
||||
className='px-3 text-base text-gray-7 hover:text-white hover:underline'>
|
||||
{siteConfig(
|
||||
'STARTER_FOOTER_PRIVACY_POLICY_TEXT',
|
||||
null,
|
||||
CONFIG
|
||||
)}
|
||||
{siteConfig('STARTER_FOOTER_PRIVACY_POLICY_TEXT')}
|
||||
</a>
|
||||
<a
|
||||
href={siteConfig(
|
||||
'STARTER_FOOTER_PRIVACY_LEGAL_NOTICE_URL',
|
||||
null,
|
||||
CONFIG
|
||||
'STARTER_FOOTER_PRIVACY_LEGAL_NOTICE_URL'
|
||||
)}
|
||||
className='px-3 text-base text-gray-7 hover:text-white hover:underline'>
|
||||
{siteConfig(
|
||||
'STARTER_FOOTER_PRIVACY_LEGAL_NOTICE_TEXT',
|
||||
null,
|
||||
CONFIG
|
||||
)}
|
||||
{siteConfig('STARTER_FOOTER_PRIVACY_LEGAL_NOTICE_TEXT')}
|
||||
</a>
|
||||
<a
|
||||
href={siteConfig(
|
||||
'STARTER_FOOTER_PRIVACY_TERMS_OF_SERVICE_URL',
|
||||
null,
|
||||
CONFIG
|
||||
'STARTER_FOOTER_PRIVACY_TERMS_OF_SERVICE_URL'
|
||||
)}
|
||||
className='px-3 text-base text-gray-7 hover:text-white hover:underline'>
|
||||
{siteConfig(
|
||||
'STARTER_FOOTER_PRIVACY_TERMS_OF_SERVICE_TEXT',
|
||||
null,
|
||||
CONFIG
|
||||
'STARTER_FOOTER_PRIVACY_TERMS_OF_SERVICE_TEXT'
|
||||
)}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@@ -1,96 +1,90 @@
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import CONFIG from '../config'
|
||||
/**
|
||||
* 英雄大图区块
|
||||
*/
|
||||
export const Hero = () => {
|
||||
return <>
|
||||
{/* <!-- ====== Hero Section Start --> */}
|
||||
<div
|
||||
id="home"
|
||||
className="relative overflow-hidden bg-primary pt-[120px] md:pt-[130px] lg:pt-[160px]"
|
||||
>
|
||||
<div className="container">
|
||||
<div className="-mx-4 flex flex-wrap items-center">
|
||||
<div className="w-full px-4">
|
||||
<div
|
||||
className="hero-content wow fadeInUp mx-auto max-w-[780px] text-center"
|
||||
data-wow-delay=".2s"
|
||||
>
|
||||
{/* 主标题 */}
|
||||
<h1
|
||||
className="mb-6 text-3xl font-bold leading-snug text-white sm:text-4xl sm:leading-snug lg:text-5xl lg:leading-[1.2]"
|
||||
>
|
||||
{siteConfig('STARTER_HERO_TITLE_1', null, CONFIG)}
|
||||
</h1>
|
||||
{/* 次标题 */}
|
||||
<p
|
||||
className="mx-auto mb-9 max-w-[600px] text-base font-medium text-white sm:text-lg sm:leading-[1.44]"
|
||||
>
|
||||
{siteConfig('STARTER_HERO_TITLE_2', null, CONFIG)}
|
||||
</p>
|
||||
{/* 按钮组 */}
|
||||
<ul
|
||||
className="mb-10 flex flex-wrap items-center justify-center gap-5"
|
||||
>
|
||||
{siteConfig('STARTER_HERO_BUTTON_1_TEXT', null, CONFIG) &&
|
||||
<li>
|
||||
<a
|
||||
href={siteConfig('STARTER_HERO_BUTTON_1_URL', null, CONFIG)}
|
||||
className="inline-flex items-center justify-center rounded-md bg-white px-7 py-[14px] text-center text-base font-medium text-dark shadow-1 transition duration-300 ease-in-out hover:bg-gray-2 hover:text-body-color"
|
||||
>
|
||||
{siteConfig('STARTER_HERO_BUTTON_1_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</li>
|
||||
}
|
||||
{siteConfig('STARTER_HERO_BUTTON_2_TEXT', null, CONFIG) &&
|
||||
<li>
|
||||
<a
|
||||
href={siteConfig('STARTER_HERO_BUTTON_2_URL', null, CONFIG)}
|
||||
target="_blank"
|
||||
className="flex items-center rounded-md bg-white/[0.12] px-6 py-[14px] text-base font-medium text-white transition duration-300 ease-in-out hover:bg-white hover:text-dark" rel="noreferrer"
|
||||
>
|
||||
{siteConfig('STARTER_HERO_BUTTON_2_ICON', null, CONFIG) && <img className='mr-4' src={siteConfig('STARTER_HERO_BUTTON_2_ICON', null, CONFIG)}/>}
|
||||
{siteConfig('STARTER_HERO_BUTTON_2_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 产品预览图片 */}
|
||||
{ siteConfig('STARTER_HERO_PREVIEW_IMAGE', null, CONFIG) && <div className="w-full px-4">
|
||||
<div
|
||||
className="wow fadeInUp relative z-10 mx-auto max-w-[845px]"
|
||||
data-wow-delay=".25s"
|
||||
>
|
||||
|
||||
<div className="mt-16">
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img
|
||||
src={siteConfig('STARTER_HERO_PREVIEW_IMAGE', null, CONFIG)}
|
||||
alt="hero"
|
||||
className="mx-auto max-w-full rounded-t-xl rounded-tr-xl"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 背景图 */}
|
||||
<div className="absolute -left-9 bottom-0 z-[-1]">
|
||||
<img src='/images/starter/bg-hero-circle.svg'/>
|
||||
</div>
|
||||
<div className="absolute -right-6 -top-6 z-[-1]">
|
||||
<img src='/images/starter/bg-hero-circle.svg'/>
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Hero Section Start --> */}
|
||||
<div
|
||||
id='home'
|
||||
className='relative overflow-hidden bg-primary pt-[120px] md:pt-[130px] lg:pt-[160px]'>
|
||||
<div className='container'>
|
||||
<div className='-mx-4 flex flex-wrap items-center'>
|
||||
<div className='w-full px-4'>
|
||||
<div
|
||||
className='hero-content wow fadeInUp mx-auto max-w-[780px] text-center'
|
||||
data-wow-delay='.2s'>
|
||||
{/* 主标题 */}
|
||||
<h1 className='mb-6 text-3xl font-bold leading-snug text-white sm:text-4xl sm:leading-snug lg:text-5xl lg:leading-[1.2]'>
|
||||
{siteConfig('STARTER_HERO_TITLE_1')}
|
||||
</h1>
|
||||
{/* 次标题 */}
|
||||
<p className='mx-auto mb-9 max-w-[600px] text-base font-medium text-white sm:text-lg sm:leading-[1.44]'>
|
||||
{siteConfig('STARTER_HERO_TITLE_2')}
|
||||
</p>
|
||||
{/* 按钮组 */}
|
||||
<ul className='mb-10 flex flex-wrap items-center justify-center gap-5'>
|
||||
{siteConfig('STARTER_HERO_BUTTON_1_TEXT') && (
|
||||
<li>
|
||||
<a
|
||||
href={siteConfig('STARTER_HERO_BUTTON_1_URL')}
|
||||
className='inline-flex items-center justify-center rounded-md bg-white px-7 py-[14px] text-center text-base font-medium text-dark shadow-1 transition duration-300 ease-in-out hover:bg-gray-2 hover:text-body-color'>
|
||||
{siteConfig('STARTER_HERO_BUTTON_1_TEXT')}
|
||||
</a>
|
||||
</li>
|
||||
)}
|
||||
{siteConfig('STARTER_HERO_BUTTON_2_TEXT') && (
|
||||
<li>
|
||||
<a
|
||||
href={siteConfig('STARTER_HERO_BUTTON_2_URL')}
|
||||
target='_blank'
|
||||
className='flex items-center rounded-md bg-white/[0.12] px-6 py-[14px] text-base font-medium text-white transition duration-300 ease-in-out hover:bg-white hover:text-dark'
|
||||
rel='noreferrer'>
|
||||
{siteConfig('STARTER_HERO_BUTTON_2_ICON') && (
|
||||
<img
|
||||
className='mr-4'
|
||||
src={siteConfig('STARTER_HERO_BUTTON_2_ICON')}
|
||||
/>
|
||||
)}
|
||||
{siteConfig('STARTER_HERO_BUTTON_2_TEXT')}
|
||||
</a>
|
||||
</li>
|
||||
)}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
{/* 产品预览图片 */}
|
||||
{siteConfig('STARTER_HERO_PREVIEW_IMAGE') && (
|
||||
<div className='w-full px-4'>
|
||||
<div
|
||||
className='wow fadeInUp relative z-10 mx-auto max-w-[845px]'
|
||||
data-wow-delay='.25s'>
|
||||
<div className='mt-16'>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img
|
||||
src={siteConfig('STARTER_HERO_PREVIEW_IMAGE')}
|
||||
alt='hero'
|
||||
className='mx-auto max-w-full rounded-t-xl rounded-tr-xl'
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* 背景图 */}
|
||||
<div className='absolute -left-9 bottom-0 z-[-1]'>
|
||||
<img src='/images/starter/bg-hero-circle.svg' />
|
||||
</div>
|
||||
<div className='absolute -right-6 -top-6 z-[-1]'>
|
||||
<img src='/images/starter/bg-hero-circle.svg' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <!-- ====== Hero Section End --> */}
|
||||
{/* <!-- ====== Hero Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -5,7 +5,6 @@ import { useGlobal } from '@/lib/global'
|
||||
import throttle from 'lodash.throttle'
|
||||
import { useRouter } from 'next/router'
|
||||
import { useEffect, useState } from 'react'
|
||||
import CONFIG from '../config'
|
||||
|
||||
/**
|
||||
* 站点图标
|
||||
@@ -14,7 +13,7 @@ import CONFIG from '../config'
|
||||
export const Logo = ({ white }) => {
|
||||
const router = useRouter()
|
||||
const { isDarkMode } = useGlobal()
|
||||
const logoWhite = siteConfig('STARTER_LOGO_WHITE', null, CONFIG)
|
||||
const logoWhite = siteConfig('STARTER_LOGO_WHITE')
|
||||
const [logo, setLogo] = useState(logoWhite)
|
||||
const [logoTextColor, setLogoTextColor] = useState('text-white')
|
||||
|
||||
@@ -26,10 +25,10 @@ export const Logo = ({ white }) => {
|
||||
// 何时显示浅色或白底的logo
|
||||
const homePageNavBar = router.route === '/' && scrollY < 10 // 在首页并且视窗在页面顶部
|
||||
if (white || isDarkMode || homePageNavBar) {
|
||||
setLogo(siteConfig('STARTER_LOGO_WHITE', null, CONFIG))
|
||||
setLogo(siteConfig('STARTER_LOGO_WHITE'))
|
||||
setLogoTextColor('text-white')
|
||||
} else {
|
||||
setLogo(siteConfig('STARTER_LOGO', null, CONFIG))
|
||||
setLogo(siteConfig('STARTER_LOGO'))
|
||||
setLogoTextColor('text-black')
|
||||
}
|
||||
}, throttleMs)
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
import Link from 'next/link'
|
||||
import { useRouter } from 'next/router'
|
||||
|
||||
/**
|
||||
* 菜单链接
|
||||
* @param {*} param0
|
||||
* @returns
|
||||
*/
|
||||
export const MenuItem = ({ link }) => {
|
||||
const hasSubMenu = link?.subMenus?.length > 0
|
||||
const router = useRouter()
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import { useGlobal } from '@/lib/global'
|
||||
import { useEffect } from 'react'
|
||||
import CONFIG from '../config'
|
||||
import { MenuItem } from './MenuItem'
|
||||
/**
|
||||
* 响应式 折叠菜单
|
||||
@@ -15,25 +14,25 @@ export const MenuList = props => {
|
||||
icon: 'fas fa-archive',
|
||||
name: locale.NAV.ARCHIVE,
|
||||
href: '/archive',
|
||||
show: siteConfig('HEO_MENU_ARCHIVE', null, CONFIG)
|
||||
show: siteConfig('HEO_MENU_ARCHIVE')
|
||||
},
|
||||
{
|
||||
icon: 'fas fa-search',
|
||||
name: locale.NAV.SEARCH,
|
||||
href: '/search',
|
||||
show: siteConfig('HEO_MENU_SEARCH', null, CONFIG)
|
||||
show: siteConfig('HEO_MENU_SEARCH')
|
||||
},
|
||||
{
|
||||
icon: 'fas fa-folder',
|
||||
name: locale.COMMON.CATEGORY,
|
||||
href: '/category',
|
||||
show: siteConfig('HEO_MENU_CATEGORY', null, CONFIG)
|
||||
show: siteConfig('HEO_MENU_CATEGORY')
|
||||
},
|
||||
{
|
||||
icon: 'fas fa-tag',
|
||||
name: locale.COMMON.TAGS,
|
||||
href: '/tag',
|
||||
show: siteConfig('HEO_MENU_TAG', null, CONFIG)
|
||||
show: siteConfig('HEO_MENU_TAG')
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import CONFIG from '../config'
|
||||
import { useRef, useState } from 'react'
|
||||
|
||||
/**
|
||||
@@ -16,7 +15,7 @@ export const MessageForm = () => {
|
||||
message: ''
|
||||
})
|
||||
|
||||
const handleChange = (e) => {
|
||||
const handleChange = e => {
|
||||
const { name, value } = e.target
|
||||
setFormData(prevState => ({
|
||||
...prevState,
|
||||
@@ -44,89 +43,90 @@ export const MessageForm = () => {
|
||||
// }
|
||||
// }, [submitComments])
|
||||
|
||||
return <>
|
||||
<h3
|
||||
className="mb-8 text-2xl font-semibold text-dark dark:text-white md:text-[28px] md:leading-[1.42]"
|
||||
>
|
||||
{siteConfig('STARTER_CONTACT_MSG_TITLE', null, CONFIG)}
|
||||
</h3>
|
||||
<form ref={formRef}>
|
||||
<div className="mb-[22px]">
|
||||
<label
|
||||
// for="fullName"
|
||||
className="mb-4 block text-sm text-body-color dark:text-dark-6">
|
||||
{siteConfig('STARTER_CONTACT_MSG_NAME', null, CONFIG)}*
|
||||
</label>
|
||||
<input
|
||||
disabled={success}
|
||||
type="text"
|
||||
name="fullName"
|
||||
value={formData.fullName}
|
||||
onChange={handleChange}
|
||||
placeholder="Adam Gelius"
|
||||
className="w-full border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6"
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-[22px]">
|
||||
<label
|
||||
// for="email"
|
||||
className="mb-4 block text-sm text-body-color dark:text-dark-6">
|
||||
{siteConfig('STARTER_CONTACT_MSG_EMAIL', null, CONFIG)}*
|
||||
</label >
|
||||
<input
|
||||
disabled={success}
|
||||
type="email"
|
||||
name="email"
|
||||
value={formData.email}
|
||||
onChange={handleChange}
|
||||
placeholder="example@yourmail.com"
|
||||
className="w-full border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6"
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-[22px]">
|
||||
<label
|
||||
// for="phone"
|
||||
className="mb-4 block text-sm text-body-color dark:text-dark-6">
|
||||
{siteConfig('STARTER_CONTACT_MSG_PHONE', null, CONFIG)}*
|
||||
</label >
|
||||
<input
|
||||
disabled={success}
|
||||
type="text"
|
||||
name="phone"
|
||||
value={formData.phone}
|
||||
onChange={handleChange}
|
||||
placeholder="+885 1254 5211 552"
|
||||
className="w-full border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6"
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-[30px]">
|
||||
<label
|
||||
// for="message"
|
||||
className="mb-4 block text-sm text-body-color dark:text-dark-6">
|
||||
{siteConfig('STARTER_CONTACT_MSG_TEXT', null, CONFIG)}*
|
||||
</label >
|
||||
<textarea
|
||||
disabled={success}
|
||||
name="message"
|
||||
value={formData.message}
|
||||
onChange={handleChange}
|
||||
rows="1"
|
||||
placeholder="type your message here"
|
||||
className="w-full resize-none border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6"
|
||||
></textarea>
|
||||
</div>
|
||||
<div className="mb-0">
|
||||
<button
|
||||
disabled={success}
|
||||
type="submit"
|
||||
className="inline-flex items-center justify-center rounded-md bg-primary px-10 py-3 text-base font-medium text-white transition duration-300 ease-in-out hover:bg-blue-dark"
|
||||
>
|
||||
{siteConfig('STARTER_CONTACT_MSG_SEND', null, CONFIG)}
|
||||
</button>
|
||||
{/* Success message */}
|
||||
{success && <p className="mt-2 text-green-600 text-sm">{siteConfig('STARTER_CONTACT_MSG_THANKS', null, CONFIG)}</p>}
|
||||
|
||||
</div>
|
||||
</form>
|
||||
</>
|
||||
return (
|
||||
<>
|
||||
<h3 className='mb-8 text-2xl font-semibold text-dark dark:text-white md:text-[28px] md:leading-[1.42]'>
|
||||
{siteConfig('STARTER_CONTACT_MSG_TITLE')}
|
||||
</h3>
|
||||
<form ref={formRef}>
|
||||
<div className='mb-[22px]'>
|
||||
<label
|
||||
// for="fullName"
|
||||
className='mb-4 block text-sm text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_CONTACT_MSG_NAME')}*
|
||||
</label>
|
||||
<input
|
||||
disabled={success}
|
||||
type='text'
|
||||
name='fullName'
|
||||
value={formData.fullName}
|
||||
onChange={handleChange}
|
||||
placeholder='Adam Gelius'
|
||||
className='w-full border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6'
|
||||
/>
|
||||
</div>
|
||||
<div className='mb-[22px]'>
|
||||
<label
|
||||
// for="email"
|
||||
className='mb-4 block text-sm text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_CONTACT_MSG_EMAIL')}*
|
||||
</label>
|
||||
<input
|
||||
disabled={success}
|
||||
type='email'
|
||||
name='email'
|
||||
value={formData.email}
|
||||
onChange={handleChange}
|
||||
placeholder='example@yourmail.com'
|
||||
className='w-full border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6'
|
||||
/>
|
||||
</div>
|
||||
<div className='mb-[22px]'>
|
||||
<label
|
||||
// for="phone"
|
||||
className='mb-4 block text-sm text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_CONTACT_MSG_PHONE')}*
|
||||
</label>
|
||||
<input
|
||||
disabled={success}
|
||||
type='text'
|
||||
name='phone'
|
||||
value={formData.phone}
|
||||
onChange={handleChange}
|
||||
placeholder='+885 1254 5211 552'
|
||||
className='w-full border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6'
|
||||
/>
|
||||
</div>
|
||||
<div className='mb-[30px]'>
|
||||
<label
|
||||
// for="message"
|
||||
className='mb-4 block text-sm text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_CONTACT_MSG_TEXT')}*
|
||||
</label>
|
||||
<textarea
|
||||
disabled={success}
|
||||
name='message'
|
||||
value={formData.message}
|
||||
onChange={handleChange}
|
||||
rows='1'
|
||||
placeholder='type your message here'
|
||||
className='w-full resize-none border-0 border-b border-[#f1f1f1] bg-transparent pb-3 text-body-color placeholder:text-body-color/60 focus:border-primary focus:outline-none dark:border-dark-3 dark:text-dark-6'></textarea>
|
||||
</div>
|
||||
<div className='mb-0'>
|
||||
<button
|
||||
disabled={success}
|
||||
type='submit'
|
||||
className='inline-flex items-center justify-center rounded-md bg-primary px-10 py-3 text-base font-medium text-white transition duration-300 ease-in-out hover:bg-blue-dark'>
|
||||
{siteConfig('STARTER_CONTACT_MSG_SEND')}
|
||||
</button>
|
||||
{/* Success message */}
|
||||
{success && (
|
||||
<p className='mt-2 text-green-600 text-sm'>
|
||||
{siteConfig('STARTER_CONTACT_MSG_THANKS')}
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
</form>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,21 +1,22 @@
|
||||
/* eslint-disable no-unreachable */
|
||||
import throttle from 'lodash.throttle';
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import { useGlobal } from '@/lib/global'
|
||||
import throttle from 'lodash.throttle'
|
||||
import { useRouter } from 'next/router'
|
||||
import { useCallback, useEffect, useState } from 'react'
|
||||
import { MenuList } from './MenuList';
|
||||
import { DarkModeButton } from './DarkModeButton';
|
||||
import { Logo } from './Logo';
|
||||
import { useRouter } from 'next/router';
|
||||
import { siteConfig } from '@/lib/config';
|
||||
import CONFIG from '../config';
|
||||
import { useGlobal } from '@/lib/global';
|
||||
import { DarkModeButton } from './DarkModeButton'
|
||||
import { Logo } from './Logo'
|
||||
import { MenuList } from './MenuList'
|
||||
|
||||
/**
|
||||
* 顶部导航栏
|
||||
*/
|
||||
export const NavBar = (props) => {
|
||||
export const NavBar = props => {
|
||||
const router = useRouter()
|
||||
const { isDarkMode } = useGlobal()
|
||||
const [buttonTextColor, setColor] = useState(router.route === '/' ? 'text-white' : '')
|
||||
const [buttonTextColor, setColor] = useState(
|
||||
router.route === '/' ? 'text-white' : ''
|
||||
)
|
||||
useEffect(() => {
|
||||
if (isDarkMode || router.route === '/') {
|
||||
setColor('text-white')
|
||||
@@ -33,59 +34,54 @@ export const NavBar = (props) => {
|
||||
const throttleMs = 200
|
||||
const navBarScollListener = useCallback(
|
||||
throttle(() => {
|
||||
// eslint-disable-next-line camelcase
|
||||
const ud_header = document.querySelector('.ud-header');
|
||||
const scrollY = window.scrollY;
|
||||
// eslint-disable-next-line camelcase
|
||||
const ud_header = document.querySelector('.ud-header')
|
||||
const scrollY = window.scrollY
|
||||
// 控制台输出当前滚动位置和 sticky 值
|
||||
if (scrollY > 0) {
|
||||
ud_header?.classList?.add('sticky');
|
||||
ud_header?.classList?.add('sticky')
|
||||
} else {
|
||||
ud_header?.classList?.remove('sticky');
|
||||
ud_header?.classList?.remove('sticky')
|
||||
}
|
||||
}, throttleMs)
|
||||
)
|
||||
|
||||
return <>
|
||||
{/* <!-- ====== Navbar Section Start --> */}
|
||||
<div className="ud-header absolute left-0 top-0 z-40 flex w-full items-center bg-transparent" >
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Navbar Section Start --> */}
|
||||
<div className='ud-header absolute left-0 top-0 z-40 flex w-full items-center bg-transparent'>
|
||||
<div className='container'>
|
||||
<div className='relative -mx-4 flex items-center justify-between'>
|
||||
{/* Logo */}
|
||||
<Logo />
|
||||
|
||||
<div className="container">
|
||||
|
||||
<div className="relative -mx-4 flex items-center justify-between">
|
||||
|
||||
{/* Logo */}
|
||||
<Logo/>
|
||||
|
||||
<div className="flex w-full items-center justify-between px-4">
|
||||
|
||||
{/* 中间菜单 */}
|
||||
<MenuList {...props}/>
|
||||
|
||||
{/* 右侧功能 */}
|
||||
<div className="flex items-center justify-end pr-16 lg:pr-0">
|
||||
{/* 深色模式切换 */}
|
||||
<DarkModeButton/>
|
||||
{/* 注册登录功能 */}
|
||||
<div className="hidden sm:flex">
|
||||
<a
|
||||
href={siteConfig('STARTER_NAV_BUTTON_1_URL', null, CONFIG)}
|
||||
className={`loginBtn ${buttonTextColor} px-[22px] py-2 text-base font-medium hover:opacity-70`}
|
||||
>
|
||||
{siteConfig('STARTER_NAV_BUTTON_1_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
<a
|
||||
href={siteConfig('STARTER_NAV_BUTTON_2_URL', null, CONFIG)}
|
||||
className={`signUpBtn ${buttonTextColor} rounded-md bg-white bg-opacity-20 px-6 py-2 text-base font-medium duration-300 ease-in-out hover:bg-opacity-100 hover:text-dark`}
|
||||
>
|
||||
{siteConfig('STARTER_NAV_BUTTON_2_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex w-full items-center justify-between px-4'>
|
||||
{/* 中间菜单 */}
|
||||
<MenuList {...props} />
|
||||
|
||||
{/* 右侧功能 */}
|
||||
<div className='flex items-center justify-end pr-16 lg:pr-0'>
|
||||
{/* 深色模式切换 */}
|
||||
<DarkModeButton />
|
||||
{/* 注册登录功能 */}
|
||||
<div className='hidden sm:flex'>
|
||||
<a
|
||||
href={siteConfig('STARTER_NAV_BUTTON_1_URL')}
|
||||
className={`loginBtn ${buttonTextColor} px-[22px] py-2 text-base font-medium hover:opacity-70`}>
|
||||
{siteConfig('STARTER_NAV_BUTTON_1_TEXT')}
|
||||
</a>
|
||||
<a
|
||||
href={siteConfig('STARTER_NAV_BUTTON_2_URL')}
|
||||
className={`signUpBtn ${buttonTextColor} rounded-md bg-white bg-opacity-20 px-6 py-2 text-base font-medium duration-300 ease-in-out hover:bg-opacity-100 hover:text-dark`}>
|
||||
{siteConfig('STARTER_NAV_BUTTON_2_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <!-- ====== Navbar Section End --> */}
|
||||
</div>
|
||||
{/* <!-- ====== Navbar Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,178 +1,177 @@
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import CONFIG from '../config'
|
||||
|
||||
/**
|
||||
* 价格板块
|
||||
* @returns
|
||||
*/
|
||||
export const Pricing = () => {
|
||||
return <>
|
||||
{/* <!-- ====== Pricing Section Start --> */}
|
||||
<section
|
||||
id="pricing"
|
||||
className="relative z-20 overflow-hidden bg-white pb-12 pt-20 dark:bg-dark lg:pb-[90px] lg:pt-[120px]"
|
||||
>
|
||||
<div className="container mx-auto">
|
||||
<div className="-mx-4 flex flex-wrap">
|
||||
<div className="w-full px-4">
|
||||
<div className="mx-auto mb-[60px] max-w-[510px] text-center">
|
||||
<span className="mb-2 block text-lg font-semibold text-primary">
|
||||
{siteConfig('STARTER_PRICING_TITLE', null, CONFIG)}
|
||||
</span>
|
||||
<h2
|
||||
className="mb-3 text-3xl font-bold text-dark dark:text-white sm:text-4xl md:text-[40px] md:leading-[1.2]"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_TEXT_1', null, CONFIG)}
|
||||
</h2>
|
||||
<p className="text-base text-body-color dark:text-dark-6">
|
||||
{siteConfig('STARTER_PRICING_TEXT_2', null, CONFIG)}
|
||||
</p>
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Pricing Section Start --> */}
|
||||
<section
|
||||
id='pricing'
|
||||
className='relative z-20 overflow-hidden bg-white pb-12 pt-20 dark:bg-dark lg:pb-[90px] lg:pt-[120px]'>
|
||||
<div className='container mx-auto'>
|
||||
<div className='-mx-4 flex flex-wrap'>
|
||||
<div className='w-full px-4'>
|
||||
<div className='mx-auto mb-[60px] max-w-[510px] text-center'>
|
||||
<span className='mb-2 block text-lg font-semibold text-primary'>
|
||||
{siteConfig('STARTER_PRICING_TITLE')}
|
||||
</span>
|
||||
<h2 className='mb-3 text-3xl font-bold text-dark dark:text-white sm:text-4xl md:text-[40px] md:leading-[1.2]'>
|
||||
{siteConfig('STARTER_PRICING_TEXT_1')}
|
||||
</h2>
|
||||
<p className='text-base text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_PRICING_TEXT_2')}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='-mx-4 flex flex-wrap justify-center'>
|
||||
{/* 第一个付费计划 */}
|
||||
<div className='w-full px-4 md:w-1/2 lg:w-1/3'>
|
||||
<div className='relative z-10 mb-10 overflow-hidden rounded-xl bg-white px-8 py-10 shadow-pricing dark:bg-dark-2 sm:p-12 lg:px-6 lg:py-10 xl:p-14'>
|
||||
<span className='mb-5 block text-xl font-medium text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_PRICING_1_TITLE')}
|
||||
</span>
|
||||
<h2 className='space-x-1 mb-11 text-4xl font-semibold text-dark dark:text-white xl:text-[42px] xl:leading-[1.21]'>
|
||||
<span className='text-xl font-medium'>
|
||||
{siteConfig('STARTER_PRICING_1_PRICE_CURRENCY')}
|
||||
</span>
|
||||
<span className='-ml-1 -tracking-[2px]'>
|
||||
{siteConfig('STARTER_PRICING_1_PRICE')}
|
||||
</span>
|
||||
<span className='text-base font-normal text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_PRICING_1_PRICE_PERIOD')}
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<div className='mb-[50px]'>
|
||||
<h5 className='mb-5 text-lg font-medium text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_PRICING_1_HEADER')}
|
||||
</h5>
|
||||
<div className='flex flex-col gap-[14px]'>
|
||||
{siteConfig('STARTER_PRICING_1_FEATURES')
|
||||
?.split(',')
|
||||
.map((feature, index) => {
|
||||
return (
|
||||
<p
|
||||
key={index}
|
||||
className='text-base text-body-color dark:text-dark-6'>
|
||||
{feature}
|
||||
</p>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
href={siteConfig('STARTER_PRICING_1_BUTTON_URL')}
|
||||
className='inline-block rounded-md bg-primary px-7 py-3 text-center text-base font-medium text-white transition hover:bg-blue-dark'>
|
||||
{siteConfig('STARTER_PRICING_1_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 第二个付费计划 */}
|
||||
<div className='w-full px-4 md:w-1/2 lg:w-1/3'>
|
||||
<div className='relative z-10 mb-10 overflow-hidden rounded-xl bg-white px-8 py-10 shadow-pricing dark:bg-dark-2 sm:p-12 lg:px-6 lg:py-10 xl:p-14'>
|
||||
<p
|
||||
style={{
|
||||
writingMode: 'vertical-rl',
|
||||
textOrientation: 'mixed'
|
||||
}}
|
||||
className='absolute p-1 right-0 top-0 inline-block rounded-bl-md rounded-tl-md bg-primary text-base font-medium text-white tracking-wider'>
|
||||
{siteConfig('STARTER_PRICING_2_TAG')}
|
||||
</p>
|
||||
<span className='mb-5 block text-xl font-medium text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_PRICING_2_TITLE')}
|
||||
</span>
|
||||
<h2 className='space-x-1 mb-11 text-4xl font-semibold text-dark dark:text-white xl:text-[42px] xl:leading-[1.21]'>
|
||||
<span className='text-xl font-medium'>
|
||||
{siteConfig('STARTER_PRICING_2_PRICE_CURRENCY')}
|
||||
</span>
|
||||
<span className='-ml-1 -tracking-[2px]'>
|
||||
{siteConfig('STARTER_PRICING_2_PRICE')}
|
||||
</span>
|
||||
<span className='text-base font-normal text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_PRICING_2_PRICE_PERIOD')}
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<div className='mb-[50px]'>
|
||||
<h5 className='mb-5 text-lg font-medium text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_PRICING_2_HEADER')}
|
||||
</h5>
|
||||
<div className='flex flex-col gap-[14px]'>
|
||||
{siteConfig('STARTER_PRICING_2_FEATURES')
|
||||
?.split(',')
|
||||
.map((feature, index) => {
|
||||
return (
|
||||
<p
|
||||
key={index}
|
||||
className='text-base text-body-color dark:text-dark-6'>
|
||||
{feature}
|
||||
</p>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
href={siteConfig('STARTER_PRICING_2_BUTTON_URL')}
|
||||
className='inline-block rounded-md bg-primary px-7 py-3 text-center text-base font-medium text-white transition hover:bg-blue-dark'>
|
||||
{siteConfig('STARTER_PRICING_2_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 第三个付费计划 */}
|
||||
<div className='w-full px-4 md:w-1/2 lg:w-1/3'>
|
||||
<div className='relative z-10 mb-10 overflow-hidden rounded-xl bg-white px-8 py-10 shadow-pricing dark:bg-dark-2 sm:p-12 lg:px-6 lg:py-10 xl:p-14'>
|
||||
<span className='mb-5 block text-xl font-medium text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_PRICING_3_TITLE')}
|
||||
</span>
|
||||
<h2 className='space-x-1 mb-11 text-4xl font-semibold text-dark dark:text-white xl:text-[42px] xl:leading-[1.21]'>
|
||||
<span className='text-xl font-medium'>
|
||||
{siteConfig('STARTER_PRICING_3_PRICE_CURRENCY')}
|
||||
</span>
|
||||
<span className='-ml-1 -tracking-[2px]'>
|
||||
{siteConfig('STARTER_PRICING_3_PRICE')}
|
||||
</span>
|
||||
<span className='text-base font-normal text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_PRICING_3_PRICE_PERIOD')}
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<div className='mb-[50px]'>
|
||||
<h5 className='mb-5 text-lg font-medium text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_PRICING_3_HEADER')}
|
||||
</h5>
|
||||
<div className='flex flex-col gap-[14px]'>
|
||||
{siteConfig('STARTER_PRICING_3_FEATURES')
|
||||
?.split(',')
|
||||
.map((feature, index) => {
|
||||
return (
|
||||
<p
|
||||
key={index}
|
||||
className='text-base text-body-color dark:text-dark-6'>
|
||||
{feature}
|
||||
</p>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
href={siteConfig('STARTER_PRICING_3_BUTTON_URL')}
|
||||
className='inline-block rounded-md bg-primary px-7 py-3 text-center text-base font-medium text-white transition hover:bg-blue-dark'>
|
||||
{siteConfig('STARTER_PRICING_3_BUTTON_TEXT')}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="-mx-4 flex flex-wrap justify-center">
|
||||
|
||||
{/* 第一个付费计划 */}
|
||||
<div className="w-full px-4 md:w-1/2 lg:w-1/3">
|
||||
<div
|
||||
className="relative z-10 mb-10 overflow-hidden rounded-xl bg-white px-8 py-10 shadow-pricing dark:bg-dark-2 sm:p-12 lg:px-6 lg:py-10 xl:p-14"
|
||||
>
|
||||
<span
|
||||
className="mb-5 block text-xl font-medium text-dark dark:text-white"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_1_TITLE', null, CONFIG)}
|
||||
</span>
|
||||
<h2
|
||||
className="space-x-1 mb-11 text-4xl font-semibold text-dark dark:text-white xl:text-[42px] xl:leading-[1.21]"
|
||||
>
|
||||
<span className="text-xl font-medium">{siteConfig('STARTER_PRICING_1_PRICE_CURRENCY', null, CONFIG)}</span>
|
||||
<span className="-ml-1 -tracking-[2px]">{siteConfig('STARTER_PRICING_1_PRICE', null, CONFIG)}</span>
|
||||
<span
|
||||
className="text-base font-normal text-body-color dark:text-dark-6"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_1_PRICE_PERIOD', null, CONFIG)}
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<div className="mb-[50px]">
|
||||
<h5 className="mb-5 text-lg font-medium text-dark dark:text-white">
|
||||
{siteConfig('STARTER_PRICING_1_HEADER', null, CONFIG)}
|
||||
</h5>
|
||||
<div className="flex flex-col gap-[14px]">
|
||||
{siteConfig('STARTER_PRICING_1_FEATURES', null, CONFIG)?.split(',').map((feature, index) => {
|
||||
return <p key={index} className="text-base text-body-color dark:text-dark-6">
|
||||
{feature}
|
||||
</p>
|
||||
})}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
href={siteConfig('STARTER_PRICING_1_BUTTON_URL', null, CONFIG)}
|
||||
className="inline-block rounded-md bg-primary px-7 py-3 text-center text-base font-medium text-white transition hover:bg-blue-dark"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_1_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 第二个付费计划 */}
|
||||
<div className="w-full px-4 md:w-1/2 lg:w-1/3">
|
||||
<div
|
||||
className="relative z-10 mb-10 overflow-hidden rounded-xl bg-white px-8 py-10 shadow-pricing dark:bg-dark-2 sm:p-12 lg:px-6 lg:py-10 xl:p-14"
|
||||
>
|
||||
<p style={{ writingMode: 'vertical-rl', textOrientation: 'mixed' }}
|
||||
className="absolute p-1 right-0 top-0 inline-block rounded-bl-md rounded-tl-md bg-primary text-base font-medium text-white tracking-wider"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_2_TAG', null, CONFIG)}
|
||||
</p>
|
||||
<span
|
||||
className="mb-5 block text-xl font-medium text-dark dark:text-white"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_2_TITLE', null, CONFIG)}
|
||||
</span>
|
||||
<h2
|
||||
className="space-x-1 mb-11 text-4xl font-semibold text-dark dark:text-white xl:text-[42px] xl:leading-[1.21]"
|
||||
>
|
||||
<span className="text-xl font-medium">{siteConfig('STARTER_PRICING_2_PRICE_CURRENCY', null, CONFIG)}</span>
|
||||
<span className="-ml-1 -tracking-[2px]">{siteConfig('STARTER_PRICING_2_PRICE', null, CONFIG)}</span>
|
||||
<span
|
||||
className="text-base font-normal text-body-color dark:text-dark-6"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_2_PRICE_PERIOD', null, CONFIG)}
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<div className="mb-[50px]">
|
||||
<h5 className="mb-5 text-lg font-medium text-dark dark:text-white">
|
||||
{siteConfig('STARTER_PRICING_2_HEADER', null, CONFIG)}
|
||||
</h5>
|
||||
<div className="flex flex-col gap-[14px]">
|
||||
{siteConfig('STARTER_PRICING_2_FEATURES', null, CONFIG)?.split(',').map((feature, index) => {
|
||||
return <p key={index} className="text-base text-body-color dark:text-dark-6">
|
||||
{feature}
|
||||
</p>
|
||||
})}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
href={siteConfig('STARTER_PRICING_2_BUTTON_URL', null, CONFIG)}
|
||||
className="inline-block rounded-md bg-primary px-7 py-3 text-center text-base font-medium text-white transition hover:bg-blue-dark"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_2_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 第三个付费计划 */}
|
||||
<div className="w-full px-4 md:w-1/2 lg:w-1/3">
|
||||
<div
|
||||
className="relative z-10 mb-10 overflow-hidden rounded-xl bg-white px-8 py-10 shadow-pricing dark:bg-dark-2 sm:p-12 lg:px-6 lg:py-10 xl:p-14"
|
||||
>
|
||||
<span
|
||||
className="mb-5 block text-xl font-medium text-dark dark:text-white"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_3_TITLE', null, CONFIG)}
|
||||
</span>
|
||||
<h2
|
||||
className="space-x-1 mb-11 text-4xl font-semibold text-dark dark:text-white xl:text-[42px] xl:leading-[1.21]"
|
||||
>
|
||||
<span className="text-xl font-medium">{siteConfig('STARTER_PRICING_3_PRICE_CURRENCY', null, CONFIG)}</span>
|
||||
<span className="-ml-1 -tracking-[2px]">{siteConfig('STARTER_PRICING_3_PRICE', null, CONFIG)}</span>
|
||||
<span
|
||||
className="text-base font-normal text-body-color dark:text-dark-6"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_3_PRICE_PERIOD', null, CONFIG)}
|
||||
</span>
|
||||
</h2>
|
||||
|
||||
<div className="mb-[50px]">
|
||||
<h5 className="mb-5 text-lg font-medium text-dark dark:text-white">
|
||||
{siteConfig('STARTER_PRICING_3_HEADER', null, CONFIG)}
|
||||
</h5>
|
||||
<div className="flex flex-col gap-[14px]">
|
||||
{siteConfig('STARTER_PRICING_3_FEATURES', null, CONFIG)?.split(',').map((feature, index) => {
|
||||
return <p key={index} className="text-base text-body-color dark:text-dark-6">
|
||||
{feature}
|
||||
</p>
|
||||
})}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<a
|
||||
href={siteConfig('STARTER_PRICING_3_BUTTON_URL', null, CONFIG)}
|
||||
className="inline-block rounded-md bg-primary px-7 py-3 text-center text-base font-medium text-white transition hover:bg-blue-dark"
|
||||
>
|
||||
{siteConfig('STARTER_PRICING_3_BUTTON_TEXT', null, CONFIG)}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/* <!-- ====== Pricing Section End --> */}
|
||||
|
||||
</>
|
||||
</section>
|
||||
{/* <!-- ====== Pricing Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import CONFIG from '../config'
|
||||
import { SVGAvatarBG } from './svg/SVGAvatarBG'
|
||||
|
||||
export const Team = () => {
|
||||
const STARTER_TEAM_ITEMS = siteConfig('STARTER_TEAM_ITEMS')
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Team Section Start --> */}
|
||||
@@ -15,14 +15,14 @@ export const Team = () => {
|
||||
<div className='w-full px-4'>
|
||||
<div className='mx-auto mb-[60px] max-w-[485px] text-center'>
|
||||
<span className='mb-2 block text-lg font-semibold text-primary'>
|
||||
{siteConfig('STARTER_TEAM_TITLE', null, CONFIG)}
|
||||
{siteConfig('STARTER_TEAM_TITLE')}
|
||||
</span>
|
||||
<h2 className='mb-3 text-3xl font-bold leading-[1.2] text-dark dark:text-white sm:text-4xl md:text-[40px]'>
|
||||
{siteConfig('STARTER_TEAM_TEXT_1', null, CONFIG)}
|
||||
{siteConfig('STARTER_TEAM_TEXT_1')}
|
||||
</h2>
|
||||
<p
|
||||
dangerouslySetInnerHTML={{
|
||||
__html: siteConfig('STARTER_TEAM_TEXT_2', null, CONFIG)
|
||||
__html: siteConfig('STARTER_TEAM_TEXT_2')
|
||||
}}
|
||||
className='text-base text-body-color dark:text-dark-6'></p>
|
||||
</div>
|
||||
@@ -31,7 +31,7 @@ export const Team = () => {
|
||||
|
||||
{/* 团队成员排列矩阵 */}
|
||||
<div className='-mx-4 flex flex-wrap justify-center'>
|
||||
{CONFIG.STARTER_TEAM_ITEMS.map((item, index) => {
|
||||
{STARTER_TEAM_ITEMS?.map((item, index) => {
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
|
||||
@@ -4,7 +4,6 @@
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import { loadExternalResource } from '@/lib/utils'
|
||||
import { useEffect } from 'react'
|
||||
import CONFIG from '../config'
|
||||
import { SVGLeftArrow } from './svg/SVGLeftArrow'
|
||||
import { SVGRightArrow } from './svg/SVGRightArrow'
|
||||
|
||||
@@ -60,11 +59,7 @@ export const Testimonials = () => {
|
||||
}, [])
|
||||
// 用户评分
|
||||
const ratings = [1, 2, 3, 4, 5]
|
||||
const STARTER_TESTIMONIALS_ITEMS = siteConfig(
|
||||
'STARTER_TESTIMONIALS_ITEMS',
|
||||
[],
|
||||
CONFIG
|
||||
)
|
||||
const STARTER_TESTIMONIALS_ITEMS = siteConfig('STARTER_TESTIMONIALS_ITEMS')
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Testimonial Section Start --> */}
|
||||
@@ -76,13 +71,13 @@ export const Testimonials = () => {
|
||||
<div className='w-full px-4'>
|
||||
<div className='mx-auto mb-[60px] max-w-[485px] text-center'>
|
||||
<span className='mb-2 block text-lg font-semibold text-primary'>
|
||||
{siteConfig('STARTER_TESTIMONIALS_TITLE', null, CONFIG)}
|
||||
{siteConfig('STARTER_TESTIMONIALS_TITLE')}
|
||||
</span>
|
||||
<h2 className='mb-3 text-3xl font-bold leading-[1.2] text-dark dark:text-white sm:text-4xl md:text-[40px]'>
|
||||
{siteConfig('STARTER_TESTIMONIALS_TEXT_1', null, CONFIG)}
|
||||
{siteConfig('STARTER_TESTIMONIALS_TEXT_1')}
|
||||
</h2>
|
||||
<p className='text-base text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_TESTIMONIALS_TEXT_2', null, CONFIG)}
|
||||
{siteConfig('STARTER_TESTIMONIALS_TEXT_2')}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -101,11 +96,7 @@ export const Testimonials = () => {
|
||||
<img
|
||||
key={index}
|
||||
alt='star icon' // 为每个图片设置唯一的 key 属性
|
||||
src={siteConfig(
|
||||
'STARTER_TESTIMONIALS_STAR_ICON',
|
||||
null,
|
||||
CONFIG
|
||||
)}
|
||||
src={siteConfig('STARTER_TESTIMONIALS_STAR_ICON')}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@@ -358,6 +358,17 @@ const CONFIG = {
|
||||
STARTER_404_TEXT: '抱歉！您要查找的页面不存在。可能已经移动或删除。',
|
||||
STARTER_404_BACK: '回到主页',
|
||||
|
||||
// 页面底部的行动呼吁模块
|
||||
STARTER_CTA_ENABLE: true,
|
||||
STARTER_CTA_TITLE: '你还在等待什么呢？',
|
||||
STARTER_CTA_TITLE_2: '现在开始吧',
|
||||
STARTER_CTA_DESCRIOTN:
|
||||
'访问NotionNext的操作文档，我们提供了详细的教程，帮助你即刻搭建站点',
|
||||
STARTER_CTA_BUTTON: true, // 是否显示按钮
|
||||
STARTER_CTA_BUTTON_URL:
|
||||
'https://docs.tangly1024.com/article/vercel-deploy-notion-next',
|
||||
STARTER_CTA_BUTTON_TEXT: '开始体验',
|
||||
|
||||
STARTER_POST_REDIRECT_ENABLE: true, // 默認開啟重定向
|
||||
STARTER_POST_REDIRECT_URL: 'https://blog.tangly1024.com', // 重定向域名
|
||||
STARTER_NEWSLETTER: process.env.NEXT_PUBLIC_THEME_STARTER_NEWSLETTER || false // 是否开启邮件订阅 请先配置mailchimp功能 https://docs.tangly1024.com/article/notion-next-mailchimp
|
||||
|
||||
@@ -31,12 +31,11 @@ import { Testimonials } from './components/Testimonials'
|
||||
import CONFIG from './config'
|
||||
import { Style } from './style'
|
||||
// import { MadeWithButton } from './components/MadeWithButton'
|
||||
import BLOG from '@/blog.config'
|
||||
import { loadWowJS } from '@/lib/plugins/wow'
|
||||
import Link from 'next/link'
|
||||
import { Banner } from './components/Banner'
|
||||
import { CTA } from './components/CTA'
|
||||
import { SignInForm } from './components/SignInForm'
|
||||
import { SignUpForm } from './components/SignUpForm'
|
||||
import { SVG404 } from './components/svg/SVG404'
|
||||
|
||||
/**
|
||||
@@ -58,7 +57,7 @@ const LayoutBase = props => {
|
||||
return (
|
||||
<div
|
||||
id='theme-starter'
|
||||
className={`${siteConfig('FONT_STYLE', BLOG.FONT_STYLE, props.NOTION_CONFIG)} min-h-screen flex flex-col dark:bg-[#212b36] scroll-smooth`}>
|
||||
className={`${siteConfig('FONT_STYLE')} min-h-screen flex flex-col dark:bg-[#212b36] scroll-smooth`}>
|
||||
<Style />
|
||||
<NavBar {...props} />
|
||||
|
||||
@@ -84,29 +83,26 @@ const LayoutIndex = props => {
|
||||
return (
|
||||
<>
|
||||
{/* 英雄区 */}
|
||||
{siteConfig('STARTER_HERO_ENABLE', null, CONFIG) && <Hero />}
|
||||
{siteConfig('STARTER_HERO_ENABLE') && <Hero />}
|
||||
{/* 产品特性 */}
|
||||
{siteConfig('STARTER_FEATURE_ENABLE', null, CONFIG) && <Features />}
|
||||
{siteConfig('STARTER_FEATURE_ENABLE') && <Features />}
|
||||
{/* 关于 */}
|
||||
{siteConfig('STARTER_ABOUT_ENABLE', null, CONFIG) && <About />}
|
||||
{siteConfig('STARTER_ABOUT_ENABLE') && <About />}
|
||||
{/* 价格 */}
|
||||
{siteConfig('STARTER_PRICING_ENABLE', null, CONFIG) && <Pricing />}
|
||||
{siteConfig('STARTER_PRICING_ENABLE') && <Pricing />}
|
||||
{/* 评价展示 */}
|
||||
{siteConfig('STARTER_TESTIMONIALS_ENABLE', null, CONFIG) && (
|
||||
<Testimonials />
|
||||
)}
|
||||
{siteConfig('STARTER_TESTIMONIALS_ENABLE') && <Testimonials />}
|
||||
{/* 常见问题 */}
|
||||
{siteConfig('STARTER_FAQ_ENABLE', null, CONFIG) && <FAQ />}
|
||||
{siteConfig('STARTER_FAQ_ENABLE') && <FAQ />}
|
||||
{/* 团队介绍 */}
|
||||
{siteConfig('STARTER_TEAM_ENABLE', null, CONFIG) && <Team />}
|
||||
{siteConfig('STARTER_TEAM_ENABLE') && <Team />}
|
||||
{/* 博文列表 */}
|
||||
{siteConfig('STARTER_BLOG_ENABLE', null, CONFIG) && (
|
||||
<Blog posts={posts} />
|
||||
)}
|
||||
{siteConfig('STARTER_BLOG_ENABLE') && <Blog posts={posts} />}
|
||||
{/* 联系方式 */}
|
||||
{siteConfig('STARTER_CONTACT_ENABLE', null, CONFIG) && <Contact />}
|
||||
{siteConfig('STARTER_CONTACT_ENABLE') && <Contact />}
|
||||
{/* 合作伙伴 */}
|
||||
{siteConfig('STARTER_BRANDS_ENABLE', null, CONFIG) && <Brand />}
|
||||
{siteConfig('STARTER_BRANDS_ENABLE') && <Brand />}
|
||||
<CTA />
|
||||
</>
|
||||
)
|
||||
}
|
||||
@@ -123,12 +119,12 @@ const LayoutSlug = props => {
|
||||
const router = useRouter()
|
||||
if (
|
||||
!post &&
|
||||
siteConfig('STARTER_POST_REDIRECT_ENABLE', null, CONFIG) &&
|
||||
siteConfig('STARTER_POST_REDIRECT_ENABLE') &&
|
||||
isBrowser &&
|
||||
router.route === '/[prefix]/[slug]'
|
||||
) {
|
||||
const redirectUrl =
|
||||
siteConfig('STARTER_POST_REDIRECT_URL', null, CONFIG) +
|
||||
siteConfig('STARTER_POST_REDIRECT_URL') +
|
||||
router.asPath.replace('?theme=landing', '')
|
||||
router.push(redirectUrl)
|
||||
return (
|
||||
@@ -195,15 +191,15 @@ const Layout404 = props => {
|
||||
<SVG404 />
|
||||
</div>
|
||||
<h3 className='mb-5 text-2xl font-semibold text-dark dark:text-white'>
|
||||
{siteConfig('STARTER_404_TITLE', null, CONFIG)}
|
||||
{siteConfig('STARTER_404_TITLE')}
|
||||
</h3>
|
||||
<p className='mb-8 text-base text-body-color dark:text-dark-6'>
|
||||
{siteConfig('STARTER_404_TEXT', null, CONFIG)}
|
||||
{siteConfig('STARTER_404_TEXT')}
|
||||
</p>
|
||||
<Link
|
||||
href='/'
|
||||
className='py-3 text-base font-medium text-white transition rounded-md bg-dark px-7 hover:bg-primary'>
|
||||
{siteConfig('STARTER_404_BACK', null, CONFIG)}
|
||||
{siteConfig('STARTER_404_BACK')}
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
@@ -225,13 +221,15 @@ const LayoutTagIndex = props => <></>
|
||||
* @returns
|
||||
*/
|
||||
const LayoutSignIn = props => {
|
||||
const title = siteConfig('STARTER_SIGNIN', '登录')
|
||||
const description = siteConfig(
|
||||
'STARTER_SIGNIN_DESCRITION',
|
||||
'这里是演示页面，NotionNext目前不提供会员登录功能'
|
||||
)
|
||||
return (
|
||||
<>
|
||||
<div className='grow mt-20'>
|
||||
<Banner
|
||||
title='登录'
|
||||
description='这里是演示页面，NotionNext目前不提供会员登录功能'
|
||||
/>
|
||||
<Banner title={title} description={description} />
|
||||
<SignInForm />
|
||||
</div>
|
||||
</>
|
||||
@@ -243,17 +241,21 @@ const LayoutSignIn = props => {
|
||||
* @param {*} props
|
||||
* @returns
|
||||
*/
|
||||
const LayoutSignUp = props => (
|
||||
<>
|
||||
<div className='grow mt-20'>
|
||||
<Banner
|
||||
title='注册'
|
||||
description='这里是演示页面，NotionNext目前不提供会员注册功能'
|
||||
/>
|
||||
<SignUpForm />
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
const LayoutSignUp = props => {
|
||||
const title = siteConfig('STARTER_SIGNIN', '注册')
|
||||
const description = siteConfig(
|
||||
'STARTER_SIGNIN_DESCRITION',
|
||||
'这里是演示页面，NotionNext目前不提供会员注册功能'
|
||||
)
|
||||
return (
|
||||
<>
|
||||
<div className='grow mt-20'>
|
||||
<Banner title={title} description={description} />
|
||||
<SignInForm />
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export {
|
||||
Layout404,
|
||||
|
||||
Reference in New Issue
Block a user