mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-14 15:09:22 +00:00
增加衬线和无衬线字体配置
This commit is contained in:
@@ -22,7 +22,8 @@ const BLOG = {
|
||||
CONTACT_TELEGRAM: 'https://t.me/tangly_1024', // 你的telegram 地址 例如 https://t.me/tangly_1024
|
||||
CONTACT_LINKEDIN: '', // 你的linkedIn 首页
|
||||
|
||||
// 网站默认使用PingFangSC及NotoSansSC,
|
||||
// 网站默认使用PingFangSC及NotoSansSC
|
||||
FONT_STYLE: 'font-serif', // ['font-serif','font-sans'] 两种可选,分别是衬线和无衬线: 参考 https://www.jianshu.com/p/55e410bd2115
|
||||
// 如需自定义字体,请将CUSTOM_FONT改为 true,并将CUSTOM_FONT_URL改为你的字体CSS地址,同时在CUSTOM_FONT_SANS与CUSTOM_FONT_SERIF中指定你的font-family
|
||||
CUSTOM_FONT: process.env.NEXT_PUBLIC_CUSTOM_FONT || false, // 是否使用自定义字体
|
||||
// 自定义字体示例: 请先将 CUSTOM_FONT 改为 true, 并将 CUSTOM_FONT_URL 改为你的字体CSS地址,同时在 CUSTOM_FONT_SANS 与 CUSTOM_FONT_SERIF 中指定你的 fontfamily
|
||||
|
||||
@@ -17,7 +17,7 @@ class MyDocument extends Document {
|
||||
<CommonScript />
|
||||
</Head>
|
||||
|
||||
<body className={'tracking-wider subpixel-antialiased bg-day dark:bg-night'}>
|
||||
<body className={`${BLOG.FONT_STYLE} tracking-wider bg-day dark:bg-night`}>
|
||||
<Main />
|
||||
<NextScript />
|
||||
</body>
|
||||
|
||||
@@ -5,7 +5,7 @@ import BLOG from '@/blog.config'
|
||||
|
||||
export const LayoutCategory = props => {
|
||||
const { category } = props
|
||||
const slotTop = <div className='flex items-center font-sans py-8'><div className='text-xl'><i className='mr-2 fas fa-th' />分类:</div>{category}</div>
|
||||
const slotTop = <div className='flex items-center py-8'><div className='text-xl'><i className='mr-2 fas fa-th' />分类:</div>{category}</div>
|
||||
|
||||
return <LayoutBase {...props} slotTop={slotTop}>
|
||||
{BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
|
||||
|
||||
@@ -43,10 +43,10 @@ export const LayoutSlug = props => {
|
||||
{!lock && <div id='container'>
|
||||
|
||||
{/* title */}
|
||||
<h1 className="text-3xl pt-12 font-sans dark:text-gray-300">{post?.title}</h1>
|
||||
<h1 className="text-3xl pt-12 dark:text-gray-300">{post?.title}</h1>
|
||||
|
||||
{/* meta */}
|
||||
<section className="py-2 items-center text-sm font-sans px-1">
|
||||
<section className="py-2 items-center text-sm px-1">
|
||||
<div className='flex flex-wrap text-gray-500 py-1 dark:text-gray-600'>
|
||||
<span className='whitespace-nowrap'> <i className='far fa-calendar mr-2' />{date}</span>
|
||||
<span className='mx-1'>|</span>
|
||||
|
||||
@@ -5,7 +5,7 @@ import BlogPostListPage from './components/BlogPostListPage'
|
||||
|
||||
export const LayoutTag = (props) => {
|
||||
const { tag } = props
|
||||
const slotTop = <div className='flex items-center font-sans py-8'><div className='text-xl'><i className='mr-2 fas fa-tag'/>标签:</div>{tag}</div>
|
||||
const slotTop = <div className='flex items-center py-8'><div className='text-xl'><i className='mr-2 fas fa-tag'/>标签:</div>{tag}</div>
|
||||
|
||||
return <LayoutBase {...props} slotTop={slotTop}>
|
||||
{BLOG.POST_LIST_STYLE === 'page' ? <BlogPostListPage {...props} /> : <BlogPostListScroll {...props} />}
|
||||
|
||||
@@ -22,7 +22,7 @@ export const ArticleLock = props => {
|
||||
}
|
||||
}
|
||||
|
||||
return <div id='container' className='w-full flex justify-center items-center h-96 font-sans'>
|
||||
return <div id='container' className='w-full flex justify-center items-center h-96 '>
|
||||
<div className='text-center space-y-3'>
|
||||
<div className='font-bold'>{locale.COMMON.ARTICLE_LOCK_TIPS}</div>
|
||||
<div className='flex mx-4'>
|
||||
|
||||
@@ -20,7 +20,7 @@ const BlogPostCard = ({ post, showSummary }) => {
|
||||
href={`${BLOG.SUB_PATH}/${post.slug}`}
|
||||
passHref
|
||||
className={
|
||||
'cursor-pointer font-bold font-sans hover:underline text-3xl leading-tight text-gray-700 dark:text-gray-300 hover:text-green-500 dark:hover:text-green-400'
|
||||
'cursor-pointer font-bold hover:underline text-3xl leading-tight text-gray-700 dark:text-gray-300 hover:text-green-500 dark:hover:text-green-400'
|
||||
}>
|
||||
|
||||
{post.title}
|
||||
|
||||
@@ -65,7 +65,7 @@ const Catalog = ({ toc }) => {
|
||||
<Progress />
|
||||
</div>
|
||||
<div className='overflow-y-auto max-h-96 overscroll-none scroll-hidden' ref={tRef}>
|
||||
<nav className='h-full font-sans text-black'>
|
||||
<nav className='h-full text-black'>
|
||||
{toc.map((tocItem) => {
|
||||
const id = uuidToId(tocItem.id)
|
||||
tocIds.push(id)
|
||||
|
||||
@@ -21,7 +21,7 @@ function GroupMenu ({ customNav }) {
|
||||
}
|
||||
|
||||
return (
|
||||
<nav id='nav' className='font-sans text-md'>
|
||||
<nav id='nav' className=' text-md'>
|
||||
{links.map(link => {
|
||||
if (link.show) {
|
||||
const selected = (router.pathname === link.to) || (router.asPath === link.to)
|
||||
|
||||
@@ -6,7 +6,7 @@ import SocialButton from './SocialButton'
|
||||
const InfoCard = (props) => {
|
||||
const { siteInfo } = props
|
||||
return <div id='info-card' className='py-4'>
|
||||
<div className='items-center justify-center font-sans '>
|
||||
<div className='items-center justify-center '>
|
||||
<div className='hover:scale-105 transform duration-200 cursor-pointer flex justify-center' onClick={ () => { Router.push('/about') }}>
|
||||
{/* eslint-disable-next-line @next/next/no-img-element */}
|
||||
<img src={siteInfo?.icon} className='rounded-full' width={120} alt={BLOG.AUTHOR}/>
|
||||
|
||||
@@ -3,7 +3,7 @@ import Link from 'next/link'
|
||||
export default function LogoBar (props) {
|
||||
const { siteInfo } = props
|
||||
return (
|
||||
<div id='top-wrapper' className='w-full flex items-center font-sans'>
|
||||
<div id='top-wrapper' className='w-full flex items-center '>
|
||||
<Link href='/' className='text-md md:text-xl dark:text-gray-200'>
|
||||
{siteInfo?.title}
|
||||
</Link>
|
||||
|
||||
@@ -28,7 +28,7 @@ const Progress = ({ targetRef, showPercent = true }) => {
|
||||
}, [percent])
|
||||
|
||||
return (
|
||||
<div className="h-4 w-full shadow-2xl bg-hexo-light-gray dark:bg-hexo-black-gray font-sans">
|
||||
<div className="h-4 w-full shadow-2xl bg-hexo-light-gray dark:bg-hexo-black-gray ">
|
||||
<div
|
||||
className="h-4 bg-gray-600 duration-200"
|
||||
style={{ width: `${percent}%` }}
|
||||
|
||||
Reference in New Issue
Block a user