mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-25 07:26:49 +00:00
proxio主题加入部分动画
This commit is contained in:
@@ -13,7 +13,7 @@ const Announcement = ({ post, className }) => {
|
||||
<div className={className}>
|
||||
<section
|
||||
id='announcement-wrapper'
|
||||
className='rounded-xl px-2'>
|
||||
className='rounded-xl px-2 wow fadeInUp' data-wow-delay='.2s'>
|
||||
{/* <div><i className='mr-2 fas fa-bullhorn' />{locale.COMMON.ANNOUNCEMENT}</div> */}
|
||||
{post && (
|
||||
<div id='announcement-content'>
|
||||
|
||||
@@ -15,7 +15,7 @@ export const Blog = ({ posts }) => {
|
||||
<section className='bg-white pb-10 pt-20 dark:bg-dark lg:pb-20 lg:pt-[120px]'>
|
||||
<div className='container mx-auto'>
|
||||
{/* 区块标题文字 */}
|
||||
<div className='-mx-4 flex flex-wrap justify-center'>
|
||||
<div className='-mx-4 flex flex-wrap justify-center wow fadeInUp' data-wow-delay='.2s'>
|
||||
<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'>
|
||||
@@ -33,21 +33,25 @@ export const Blog = ({ posts }) => {
|
||||
return (
|
||||
<div key={index} className='w-full px-4'>
|
||||
<div
|
||||
className='wow fadeInUp group mb-10'
|
||||
className='wow fadeInUp group mb-10 relative overflow-hidden rounded-[10px]'
|
||||
data-wow-delay='.1s'>
|
||||
<div className='mb-8 overflow-hidden rounded-[5px]'>
|
||||
{/* 图片部分 */}
|
||||
<div className='relative'>
|
||||
{item.pageCoverThumbnail && (
|
||||
<Link href={item?.href} className='block'>
|
||||
<LazyImage
|
||||
src={item.pageCoverThumbnail}
|
||||
alt={item.title}
|
||||
className='w-full h-80 object-cover transition group-hover:rotate-6 group-hover:scale-125'
|
||||
className='w-full h-80 object-cover transition-transform duration-500'
|
||||
/>
|
||||
</Link>
|
||||
)}
|
||||
{/* 遮罩层,仅覆盖图片部分 */}
|
||||
<div className='absolute inset-0 bg-gray-100 dark:bg-hexo-black-gray transition-opacity duration-500 group-hover:opacity-0'></div>
|
||||
</div>
|
||||
<div>
|
||||
<span className='mb-6 inline-block rounded-[5px] bg-primary px-4 py-0.5 text-center text-xs font-medium leading-loose text-white'>
|
||||
{/* 内容部分 */}
|
||||
<div className='relative z-10 p-4'>
|
||||
<span className='mb-6 inline-block rounded-[10px] bg-primary px-4 py-0.5 text-center text-xs font-medium leading-loose text-white'>
|
||||
{item.publishDay}
|
||||
</span>
|
||||
<h3>
|
||||
@@ -71,4 +75,4 @@ export const Blog = ({ posts }) => {
|
||||
{/* <!-- ====== Blog Section End --> */}
|
||||
</>
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -13,26 +13,26 @@ export const CTA = () => {
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== CTA Section Start --> */}
|
||||
<section className='relative z-10 overflow-hidden bg-primary py-20 lg:py-[115px]'>
|
||||
<section className='relative z-10 overflow-hidden bg-gray-1 dark:bg-dark-2 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='w-full px-4 mb-2'>
|
||||
<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]'>
|
||||
<h2 className='mb-2.5 text-3xl font-bold dark:text-white md:text-[38px] md:leading-[1.44]'>
|
||||
<span>{siteConfig('PROXIO_CTA_TITLE')}</span>
|
||||
<span className='text-3xl font-normal md:text-[40px]'>
|
||||
{siteConfig('PROXIO_CTA_TITLE_2')}
|
||||
</span>
|
||||
</h2>
|
||||
<p className='mx-auto mb-6 max-w-[515px] text-base leading-[1.5] text-white'>
|
||||
<p className='mx-auto mb-6 max-w-[515px] text-base leading-[1.5] dark:text-white'>
|
||||
{siteConfig('PROXIO_CTA_DESCRIPTION')}
|
||||
</p>
|
||||
{siteConfig('PROXIO_CTA_BUTTON') && (
|
||||
<>
|
||||
<Link
|
||||
href={siteConfig('PROXIO_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]'>
|
||||
className='inline-flex items-center justify-center rounded-2xl 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'>
|
||||
{siteConfig('PROXIO_CTA_BUTTON_TEXT')}
|
||||
</Link>
|
||||
</>
|
||||
|
||||
@@ -1,168 +1,96 @@
|
||||
import AnalyticsBusuanzi from '@/components/AnalyticsBusuanzi'
|
||||
import { BeiAnGongAn } from '@/components/BeiAnGongAn'
|
||||
import BeiAnSite from '@/components/BeiAnSite'
|
||||
import CopyRightDate from '@/components/CopyRightDate'
|
||||
import DarkModeButton from '@/components/DarkModeButton'
|
||||
import LazyImage from '@/components/LazyImage'
|
||||
import PoweredBy from '@/components/PoweredBy'
|
||||
import { siteConfig } from '@/lib/config'
|
||||
import SocialButton from '@/themes/fukasawa/components/SocialButton'
|
||||
import { Logo } from './Logo'
|
||||
import { SVGFooterCircleBG } from './svg/SVGFooterCircleBG'
|
||||
import { useGlobal } from '@/lib/global'
|
||||
import Link from 'next/link'
|
||||
import CONFIG from '../config'
|
||||
import SocialButton from './SocialButton'
|
||||
|
||||
/**
|
||||
* 网页底脚
|
||||
*/
|
||||
export const Footer = ({ title }) => {
|
||||
const { siteInfo } = useGlobal()
|
||||
const PROXIO_FOOTER_LINKS = siteConfig('PROXIO_FOOTER_LINKS', [], CONFIG)
|
||||
|
||||
/* eslint-disable @next/next/no-img-element */
|
||||
export const Footer = props => {
|
||||
const footerPostCount = siteConfig('PROXIO_FOOTER_POST_COUNT', 2)
|
||||
const latestPosts = props?.latestPosts
|
||||
? props?.latestPosts.slice(0, footerPostCount)
|
||||
: []
|
||||
const PROXIO_FOOTER_LINK_GROUP = siteConfig('PROXIO_FOOTER_LINK_GROUP', [])
|
||||
return (
|
||||
<>
|
||||
{/* <!-- ====== Footer Section Start --> */}
|
||||
<footer
|
||||
className='wow fadeInUp relative z-10 bg-[#090E34] pt-20 lg:pt-[100px]'
|
||||
data-wow-delay='.15s'>
|
||||
<div className='container'>
|
||||
<div className='-mx-4 flex flex-wrap'>
|
||||
<div className='w-full px-4 sm:w-1/2 md:w-1/2 lg:w-4/12 xl:w-3/12'>
|
||||
<div className='mb-10 w-full'>
|
||||
<a className='-mx-4 mb-6 inline-block max-w-[160px]'>
|
||||
<Logo white={true} />
|
||||
</a>
|
||||
<p className='mb-8 max-w-[270px] text-base text-gray-7'>
|
||||
{siteConfig('PROXIO_FOOTER_SLOGAN')}
|
||||
</p>
|
||||
<div className='-mx-3 flex items-center'>
|
||||
<div className='mx-3'>
|
||||
<SocialButton />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<footer
|
||||
id='footer-bottom'
|
||||
className='z-10 justify-center m-auto w-full p-6 relative container'>
|
||||
<div className='max-w-screen-3xl w-full mx-auto '>
|
||||
{/* 信息与链接区块 */}
|
||||
<div className='w-full flex lg:flex-row flex-col justify-between py-16'>
|
||||
<div className='gap-y-2 flex flex-col items-start dark:text-gray-200'>
|
||||
<div className='flex gap-x-1'>
|
||||
<LazyImage
|
||||
src={siteInfo?.icon}
|
||||
className='rounded-full'
|
||||
width={24}
|
||||
alt={siteConfig('AUTHOR')}
|
||||
/>
|
||||
<h1 className='text-lg'>{title}</h1>
|
||||
<span
|
||||
className='underline font-bold justify-start'>
|
||||
{siteConfig('AUTHOR')}
|
||||
</span>
|
||||
</div>
|
||||
<div className='px-1'>{siteConfig('DESCRIPTION')}</div>
|
||||
<div className='px-1'>{siteConfig('CONTACT_EMAIL')}</div>
|
||||
</div>
|
||||
|
||||
{/* 中间三列菜单组 */}
|
||||
{PROXIO_FOOTER_LINK_GROUP?.map((item, index) => {
|
||||
{/* 右侧链接区块 */}
|
||||
<div className='flex gap-x-4'>
|
||||
{PROXIO_FOOTER_LINKS?.map((group, index) => {
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
className='w-full px-4 sm:w-1/2 md:w-1/2 lg:w-2/12 xl:w-2/12'>
|
||||
<div className='mb-10 w-full'>
|
||||
<h4 className='mb-9 text-lg font-semibold text-white'>
|
||||
{item.TITLE}
|
||||
</h4>
|
||||
<ul>
|
||||
{item?.LINK_GROUP?.map((l, i) => {
|
||||
return (
|
||||
<li key={i}>
|
||||
<Link
|
||||
href={l.URL}
|
||||
className='mb-3 inline-block text-base text-gray-7 hover:text-primary'>
|
||||
{l.TITLE}
|
||||
</Link>
|
||||
</li>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
<div key={index}>
|
||||
<div className='font-bold text-xl dark:text-white lg:pb-8 pb-4'>
|
||||
{group.name}
|
||||
</div>
|
||||
<div className='flex flex-col gap-y-2'>
|
||||
{group?.menus?.map((menu, index) => {
|
||||
return (
|
||||
<div key={index}>
|
||||
<Link href={menu.href} className='hover:underline dark:text-gray-200'>
|
||||
{menu.title}
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 页脚右侧最新博文 */}
|
||||
<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('PROXIO_FOOTER_BLOG_LATEST_TITLE')}
|
||||
</h4>
|
||||
{/* 展示两条最新博客文章 */}
|
||||
<div className='flex flex-col gap-8'>
|
||||
{latestPosts?.map((item, index) => {
|
||||
return (
|
||||
<Link
|
||||
key={index}
|
||||
href={item?.href}
|
||||
className='group flex items-center gap-[22px]'>
|
||||
{item.pageCoverThumbnail && (
|
||||
<div className='overflow-hidden rounded w-20 h-12'>
|
||||
<img
|
||||
src={item.pageCoverThumbnail}
|
||||
alt={item.title}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
<span className='line-clamp-2 max-w-[180px] text-base text-gray-7 group-hover:text-white'>
|
||||
{item.title}
|
||||
</span>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
{/* 页脚 */}
|
||||
<div className='dark:text-gray-200 py-4 flex flex-col lg:flex-row justify-between items-center border-t border-gray-600'>
|
||||
<div className='flex gap-x-2 flex-wrap justify-between items-center'>
|
||||
<CopyRightDate />
|
||||
<PoweredBy />
|
||||
</div>
|
||||
|
||||
<DarkModeButton className='text-white' />
|
||||
|
||||
<div className='flex justify-between items-center gap-x-2'>
|
||||
<div className='flex items-center gap-x-4'>
|
||||
<AnalyticsBusuanzi />
|
||||
<SocialButton />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* 底部版权信息相关 */}
|
||||
|
||||
<div className='mt-12 border-t border-[#8890A4] border-opacity-40 py-8 lg:mt-[60px]'>
|
||||
<div className='container'>
|
||||
<div className='-mx-4 flex flex-wrap'>
|
||||
<div className='w-full px-4 md:w-2/3 lg:w-1/2'>
|
||||
<div className='my-1'>
|
||||
<div className='-mx-3 flex items-center justify-center md:justify-start'>
|
||||
<Link
|
||||
href={siteConfig('PROXIO_FOOTER_PRIVACY_POLICY_URL', '')}
|
||||
className='px-3 text-base text-gray-7 hover:text-white hover:underline'>
|
||||
{siteConfig('PROXIO_FOOTER_PRIVACY_POLICY_TEXT')}
|
||||
</Link>
|
||||
<Link
|
||||
href={siteConfig(
|
||||
'PROXIO_FOOTER_PRIVACY_LEGAL_NOTICE_URL', ''
|
||||
)}
|
||||
className='px-3 text-base text-gray-7 hover:text-white hover:underline'>
|
||||
{siteConfig('PROXIO_FOOTER_PRIVACY_LEGAL_NOTICE_TEXT')}
|
||||
</Link>
|
||||
<Link
|
||||
href={siteConfig(
|
||||
'PROXIO_FOOTER_PRIVACY_TERMS_OF_SERVICE_URL', ''
|
||||
)}
|
||||
className='px-3 text-base text-gray-7 hover:text-white hover:underline'>
|
||||
{siteConfig(
|
||||
'PROXIO_FOOTER_PRIVACY_TERMS_OF_SERVICE_TEXT', ''
|
||||
)}
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className='w-full px-4 md:w-1/3 lg:w-1/2'>
|
||||
<div className='my-1 flex justify-center md:justify-end'>
|
||||
<p className='text-base text-gray-7'>
|
||||
Designed and Developed by
|
||||
<a
|
||||
href='https://github.com/tangly1024/NotionNext'
|
||||
rel='nofollow noopner noreferrer'
|
||||
target='_blank'
|
||||
className='px-1 text-gray-1 hover:underline'>
|
||||
NotionNext {siteConfig('VERSION')}
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* 备案 */}
|
||||
<div className='dark:text-gray-200 w-full text-center flex flex-wrap items-center justify-center gap-x-2'>
|
||||
<BeiAnSite />
|
||||
<BeiAnGongAn />
|
||||
</div>
|
||||
|
||||
{/* Footer 背景 */}
|
||||
<div>
|
||||
<span className='absolute left-0 top-0 z-[-1]'>
|
||||
<img src='/images/starter/footer/shape-1.svg' alt='' />
|
||||
</span>
|
||||
|
||||
<span className='absolute bottom-0 right-0 z-[-1]'>
|
||||
<img src='/images/starter/footer/shape-3.svg' alt='' />
|
||||
</span>
|
||||
|
||||
<span className='absolute right-0 top-0 z-[-1]'>
|
||||
<SVGFooterCircleBG />
|
||||
</span>
|
||||
</div>
|
||||
</footer>
|
||||
{/* <!-- ====== Footer Section End --> */}
|
||||
</>
|
||||
</div>
|
||||
</footer>
|
||||
)
|
||||
}
|
||||
}
|
||||
168
themes/proxio/components/LoadingCover.js
Normal file
168
themes/proxio/components/LoadingCover.js
Normal file
@@ -0,0 +1,168 @@
|
||||
import { siteConfig } from '@/lib/config';
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
const LoadingCover = ({ onFinishLoading }) => {
|
||||
const [isVisible, setIsVisible] = useState(true);
|
||||
const welcomeText = siteConfig('PROXIO_WELCOME_TEXT', '欢迎来到我们的网站!');
|
||||
|
||||
// 定义颜色变量
|
||||
const colors = {
|
||||
backgroundStart: '#1a1a1a', // 深灰色
|
||||
backgroundMiddle: '#4d4d4d', // 中灰色
|
||||
backgroundEnd: '#e6e6e6', // 浅灰色
|
||||
textColor: '#ffffff', // 白色
|
||||
rippleColor: 'rgba(255, 255, 255, 0.6)', // 半透明白色
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
const pageContainer = document.getElementById('pageContainer');
|
||||
|
||||
const handleClick = (e) => {
|
||||
// 创建扩散光圈
|
||||
const ripple = document.createElement('div');
|
||||
ripple.classList.add('ripple');
|
||||
ripple.style.left = `${e.clientX - 10}px`;
|
||||
ripple.style.top = `${e.clientY - 10}px`;
|
||||
document.body.appendChild(ripple);
|
||||
|
||||
// 添加页面缩放 + 模糊动画
|
||||
pageContainer.classList.add('page-clicked');
|
||||
|
||||
// 模拟加载完成,调用回调函数
|
||||
setTimeout(() => {
|
||||
setIsVisible(false); // 淡出动画
|
||||
setTimeout(() => {
|
||||
if (onFinishLoading) {
|
||||
onFinishLoading();
|
||||
}
|
||||
}, 600); // 等待淡出动画完成
|
||||
}, 1200);
|
||||
|
||||
// 清理 ripple 元素
|
||||
setTimeout(() => {
|
||||
ripple.remove();
|
||||
}, 1000);
|
||||
};
|
||||
|
||||
document.body.addEventListener('click', handleClick);
|
||||
|
||||
return () => {
|
||||
document.body.removeEventListener('click', handleClick);
|
||||
};
|
||||
}, [onFinishLoading]);
|
||||
|
||||
if (!isVisible) return null;
|
||||
|
||||
return (
|
||||
<div className="welcome" id="pageContainer">
|
||||
<div className="welcome-text" id="welcomeText">
|
||||
{welcomeText}
|
||||
</div>
|
||||
<style jsx>
|
||||
{`
|
||||
body {
|
||||
margin: 0;
|
||||
background-color: ${colors.backgroundStart};
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.welcome {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 9999;
|
||||
pointer-events: auto;
|
||||
background: linear-gradient(120deg, ${colors.backgroundStart}, ${colors.backgroundMiddle}, ${colors.backgroundEnd});
|
||||
background-size: 300% 300%;
|
||||
animation: gradientShift 6s ease infinite;
|
||||
transition: opacity 0.6s ease; /* 淡出动画 */
|
||||
}
|
||||
|
||||
.welcome.page-clicked {
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.welcome-text {
|
||||
font-size: 2.5rem;
|
||||
font-weight: bold;
|
||||
color: ${colors.textColor};
|
||||
text-shadow: 0 0 15px rgba(255, 255, 255, 0.9), 0 0 30px rgba(255, 255, 255, 0.6);
|
||||
user-select: none;
|
||||
animation: textPulse 3s ease-in-out infinite, fadeInUp 1.5s ease-out forwards;
|
||||
text-align: center;
|
||||
z-index: 10000; /* 确保文字层级高于背景 */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ripple {
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
background: radial-gradient(${colors.rippleColor} 0%, transparent 70%);
|
||||
pointer-events: none;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
transform: scale(0);
|
||||
opacity: 0.8;
|
||||
z-index: 10;
|
||||
animation: rippleExpand 1s ease-out forwards;
|
||||
}
|
||||
|
||||
/* 动态背景动画 */
|
||||
@keyframes gradientShift {
|
||||
0% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
50% {
|
||||
background-position: 100% 50%;
|
||||
}
|
||||
100% {
|
||||
background-position: 0% 50%;
|
||||
}
|
||||
}
|
||||
|
||||
/* 文字呼吸动画 */
|
||||
@keyframes textPulse {
|
||||
0%, 100% {
|
||||
transform: scale(1);
|
||||
text-shadow: 0 0 15px rgba(255, 255, 255, 0.9), 0 0 30px rgba(255, 255, 255, 0.6);
|
||||
}
|
||||
50% {
|
||||
transform: scale(1.1);
|
||||
text-shadow: 0 0 25px rgba(255, 255, 255, 1), 0 0 40px rgba(255, 255, 255, 0.8);
|
||||
}
|
||||
}
|
||||
|
||||
/* 文字淡入动画 */
|
||||
@keyframes fadeInUp {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(50px);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
/* 扩散光圈动画 */
|
||||
@keyframes rippleExpand {
|
||||
to {
|
||||
transform: scale(40);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
`}
|
||||
</style>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default LoadingCover;
|
||||
@@ -12,12 +12,10 @@ import { useEffect, useState } from 'react'
|
||||
* @returns
|
||||
*/
|
||||
export const Logo = props => {
|
||||
const { white, NOTION_CONFIG } = props
|
||||
const { siteInfo, white } = props
|
||||
const router = useRouter()
|
||||
const logoWhite = siteConfig('PROXIO_LOGO_WHITE')
|
||||
const logoNormal = siteConfig('PROXIO_LOGO')
|
||||
|
||||
const { isDarkMode } = useGlobal()
|
||||
const [logo, setLogo] = useState(logoWhite)
|
||||
const [logoTextColor, setLogoTextColor] = useState('text-white')
|
||||
|
||||
useEffect(() => {
|
||||
@@ -29,10 +27,8 @@ export const Logo = props => {
|
||||
const homePageNavBar = router.route === '/' && scrollY < 10 // 在首页并且视窗在页面顶部
|
||||
|
||||
if (white || isDarkMode || homePageNavBar) {
|
||||
setLogo(logoWhite)
|
||||
setLogoTextColor('text-white')
|
||||
} else {
|
||||
setLogo(logoNormal)
|
||||
setLogoTextColor('text-black')
|
||||
}
|
||||
}, throttleMs)
|
||||
@@ -47,18 +43,14 @@ export const Logo = props => {
|
||||
return (
|
||||
<div className='w-60 max-w-full px-4'>
|
||||
<div className='navbar-logo flex items-center w-full py-5 cursor-pointer'>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
{logo && (
|
||||
<LazyImage
|
||||
priority
|
||||
onClick={() => {
|
||||
router.push('/')
|
||||
}}
|
||||
src={logo}
|
||||
alt='logo'
|
||||
className='header-logo mr-1 h-8'
|
||||
/>
|
||||
)}
|
||||
<LazyImage
|
||||
priority
|
||||
src={siteInfo?.icon}
|
||||
width={24}
|
||||
height={20}
|
||||
alt={siteConfig('AUTHOR')}
|
||||
className='mr-2 hidden md:inline-block'
|
||||
/>
|
||||
{/* logo文字 */}
|
||||
<span
|
||||
onClick={() => {
|
||||
|
||||
@@ -2,11 +2,7 @@
|
||||
* 另一个落地页主题
|
||||
*/
|
||||
const CONFIG = {
|
||||
// 默认只展示Logo文字,如果设置了logo图片,会在文字左侧显示图标
|
||||
PROXIO_LOGO: '', // 普通logo图片 示例:/images/starter/logo/logo.svg
|
||||
PROXIO_LOGO_WHITE: '', // 透明底浅色logo 示例: /images/starter/logo/logo-white.svg
|
||||
|
||||
// MENU , 菜单部分不在此处配置,请在Notion数据库中添加MENU
|
||||
PROXIO_WELCOME_TEXT:'欢迎来到此网站,点击任意位置进入', // 欢迎文字,留空则不启用
|
||||
|
||||
// 英雄区块导航
|
||||
PROXIO_HERO_ENABLE: true, // 开启英雄区
|
||||
@@ -205,16 +201,16 @@ const CONFIG = {
|
||||
PROXIO_ABOUT_TEXT_1: '我们的开发者团队',
|
||||
PROXIO_ABOUT_TEXT_2:
|
||||
'NotionNext 由众多开源技术爱好者们共同合作完成,感谢每一位<a className="underline" href="https://github.com/tangly1024/NotionNext/graphs/contributors">贡献者</a>',
|
||||
PROXIO_ABOUT_PHOTO_URL:'',
|
||||
PROXIO_ABOUT_KEY_1:'经验年限',
|
||||
PROXIO_ABOUT_VAL_1:'10年+',
|
||||
PROXIO_ABOUT_KEY_2:'客户',
|
||||
PROXIO_ABOUT_VAL_2:'1000+',
|
||||
PROXIO_ABOUT_KEY_3:'交付项目',
|
||||
PROXIO_ABOUT_VAL_3:'5000+',
|
||||
PROXIO_ABOUT_KEY_4:'累积创作时长(小时)',
|
||||
PROXIO_ABOUT_VAL_4:'10000+',
|
||||
|
||||
PROXIO_ABOUT_PHOTO_URL: '',
|
||||
PROXIO_ABOUT_KEY_1: '经验年限',
|
||||
PROXIO_ABOUT_VAL_1: '10年+',
|
||||
PROXIO_ABOUT_KEY_2: '客户',
|
||||
PROXIO_ABOUT_VAL_2: '1000+',
|
||||
PROXIO_ABOUT_KEY_3: '交付项目',
|
||||
PROXIO_ABOUT_VAL_3: '5000+',
|
||||
PROXIO_ABOUT_KEY_4: '累积创作时长(小时)',
|
||||
PROXIO_ABOUT_VAL_4: '10000+',
|
||||
|
||||
|
||||
// 联系模块
|
||||
PROXIO_CONTACT_ENABLE: true, // 联系模块开关
|
||||
@@ -274,54 +270,43 @@ const CONFIG = {
|
||||
PROXIO_FOOTER_SLOGAN: '我们通过技术为品牌和公司创造数字体验。',
|
||||
|
||||
// 页脚三列菜单组
|
||||
PROXIO_FOOTER_LINK_GROUP: [
|
||||
// 页脚菜单
|
||||
PROXIO_FOOTER_LINKS: [
|
||||
{
|
||||
TITLE: '关于我们',
|
||||
LINK_GROUP: [
|
||||
{ TITLE: '官方主页', URL: '/#home' },
|
||||
{ TITLE: '操作文档', URL: 'https://docs.tangly1024.com/about' },
|
||||
name: '友情链接',
|
||||
menus: [
|
||||
{
|
||||
TITLE: '帮助支持',
|
||||
URL: 'https://docs.tangly1024.com/article/how-to-question'
|
||||
title: 'Tangly的学习笔记',
|
||||
href: 'https://blog.tangly1024.com'
|
||||
},
|
||||
{
|
||||
TITLE: '合作申请',
|
||||
URL: 'https://docs.tangly1024.com/article/my-service'
|
||||
title: 'NotionNext',
|
||||
href: 'https://www.tangly1024.com'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
TITLE: '功能特性',
|
||||
LINK_GROUP: [
|
||||
name: '开发者',
|
||||
menus: [
|
||||
{ title: 'Github', href: 'https://github.com/tangly1024/NotionNext' },
|
||||
{
|
||||
TITLE: '部署指南',
|
||||
URL: 'https://docs.tangly1024.com/article/vercel-deploy-notion-next'
|
||||
title: '开发帮助',
|
||||
href: 'https://docs.tangly1024.com/article/how-to-develop-with-notion-next'
|
||||
},
|
||||
{
|
||||
TITLE: '升级指南',
|
||||
URL: 'https://docs.tangly1024.com/article/how-to-update-notionnext'
|
||||
},
|
||||
{ TITLE: '最新版本', URL: 'https://docs.tangly1024.com/article/latest' }
|
||||
]
|
||||
},
|
||||
{
|
||||
TITLE: 'Notion写作',
|
||||
LINK_GROUP: [
|
||||
{
|
||||
TITLE: 'Notion开始写作',
|
||||
URL: 'https://docs.tangly1024.com/article/start-to-write'
|
||||
title: '功能反馈',
|
||||
href: 'https://github.com/tangly1024/NotionNext/issues/new/choose'
|
||||
},
|
||||
{
|
||||
TITLE: '快捷键提升效率',
|
||||
URL: 'https://docs.tangly1024.com/article/notion-short-key'
|
||||
title: '技术讨论',
|
||||
href: 'https://github.com/tangly1024/NotionNext/discussions'
|
||||
},
|
||||
{
|
||||
TITLE: '中国大陆使用Notion',
|
||||
URL: 'https://docs.tangly1024.com/article/notion-faster'
|
||||
title: '关于作者',
|
||||
href: 'https://blog.tangly1024.com/about'
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
}],
|
||||
|
||||
PROXIO_FOOTER_BLOG_LATEST_TITLE: '最新文章',
|
||||
|
||||
|
||||
@@ -42,6 +42,8 @@ import { SignUpForm } from './components/SignUpForm'
|
||||
import { SVG404 } from './components/svg/SVG404'
|
||||
import Lenis from '@/components/Lenis'
|
||||
import Announcement from './components/Announcement'
|
||||
import CursorDot from '@/components/CursorDot'
|
||||
import LoadingCover from './components/LoadingCover'
|
||||
|
||||
/**
|
||||
* 布局框架
|
||||
@@ -77,9 +79,10 @@ const LayoutBase = props => {
|
||||
{/* 悬浮按钮 */}
|
||||
<BackToTopButton />
|
||||
|
||||
{/* 鼠标阻尼效果 */}
|
||||
{/* 鼠标阻尼动画 */}
|
||||
<Lenis />
|
||||
|
||||
{/* 鼠标跟随动画 */}
|
||||
<CursorDot />
|
||||
{/* <MadeWithButton/> */}
|
||||
</div>
|
||||
)
|
||||
@@ -118,6 +121,7 @@ const LayoutIndex = props => {
|
||||
className={
|
||||
'announncement text-center py-16'
|
||||
}
|
||||
|
||||
/>}
|
||||
|
||||
{/* 团队介绍 */}
|
||||
@@ -128,6 +132,7 @@ const LayoutIndex = props => {
|
||||
|
||||
{/* 产品特性 */}
|
||||
{siteConfig('PROXIO_FEATURE_ENABLE', true, CONFIG) && <Features />}
|
||||
|
||||
{/* 生涯 */}
|
||||
{siteConfig('PROXIO_CAREER_ENABLE', true, CONFIG) && <About />}
|
||||
|
||||
@@ -136,7 +141,6 @@ const LayoutIndex = props => {
|
||||
{/* {siteConfig('PROXIO_PRICING_ENABLE', true, CONFIG) && <Pricing />} */}
|
||||
|
||||
|
||||
|
||||
{/* 评价展示 */}
|
||||
{siteConfig('PROXIO_TESTIMONIALS_ENABLE', true, CONFIG) && (
|
||||
<Testimonials />
|
||||
@@ -147,6 +151,8 @@ const LayoutIndex = props => {
|
||||
|
||||
{/* 行动呼吁 */}
|
||||
{siteConfig('PROXIO_CTA_ENABLE', true, CONFIG) && <CTA />}
|
||||
|
||||
<LoadingCover/>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user