Merge pull request #123 from tangly1024/preview

文档

CONTRIBUTING.md

@@ -0,0 +1,52 @@
+# Contributing
+
+- [Setup](#setup)
+- [Creating new themes](#creating-new-themes)
+- [Adding localizations](#adding-localizations)
+
+Thanks for considering to contribute!
+
+## Setup
+
+To contribute to NotionNext, follow these steps:
+
+1. [Fork][fork] the repository to your GitHub account.
+2. Clone the repository to your device (or use something like Codespaces).
+3. Create a new branch in the repository.
+4. Make your modifications.
+5. Commit your modifications and push the branch.
+6. [Create a PR][pr] from the branch in your fork to NotionNext' `main` branch.
+
+This project is built with [Next.js][next.js] and `yarn` as the package manager.
+Here are some commands that you can use:
+
+- `yarn`: install dependencies
+- `yarn dev`: compile and hot-reload for development
+- `yarn build`: compile and minify for production
+- `yarn start`: serve the compiled build in production mode
+
+## Creating new themes
+
+If you want to submit your custom theme to NotionNext, copy a new folder in
+[`themes`][themes-dir] from [`example`][example]. The folder name  will be the
+theme's key. 
+
+## Adding localizations
+
+If your language is not yet supported by NotionNext, please contribute a
+localization! Follow these steps to add a new localization:
+
+1. Copy one of the [en-US.js][en-US.js] in [lang-dir][lang-dir] and rename the new
+   directory into your language's code ( e.g. `zh-CN.js`).
+2. Start translating the strings.
+3. Add your language config to [lang.js][lang.js]. 
+4. [Create a PR][pr] with your localization updates.
+
+[fork]: https://github.com/tangly1024/NotionNext/fork
+[pr]: https://github.com/tangly1024/NotionNext/compare
+[next.js]: https://github.com/vercel/next.js
+[themes-dir]: themes
+[example]: themes/example
+[lang-dir]: lib/lang
+[en-US.js]: lib/lang/en-US.js
+[lang.js]: lib/lang.js

README.md

@@ -50,12 +50,9 @@
 |--|--|--|--|
 | <img src='./docs/theme-next.png' width='300'/> [预览NEXT](https://preview.tangly1024.com/?theme=next)  | <img src='./docs/theme-medium.png' width='300'/> [预览MEDIUM](https://preview.tangly1024.com/?theme=medium) | <img src='./docs/theme-hexo.png' width='300'/> [预览HEXO](https://preview.tangly1024.com/?theme=hexo) | <img src='./docs/theme-fukasawa.png' width='300'/> [预览FUKASAWA](https://preview.tangly1024.com/?theme=fukasawa) |
 
+*只需修改`blog.config.js`文件的`THEME`即可实现主题切换。* 没找到喜欢的主题？[贡献](/CONTRIBUTING.md)一个吧~
 
 
-*只需修改`blog.config.js`文件的`THEME`即可实现主题切换。*
-
-## 更新日志
-请移步 [更新文档](https://docs.tangly1024.com/zh/changelog)查看
 
 ## 快速起步
 
@@ -80,11 +77,15 @@ yarn run start # 本地启动NextJS服务
 
 ## 引用技术
 
-- **框架**: Next.js
+- **框架**: [Next.js](https://nextjs.org)
 - **样式**: [Tailwind CSS](https://www.tailwindcss.cn/) 和 `@tailwindcss/jit` compiler
 - **渲染**: [React-notion-x](https://github.com/NotionX/react-notion-x)
-- **评论**: Gitalk, Cusdis, Utterances
-- **图标**：[fontawesome](https://fontawesome.com/v5.15/icons?d=gallery)
+- **评论**: [Giscus](https://giscus.app/zh-CN), [Gitalk](https://gitalk.github.io), [Cusdis](https://gitalk.github.io), [Utterances](https://utteranc.es)
+- **图标**：[fontawesome v5.15](https://fontawesome.com/v5.15/icons?d=gallery)
+
+## 更新日志
+请移步 [更新文档](https://docs.tangly1024.com/zh/changelog)查看
+
 
 ## 致谢
 感谢Craig Hart发起的Nobelium项目
@@ -92,13 +93,16 @@ yarn run start # 本地启动NextJS服务
   <td align="center"><a href="https://github.com/craigary" title="Craig Hart"><img src="https://avatars.githubusercontent.com/u/10571717" width="64px;"alt="Craig Hart"/></a><br/><a href="https://notion.so/cnotion" title="Craig Hart">Craig Hart</a></td>
 </tr></table>
 
-## Contributors
+## 贡献者
 
 <table><tr align="left">
   <td align="center"><a href="https://github.com/tangly1024"><img src="https://avatars.githubusercontent.com/u/15920488" width="64px;"alt="tangly1024"/><br/><sub><b>tangly1024</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=tangly1024" title="Owner" >🎫 🔧 🎨 🐛</a></td>
   <td align="center"><a href="https://github.com/uWayLu"><img src="https://avatars.githubusercontent.com/u/21689326" width="64px;" alt="uWayLu"/><br/><sub><b>uWayLu</b></sub></a><br/><a href="https://github.com/tangly1024/NotionNext/commits?author=uWayLu" title="yokinist" >🔧 🐛</a></td>
 </tr></table>
 
+十分期待你的[贡献](/CONTRIBUTING.md)，一起来完善这个项目~
+
+
 ## License
 
 The MIT License.

components/DebugPanel.js

@@ -2,7 +2,7 @@ import BLOG from '@/blog.config'
 import * as ThemeMap from '@/themes'
 import { useState } from 'react'
 import Select from './Select'
-import { ALL_THEME } from '@/lib/theme'
+import { ALL_THEME } from '@/themes'
 import { useGlobal } from '@/lib/global'
 /**
  *

lib/global.js

@@ -2,7 +2,8 @@ import { generateLocaleDict, initLocale } from './lang'
 import { createContext, useContext, useEffect, useState } from 'react'
 import Router from 'next/router'
 import BLOG from '@/blog.config'
-import { ALL_THEME, initDarkMode, initTheme, saveThemeToCookies } from '@/lib/theme'
+import { initDarkMode, initTheme, saveThemeToCookies } from '@/lib/theme'
+import { ALL_THEME } from '@/themes'
 
 const GlobalContext = createContext()
 let hasInit = false

lib/theme.js

@@ -1,7 +1,6 @@
 import cookie from 'react-cookies'
 import BLOG from '@/blog.config'
 
-export const ALL_THEME = ['hexo', 'next', 'medium', 'fukasawa', 'empty']
 /**
  * 初始化主题
  * @param isDarkMode

themes/index.js

@@ -5,11 +5,7 @@ import * as next from './next'
 import * as fukasawa from './fukasawa'
 import * as hexo from './hexo'
 import * as medium from './medium'
-import * as empty from './empty'
-export {
-  next,
-  fukasawa,
-  hexo,
-  medium,
-  empty
-}
+import * as example from './example'
+
+export const ALL_THEME = ['hexo', 'next', 'medium', 'fukasawa', 'example']
+export { hexo, next, medium, fukasawa, example }