mirror of
https://github.com/d0zingcat/NotionNext.git
synced 2026-05-15 23:16:48 +00:00
部署 tangly1024
This commit is contained in:
tangly
@@ -26,15 +26,15 @@ const BLOG = {
|
||||
APPEARANCE: 'light', // ['light', 'dark', 'auto'], // light 日间模式 ， dark夜间模式， auto根据时间和主题自动夜间模式
|
||||
|
||||
// 字体相关
|
||||
// FONT: 'font-sans', // 预设三种文章字体 ['font-sans', 'font-serif', 'font-mono'] @see /lib/font.js https://www.tailwindcss.cn/docs/font-family
|
||||
// FONT_URL: 'https://fonts.font.im/css2?family=Noto+Serif+SC&display=swap', // 谷歌字体中国站镜像;对应的国际站地址：https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap
|
||||
// FONT_CUSTOM: ['-apple-system', 'BlinkMacSystemFont', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"', '"Segoe UI"', '"PingFang SC"', 'HarmonyOS_Regular', '"Hiragino Sans GB"', '"Microsoft YaHei"', '"Helvetica Neue"', 'Helvetica', '"Source Han Sans SC"', '"Noto Sans CJK SC"', '"WenQuanYi Micro Hei"', 'Arial', 'sans-serif'],
|
||||
// FONT: 'font-sans', // 预设三种文章字体 ['font-sans', 'font-serif', 'font-mono'] @see /lib/font.js https://www.tailwindcss.cn/docs/font-family
|
||||
// FONT_URL: 'https://fonts.font.im/css2?family=Noto+Serif+SC&display=swap', // 谷歌字体中国站镜像;对应的国际站地址：https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap
|
||||
// FONT_CUSTOM: ['-apple-system', 'BlinkMacSystemFont', '"Apple Color Emoji"', '"Segoe UI Emoji"', '"Segoe UI Symbol"', '"Segoe UI"', '"PingFang SC"', 'HarmonyOS_Regular', '"Hiragino Sans GB"', '"Microsoft YaHei"', '"Helvetica Neue"', 'Helvetica', '"Source Han Sans SC"', '"Noto Sans CJK SC"', '"WenQuanYi Micro Hei"', 'Arial', 'sans-serif'],
|
||||
|
||||
// 自定义google字体示例： 请先将FONT 改为 'font-custom'， 并将FONT_URL改为你的字体地址，同时在FONT_CUSTOM中指定你的 fontfamily
|
||||
// 以下是示例：
|
||||
FONT: 'font-custom',
|
||||
FONT_URL: 'https://fonts.font.im/css2?family=Ma+Shan+Zheng&display=swap',
|
||||
FONT_CUSTOM_FAMILY: ['"Times New Roman"', 'Ma Shan Zheng'],
|
||||
FONT_CUSTOM_FAMILY: ['"Times New Roman"', '"Ma Shan Zheng"'],
|
||||
|
||||
// 图标字体
|
||||
FONT_AWESOME_PATH: 'https://cdn.bootcdn.net/ajax/libs/font-awesome/5.15.4/css/all.min.css', // 图标库CDN ，国内推荐BootCDN，国外推荐 CloudFlare https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css
|
||||
|
||||
17
components/TailwindCustomCssInit.js
Normal file
17
components/TailwindCustomCssInit.js
Normal file
@@ -0,0 +1,17 @@
|
||||
import React from 'react'
|
||||
|
||||
/**
|
||||
* TailwindCss中自定义扩展了font-custom 这个扩展fontFamily，但页面中没有实际用到，会导致编译时被忽略。
|
||||
* 为了确保blog.config.js中配置使用 font-custom字体能生效，在此写入一个font-custom样式，页面中无实际作用，用effect勾子删除即可
|
||||
* @returns
|
||||
*/
|
||||
const TailwindCustomCssInit = () => {
|
||||
const cssInitRef = React.useRef(null)
|
||||
|
||||
React.useEffect(() => {
|
||||
cssInitRef?.current?.remove()
|
||||
})
|
||||
return <div ref={cssInitRef} className='font-custom'></div>
|
||||
}
|
||||
|
||||
export default TailwindCustomCssInit
|
||||
@@ -19,6 +19,7 @@ import { GlobalContextProvider } from '@/lib/global'
|
||||
import { DebugPanel } from '@/components/DebugPanel'
|
||||
import { ThemeSwitch } from '@/components/ThemeSwitch'
|
||||
import { Fireworks } from '@/components/Fireworks'
|
||||
import TailwindCustomCssInit from '@/components/TailwindCustomCssInit'
|
||||
|
||||
const Ackee = dynamic(() => import('@/components/Ackee'), { ssr: false })
|
||||
const Gtag = dynamic(() => import('@/components/Gtag'), { ssr: false })
|
||||
@@ -33,6 +34,7 @@ const Messenger = dynamic(() => import('@/components/FacebookMessenger'), {
|
||||
const MyApp = ({ Component, pageProps }) => {
|
||||
// 外部插件
|
||||
const externalPlugins = <>
|
||||
<TailwindCustomCssInit/>
|
||||
{JSON.parse(BLOG.THEME_SWITCH) && <ThemeSwitch />}
|
||||
{JSON.parse(BLOG.DEBUG) && <DebugPanel />}
|
||||
{BLOG.ANALYTICS_ACKEE_TRACKER && <Ackee />}
|
||||
|
||||
@@ -101,71 +101,74 @@ nav {
|
||||
}
|
||||
}
|
||||
|
||||
.shadow-card{
|
||||
box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
|
||||
.shadow-card {
|
||||
box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px,
|
||||
rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px,
|
||||
rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
|
||||
}
|
||||
|
||||
.gt-meta{
|
||||
@apply dark:text-gray-300
|
||||
.gt-meta {
|
||||
@apply dark:text-gray-300;
|
||||
}
|
||||
|
||||
#waifu {
|
||||
@apply right-auto left-0 hidden lg:block z-10 !important
|
||||
@apply right-auto left-0 hidden lg:block z-10 !important;
|
||||
}
|
||||
|
||||
/* 隐藏滚动条 */
|
||||
.scroll-hidden{
|
||||
.scroll-hidden {
|
||||
-ms-overflow-style: none;
|
||||
overflow: -moz-scrollbars-none;
|
||||
scrollbar-width: none; /* firefox */
|
||||
}
|
||||
|
||||
.scroll-hidden::-webkit-scrollbar { width: 0 !important }
|
||||
|
||||
.notion-collection{
|
||||
@apply max-w-0
|
||||
.scroll-hidden::-webkit-scrollbar {
|
||||
width: 0 !important;
|
||||
}
|
||||
|
||||
.notion-collection {
|
||||
@apply max-w-0;
|
||||
}
|
||||
|
||||
.glassmorphism{
|
||||
background: hsla(0, 0%, 100%, .05);
|
||||
.glassmorphism {
|
||||
background: hsla(0, 0%, 100%, 0.05);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.dark .glassmorphism{
|
||||
background: rgba(31, 41, 55, .75);
|
||||
.dark .glassmorphism {
|
||||
background: rgba(31, 41, 55, 0.75);
|
||||
-webkit-backdrop-filter: blur(10px);
|
||||
backdrop-filter: blur(10px);
|
||||
}
|
||||
|
||||
.medium-zoom-overlay{
|
||||
.medium-zoom-overlay {
|
||||
background: none !important;
|
||||
/* background: rgba(0, 0, 0, 0.01) none repeat scroll 0% 0% !important; */
|
||||
}
|
||||
|
||||
.shadow-text{
|
||||
.shadow-text {
|
||||
text-shadow: 0.1em 0.1em 0.2em black;
|
||||
}
|
||||
|
||||
.notion-code-copy-button > svg{
|
||||
pointer-events:none
|
||||
.notion-code-copy-button > svg {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.fireworks{
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
pointer-events: none;
|
||||
.fireworks {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
[data-waline] p {
|
||||
color: var(--waline-color);
|
||||
@apply dark:text-gray-200 !important
|
||||
@apply dark:text-gray-200 !important;
|
||||
}
|
||||
|
||||
.waline-recent-content p{
|
||||
.waline-recent-content p {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
@@ -177,5 +180,5 @@ nav {
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
height: 1.25em;
|
||||
margin: -.125em .25em;
|
||||
}
|
||||
margin: -0.125em 0.25em;
|
||||
}
|
||||
|
||||
@@ -20,7 +20,7 @@ const BlogPostCard = ({ post, showSummary }) => {
|
||||
<div className="lg:p-8 p-4 flex flex-col w-full">
|
||||
<Link href={`${BLOG.SUB_PATH}/${post.slug}`} passHref>
|
||||
<a
|
||||
className={`cursor-pointer font-bold hover:underline text-3xl ${showPreview ? 'text-center' : ''
|
||||
className={`cursor-pointer hover:underline text-3xl ${showPreview ? 'text-center' : ''
|
||||
} leading-tight text-gray-700 dark:text-gray-100 hover:text-blue-500 dark:hover:text-blue-400`}
|
||||
>
|
||||
{post.title}
|
||||
|
||||
Reference in New Issue
Block a user