跳到主要内容

参与本项目

本网站使用 Docusaurus 构建。

本项目使用 GPL-v3.0 协议在 GitHub 开源，请遵守开源协议。

GPLv3 协议的非正式简体中文翻译

TODO​

  • 新贡献者入门指引
  • 一个新站点 LOGO （把班徽换下来）
  • 网络安全板块
    • 目录
  • 运维板块

邮件投稿​

可以直接将编写好的文档发送到 Yue_plus@foxmail.com， 由其他项目贡献者整理后上传到本网站。

邮件投稿的文档同样使用 GPL-v3.0 协议开源。

为方便筛选邮件，建议使用以下标题格式：

【悦域江职】[(docs/<path>)/blog] 备注

为方便其他项目贡献者整理编辑，建议使用以下文件格式：

  • 文本：.txt, .md, .docx, .html, .pdf, ...
  • 图片：.jpg, .png, .webp, ...
  • 多媒体文件请提供原文件附件

本地部署​

TODO: 简要说明：Git/GitHub 使用方法；NodeJS 使用方法；Docusaurus；PR 发起规范；…… Orz

排版规范​

使用数学公式​

Docusaurus 使用 KaTeX 显示数学公式： 数学公式 | Docusaurus

所有支持函数可参考 Supported Functions · KaTeX

使用图表​

Docusaurus 使用 Mermaid 显示图表：Diagrams | Docusaurus

详细使用方法请参考： 官方文档 | 中文文档 | 在线编辑器

使用内部组件​

贡献者​

import { ContributorsList, Contributor } from '@site/src/components/ContributorsList';

单个贡献者​

实时编辑器
<Contributor name="Yue_plus" href="https://github.com/Yue-plus" avatar="/contributors/Yue_plus.png" />
结果
Loading...

所有贡献者​

实时编辑器
<ContributorsList />
结果
Loading...

修改贡献者列表​

  1. 修改 \src\components\ContributorsList\index.tsx 文件。
  2. 头像文件保存在 \static\contributors 目录下，使用 .png 格式，分辨率建议不超过 512*512。
  3. 头像文件名和贡献者 name 属性一致时可以省略 avatar 属性。

颜色块​

试试修改 value 和 name 值？

实时编辑器
// import Color from '@site/src/components/Color';

<>
  <Color value="#00b1ff" />
  <Color value="rgb(0, 64, 191)" name="蓝色" />
  <Color value="linear-gradient(to bottom right, blue, pink)" name="渐变色" />
  <Color value="radial-gradient(red 10px, yellow 30%, #1e90ff 50%)" name="径向渐变" />
  <Color value={`
    linear-gradient(217deg, rgba(255, 0, 0, 0.8), rgba(255, 0, 0, 0) 70.71%),
    linear-gradient(127deg, rgba(0, 255, 0, 0.8), rgba(0, 255, 0, 0) 70.71%),
    linear-gradient(336deg, rgba(0, 0, 255, 0.8), rgba(0, 0, 255, 0) 70.71%)
  `} name="堆叠梯度渐变" />
</>
结果
Loading...

参考： 使用 CSS 渐变 - 层叠样式表 | background - 层叠样式表

隐藏文本​

前景色和背景色都是黑色的文本内容，可以选中后查看内容。

实时编辑器
// import HideText from '@site/src/components/HideText';
<HideText text="(✿◡‿◡)" />
结果
Loading...

边框卡片​

实时编辑器
// import BorderCard from '@site/src/components/BorderCard';
<BorderCard title="居中标题">
  在正文内容中
  <span style={{color: 'red'}}>可以使用其他 HTML 标签或组件</span>
</BorderCard>
结果
Loading...

图标卡片按钮​

icon 属性直接填写文件名；将图标文件保存到 static/icons/ 目录下；图片比例必须为 1:1。

实时编辑器
<div className="row">
    <IconCardButton
        icon="spring.svg"
        title="Spring"
        text="互联网软件开发全家桶"
        href="/docs/开发/框架/Spring/Boot/"
    />
    <IconCardButton
        icon="flutter.svg"
        title="Flutter"
        text="只要一套代码库，即可构建、测试和发布适用于移动、Web、桌面和嵌入式平台的精美应用"
        href="/docs/开发/框架/Flutter/"
    />
</div>
结果
Loading...