docs: update detailed usage documentation in readme

- update footnotes style
- update theme guides
This commit is contained in:
radishzzz 2025-04-13 23:33:30 +01:00
parent 5f95201576
commit 21d502b8d0
9 changed files with 116 additions and 36 deletions

View file

@ -47,24 +47,34 @@ Retypeset is a static blog theme based on the [Astro](https://astro.build/) fram
<a>
</p>
## Deploy
## Usage
1. Click [`Fork`](https://github.com/radishzzz/astro-theme-retypeset/fork) to clone this repository.
1. [`Fork`](https://github.com/radishzzz/astro-theme-retypeset/fork) this repository, or use this template to create a new repository.
2. Click `Deploy to Netlify` or `Deploy to Vercel` below
2. In your forked repository, click the `Code` button, copy the `HTTPS` repository URL, and run the following commands in your terminal:
&emsp;[![Deploy to Netlify](assets/deploy-netlify.svg)](https://app.netlify.com/start)
[![Deploy to Vercel](assets/deploy-vercel.svg)](https://vercel.com/new)
```bash
# Clone the remote repository to your local machine
git clone <repository-url>
3. Select the repository and click `Deploy`.
# Navigate to the repository directory
cd <repository-name>
For other platforms, please refer to the [Astro Deployment Guides](https://docs.astro.build/en/guides/deploy/).
# Install pnpm globally (if not already installed)
npm install -g pnpm
## Updates
# Install project dependencies
pnpm install
1. Follow the [GitHub Docs](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork) to run `Sync fork`.
# Start the local development server
pnpm dev
```
2. Do not click `Discard Changes`.
3. Open [http://localhost:4321/](http://localhost:4321/) in your browser to preview the theme in real-time.
4. Modify the theme configuration file [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) to customize your blog.
5. Commit and push your changes to the remote repository.
## Documentation
@ -72,6 +82,34 @@ For other platforms, please refer to the [Astro Deployment Guides](https://docs.
- [Markdown Style Guide](https://retypeset.radishzz.cc/en/posts/markdown-style-guide/)
- [Theme Color Schemes](https://retypeset.radishzz.cc/en/posts/theme-color-schemes/)
## Deploy
1. Click `Deploy to Netlify` or `Deploy to Vercel` below.
[![Deploy to Netlify](assets/deploy-netlify.svg)](https://app.netlify.com/start)
[![Deploy to Vercel](assets/deploy-vercel.svg)](https://vercel.com/new)
1. Follow the instructions, select your repository, and click `Deploy` to start deployment.
2. For other platforms, please refer to the [Astro Deployment Guides](https://docs.astro.build/en/guides/deploy/).
## Updates
Retypeset releases new features and bug fixes from time to time. You can refer to the [GitHub Docs](https://docs.github.com/en/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork) to run `Sync fork` in your forked repository to synchronize with the latest branch. Be careful not to click `Discard Changes`, or you will lose your modifications.
## Commands
All commands are run from the root of the project, from a terminal:
| Command | Action |
| :--------------------- | :----------------------------------------------- |
| `pnpm install` | Install project dependencies |
| `pnpm dev` | Starts local dev server at `localhost:4321` |
| `pnpm build` | Build your production site to `./dist/` |
| `pnpm preview` | Preview your build locally, before deploying |
| `pnpm astro ...` | Run CLI commands like `astro add`, `astro check` |
| `pnpm astro -- --help` | Get help using the Astro CLI |
## Credits
- [Typography](https://github.com/moeyua/astro-theme-typography)
@ -83,6 +121,8 @@ For other platforms, please refer to the [Astro Deployment Guides](https://docs.
## Star History
Thank you to everyone who has starred this project. Your support motivates me to keep maintaining it!
<p align="center">
<a href="https://star-history.com/#radishzzz/astro-theme-retypeset&Date">
<picture>

View file

@ -47,24 +47,34 @@ Retypeset 是一款基于 [Astro](https://astro.build/) 框架的静态博客主
<a>
</p>
## 部署
## 用法
1. 点击 [`Fork`](https://github.com/radishzzz/astro-theme-retypeset/fork) 克隆本仓库。
1. 点击 [`Fork`](https://github.com/radishzzz/astro-theme-retypeset/fork) 复刻此仓库,或使用此模版创建新仓库。
2. 点击下方 `Deploy to Netlify``Deploy to Vercel`
2. 在复刻仓库中点击 `Code` 按钮,复制 `HTTPS` 仓库地址,并在终端中执行:
&emsp;[![Deploy to Netlify](assets/deploy-netlify.svg)](https://app.netlify.com/start)
[![Deploy to Vercel](assets/deploy-vercel.svg)](https://vercel.com/new)
```bash
# 克隆远程仓库至本地
git clone <仓库地址>
3. 选择对应仓库,点击 `Deploy` 即可。
# 进入本地仓库根目录
cd <仓库名称>
其它平台请参考 [Astro 部署指南](https://docs.astro.build/zh-cn/guides/deploy/)。
# 全局安装 pnpm若未安装
npm install -g pnpm
## 更新
# 安装项目依赖
pnpm install
1. 参考 [GitHub 文档](https://docs.github.com/zh/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork) 在克隆仓库中执行 `Sync fork` 同步最新分支。
# 启动本地开发服务器
pnpm dev
```
2. 不要点击 `Discard Changes` 放弃你的更改。
3. 在浏览器中打开 [http://localhost:4321/](http://localhost:4321/),即可实时预览主题效果。
4. 修改主题配置文件 [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) 来自定义你的博客。
5. 提交并推送你的修改至远程仓库。
## 文档
@ -72,6 +82,34 @@ Retypeset 是一款基于 [Astro](https://astro.build/) 框架的静态博客主
- [Markdown 样式指南](https://retypeset.radishzz.cc/posts/markdown-style-guide/)
- [主题配色指南](https://retypeset.radishzz.cc/posts/theme-color-schemes/)
## 部署
1. 点击下方 `Deploy to Netlify``Deploy to Vercel`
[![Deploy to Netlify](assets/deploy-netlify.svg)](https://app.netlify.com/start)
[![Deploy to Vercel](assets/deploy-vercel.svg)](https://vercel.com/new)
1. 跟随指示,选择对应仓库,再点击 `Deploy` 即可开始部署。
2. 其它平台请参考 [Astro 部署指南](https://docs.astro.build/zh-cn/guides/deploy/)。
## 更新
Retypeset 会不定期发布新功能和问题修复。你可以参考 [GitHub 文档](https://docs.github.com/zh/pull-requests/collaborating-with-pull-requests/working-with-forks/syncing-a-fork),在复刻仓库中执行 `Sync fork` 同步最新分支。注意不要点击 `Discard Changes`,否则会丢失你的更改。
## 指令
以下指令均需要在项目根目录执行:
| 指令 | 作用 |
| :--------------------- | :------------------------------------- |
| `pnpm install` | 安装项目依赖 |
| `pnpm dev` | 在 `localhost:4321` 启动本地开发服务器 |
| `pnpm build` | 构建网站至 `./dist/` |
| `pnpm preview` | 本地预览已构建的网站 |
| `pnpm astro ...` | 执行 `astro add`, `astro check` 等命令 |
| `pnpm astro -- --help` | 获取 Astro CLI 帮助信息 |
## 鸣谢
- [Typography](https://github.com/moeyua/astro-theme-typography)
@ -83,6 +121,8 @@ Retypeset 是一款基于 [Astro](https://astro.build/) 框架的静态博客主
## Star History
谢谢每一位 star 的朋友,你们的支持是我持续维护项目的动力!
<p align="center">
<a href="https://star-history.com/#radishzzz/astro-theme-retypeset&Date">
<picture>

View file

@ -14,7 +14,7 @@ Retypeset is a static blog theme based on the [Astro](https://astro.build/) fram
## Theme Configuration
Customize your blog by modifying the theme configuration file [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts).
Modify the theme configuration file [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) to customize your blog.
### Site Information
@ -352,7 +352,7 @@ getImageOptions: (_path, page) => ({
RSS feed page styles.
```html
<!-- public/rss-style.xsl -->
<!-- public/rss/rss-style.xsl -->
<style type="text/css">
body{color:oklch(25% 0.005 298)} /* font color */

View file

@ -14,7 +14,7 @@ Retypeset es un tema de blog estático basado en el framework [Astro](https://as
## Configuración del Tema
Personaliza tu blog modificando el archivo de configuración del tema [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts).
Modifica el archivo de configuración del tema [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) para personalizar tu blog.
### Información del Sitio
@ -352,7 +352,7 @@ getImageOptions: (_path, page) => ({
Estilos de página del feed RSS.
```html
<!-- public/rss-style.xsl -->
<!-- public/rss/rss-style.xsl -->
<style type="text/css">
body{color:oklch(25% 0.005 298)} /* color de fuente */

View file

@ -352,7 +352,7 @@ getImageOptions: (_path, page) => ({
RSSフィードページスタイル。
```html
<!-- public/rss-style.xsl -->
<!-- public/rss/rss-style.xsl -->
<style type="text/css">
body{color:oklch(25% 0.005 298)} /* フォントカラー */

View file

@ -352,7 +352,7 @@ getImageOptions: (_path, page) => ({
Стили страницы RSS-ленты.
```html
<!-- public/rss-style.xsl -->
<!-- public/rss/rss-style.xsl -->
<style type="text/css">
body{color:oklch(25% 0.005 298)} /* цвет шрифта */

View file

@ -14,7 +14,7 @@ Retypeset 是一款基於 [Astro](https://astro.build/) 框架的靜態部落格
## 主題配置
通過修改主題配置文件 [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) 來自定義你的部落格。
修改主題配置文件 [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) 來自定義你的部落格。
### 站點信息
@ -352,7 +352,7 @@ getImageOptions: (_path, page) => ({
RSS 訂閱頁配色。
```html
<!-- public/rss-style.xsl -->
<!-- public/rss/rss-style.xsl -->
<style type="text/css">
body{color:oklch(25% 0.005 298)} /* 字體顏色 */

View file

@ -14,7 +14,7 @@ Retypeset 是一款基于 [Astro](https://astro.build/) 框架的静态博客主
## 主题配置
通过修改主题配置文件 [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) 来自定义你的博客。
修改主题配置文件 [src/config.ts](https://github.com/radishzzz/astro-theme-retypeset/blob/master/src/config.ts) 来自定义你的博客。
### 站点信息
@ -352,7 +352,7 @@ getImageOptions: (_path, page) => ({
RSS 订阅页配色。
```html
<!-- public/rss-style.xsl -->
<!-- public/rss/rss-style.xsl -->
<style type="text/css">
body{color:oklch(25% 0.005 298)} /* 字体颜色 */

View file

@ -221,27 +221,27 @@ html.dark .heti :where(mark) {
}
.footnotes:lang(zh-CN)::before {
content: "脚注";
--at-apply: 'block text-5 font-semibold mt-6 mb-3';
--at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
}
.footnotes:lang(zh-TW)::before {
content: "腳註";
--at-apply: 'block text-5 font-semibold mt-6 mb-3';
--at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
}
.footnotes:lang(ja)::before {
content: "脚注";
--at-apply: 'block text-5 font-semibold mt-6 mb-3';
--at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
}
.footnotes:lang(en)::before {
content: "Footnotes";
--at-apply: 'block text-5 font-semibold mt-6 mb-3';
--at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
}
.footnotes:lang(es)::before {
content: "Notas al pie";
--at-apply: 'block text-5 font-semibold mt-6 mb-3';
--at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
}
.footnotes:lang(ru)::before {
content: "Сноски";
--at-apply: 'block text-5 font-semibold mt-6 mb-3';
--at-apply: 'block text-6 font-semibold mt-7.4 mb-4.2';
}
.heti :where(.data-footnote-backref) {
--at-apply: 'no-underline';