add translation for new shortcode

This commit is contained in:
Nuno Coração 2024-05-13 22:04:07 +01:00
parent f65cc799c8
commit 5a5a856832
5 changed files with 222 additions and 102 deletions

View file

@ -1233,19 +1233,19 @@ select {
margin-bottom:0.75em
}
.prose :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
.prose :where(.prose > ul > li > *:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
margin-top:1.25em
}
.prose :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
.prose :where(.prose > ul > li > *:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
margin-bottom:1.25em
}
.prose :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
.prose :where(.prose > ol > li > *:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
margin-top:1.25em
}
.prose :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
.prose :where(.prose > ol > li > *:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {
margin-bottom:1.25em
}

View file

@ -77,10 +77,10 @@ This is an error!
**Example:**
```md
{{</* article link="/it/docs/welcome/" */>}}
{{</* article link="/docs/welcome/" */>}}
```
{{< article link="/it/docs/welcome/" >}}
{{< article link="/docs/welcome/" >}}
<br/><br/><br/>
@ -188,6 +188,31 @@ You can see some additional Chart.js examples on the [charts samples]({{< ref "c
<br/><br/><br/>
## Code Importer
This shortcode is for importing code from external sources easily without copying and pasting.
<!-- prettier-ignore-start -->
| Parameter | Description |
| --------- | ------------------------------------------------------- |
| `url` | **Required** URL to an externally hosted code file. |
| `type` | Code type used for syntax highlighting. |
<!-- prettier-ignore-end -->
**Example:**
```md
{{</* codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" */>}}
```
{{< codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" >}}
<br/><br/>
## Figure
Blowfish includes a `figure` shortcode for adding images to content. The shortcode replaces the base Hugo functionality in order to provide additional performance benefits.
@ -738,17 +763,39 @@ consectetur adipiscing elit.
A shortcut to embed youtube videos using the [lite-youtube-embed](https://github.com/paulirish/lite-youtube-embed) library. This library is a lightweight alternative to the standard youtube embeds, and it's designed to be faster and more efficient.
<!-- prettier-ignore-start -->
| Parameter | Description |
| --------- | ----------------------------------- |
| `id` | [String] Youtube video id to embed. |
| `label` | [String] Label for the video |
| Parameter | Description |
| --------- | -------------------------------------------- |
| `id` | [String] Youtube video id to embed. |
| `label` | [String] Label for the video |
| `params` | [String] Extras parameters for video playing |
<!-- prettier-ignore-end -->
**Example 1:**
```md
{{</* youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" */>}}
```
{{< youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" >}}
**Example 2:**
You can use all of Youtube's [player parameters](https://developers.google.com/youtube/player_parameters#Parameters) for the `params` variable, as demonstrated below:
> This video will start after 130 seconds (2m10)
```md
{{</* youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" params="start=130" */>}}
```
> This video will not have UI controls, will start playing at 130 seconds and will stop 10 seconds later.
To concatenate multiple options as shown below, you need to add the `&` character between them.
```md
{{</* youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" params="start=130&end=10&controls=0" */>}}
```
{{< youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" params="start=130&end=10&controls=0" >}}
More informations can be found on the [youtubeLite GitHub repo](https://github.com/paulirish/lite-youtube-embed/blob/master/readme.md#custom-player-parameters) and Youtube's [player parameters](https://developers.google.com/youtube/player_parameters#Parameters) page.

View file

@ -77,10 +77,10 @@ This is an error!
**Example:**
```md
{{</* article link="/ja/docs/welcome/" */>}}
{{</* article link="/docs/welcome/" */>}}
```
{{< article link="/ja/docs/welcome/" >}}
{{< article link="/docs/welcome/" >}}
<br/><br/><br/>
@ -188,6 +188,31 @@ You can see some additional Chart.js examples on the [charts samples]({{< ref "c
<br/><br/><br/>
## Code Importer
This shortcode is for importing code from external sources easily without copying and pasting.
<!-- prettier-ignore-start -->
| Parameter | Description |
| --------- | ------------------------------------------------------- |
| `url` | **Required** URL to an externally hosted code file. |
| `type` | Code type used for syntax highlighting. |
<!-- prettier-ignore-end -->
**Example:**
```md
{{</* codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" */>}}
```
{{< codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" >}}
<br/><br/>
## Figure
Blowfish includes a `figure` shortcode for adding images to content. The shortcode replaces the base Hugo functionality in order to provide additional performance benefits.
@ -738,17 +763,39 @@ consectetur adipiscing elit.
A shortcut to embed youtube videos using the [lite-youtube-embed](https://github.com/paulirish/lite-youtube-embed) library. This library is a lightweight alternative to the standard youtube embeds, and it's designed to be faster and more efficient.
<!-- prettier-ignore-start -->
| Parameter | Description |
| --------- | ----------------------------------- |
| `id` | [String] Youtube video id to embed. |
| `label` | [String] Label for the video |
| Parameter | Description |
| --------- | -------------------------------------------- |
| `id` | [String] Youtube video id to embed. |
| `label` | [String] Label for the video |
| `params` | [String] Extras parameters for video playing |
<!-- prettier-ignore-end -->
**Example 1:**
```md
{{</* youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" */>}}
```
{{< youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" >}}
**Example 2:**
You can use all of Youtube's [player parameters](https://developers.google.com/youtube/player_parameters#Parameters) for the `params` variable, as demonstrated below:
> This video will start after 130 seconds (2m10)
```md
{{</* youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" params="start=130" */>}}
```
> This video will not have UI controls, will start playing at 130 seconds and will stop 10 seconds later.
To concatenate multiple options as shown below, you need to add the `&` character between them.
```md
{{</* youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" params="start=130&end=10&controls=0" */>}}
```
{{< youtubeLite id="SgXhGb-7QbU" label="Blowfish-tools demo" params="start=130&end=10&controls=0" >}}
More informations can be found on the [youtubeLite GitHub repo](https://github.com/paulirish/lite-youtube-embed/blob/master/readme.md#custom-player-parameters) and Youtube's [player parameters](https://developers.google.com/youtube/player_parameters#Parameters) page.

View file

@ -188,6 +188,31 @@ You can see some additional Chart.js examples on the [charts samples]({{< ref "c
<br/><br/><br/>
## Code Importer
This shortcode is for importing code from external sources easily without copying and pasting.
<!-- prettier-ignore-start -->
| Parameter | Description |
| --------- | ------------------------------------------------------- |
| `url` | **Required** URL to an externally hosted code file. |
| `type` | Code type used for syntax highlighting. |
<!-- prettier-ignore-end -->
**Example:**
```md
{{</* codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" */>}}
```
{{< codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" >}}
<br/><br/>
## Figure
Blowfish includes a `figure` shortcode for adding images to content. The shortcode replaces the base Hugo functionality in order to provide additional performance benefits.
@ -522,31 +547,6 @@ This shortcode allows you to import markdown files from external sources. This i
{{< mdimporter url="https://raw.githubusercontent.com/nunocoracao/nunocoracao/master/README.md" >}}
<br/><br/>
## Code Importer
This shortcode is for importing code from external sources easily without copying and pasting.
<!-- prettier-ignore-start -->
| Parameter | Description |
| --------- | ------------------------------------------------------- |
| `url` | **Required** URL to an externally hosted code file. |
| `type` | Code type used for syntax highlighting. |
<!-- prettier-ignore-end -->
**Example:**
```md
{{</* codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" */>}}
```
{{< codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" >}}
<br/><br/>
## Mermaid

View file

@ -16,12 +16,12 @@ series_order: 8
`alert` 可以将其中内容输出为文章中的风格化消息框。它对于吸引读者注意您不想让读者错过的重要信息很有用。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `icon` | **可选** 显示在左侧的图标。<br>**默认:** `exclaimation triangle icon` (查看[图标简码](#icon),了解有关使用图标的更多详细信息。) |
| `iconColor` | **可选** 基本 CSS 样式中图标的颜色。<br>可以是十六进制值 (`#FFFFFF`) 或颜色名称 (`white`)<br>默认情况下由当前配色方案决定。 |
| `cardColor` | **可选** 基本 CSS 样式中卡片背景的颜色。<br>可以是十六进制值 (`#FFFFFF`) 或颜色名称 (`white`)<br>默认情况下由当前配色方案决定。 |
| `textColor` | **可选** 基本 CSS 样式中文本的颜色。<br>可以是十六进制值 (`#FFFFFF`) 或颜色名称 (`white`)<br>默认情况下由当前配色方案决定。 |
| 参数 | 功能 |
| ----------- | -------------------------------------------------------------------------------------------------------------------------------- |
| `icon` | **可选** 显示在左侧的图标。<br>**默认:** `exclaimation triangle icon` (查看[图标简码](#icon),了解有关使用图标的更多详细信息。) |
| `iconColor` | **可选** 基本 CSS 样式中图标的颜色。<br>可以是十六进制值 (`#FFFFFF`) 或颜色名称 (`white`)<br>默认情况下由当前配色方案决定。 |
| `cardColor` | **可选** 基本 CSS 样式中卡片背景的颜色。<br>可以是十六进制值 (`#FFFFFF`) 或颜色名称 (`white`)<br>默认情况下由当前配色方案决定。 |
| `textColor` | **可选** 基本 CSS 样式中文本的颜色。<br>可以是十六进制值 (`#FFFFFF`) 或颜色名称 (`white`)<br>默认情况下由当前配色方案决定。 |
<!-- prettier-ignore-end -->
输入内容是用 Markdown 语言编写的,因此您可以根据需要设置其格式。
@ -69,9 +69,9 @@ This is an error!
`Article` 将把一篇文章嵌入到一个 markdown 文件中。 参数中的 `link`应该是要嵌入的文件的 `.RelPermalink`。请注意,如果简码引用其父级文件,则它不会显示任何内容。 *注意:如果您在 Blowfish即 /blowfish/)等子文件夹中运行网站,请在链接中包含该路径。*
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| --------- | -------------------------------------------------------- |
| `link` | **必填** 要嵌入文章的 `.RelPermalink` |
| 参数 | 功能 |
| ------ | ------------------------------------- |
| `link` | **必填** 要嵌入文章的 `.RelPermalink` |
<!-- prettier-ignore-end -->
**例如:**
@ -125,11 +125,11 @@ Call to action
`carousel` 用于生成可交互且具有视觉吸引力的方式展示多个图像的画廊。这允许用户滑动浏览多个图像,同时仅占用单个图像的垂直空间。 所有图像均使用父组件的完整宽度并使用预定义的宽高比 `16:9``21:9``32:9` 之一显示。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| ------------- | ----------------------------------------------------------------------------------------------------------------- |
| `images` | **必填** 用于匹配图像名称的正则表达式或 URL。 |
| 参数 | 功能 |
| ------------- | --------------------------------------------------------------------- |
| `images` | **必填** 用于匹配图像名称的正则表达式或 URL。 |
| `aspectRatio` | **可选** 画廊的纵横比。`16-9` 、`21-9` 或`32-9` 。默认设置为`16-9` 。 |
| `interval` | **可选** 自动滚动的时间间隔,以毫秒为单位指定。默认为`2000`2 秒)。 |
| `interval` | **可选** 自动滚动的时间间隔,以毫秒为单位指定。默认为`2000`2 秒)。 |
<!-- prettier-ignore-end -->
**例1:** 16:9 宽高比和 URL 图像列表
@ -188,6 +188,32 @@ data: {
<br/><br/><br/>
## Code Importer
此短代码用于轻松从外部源导入代码,无需复制和粘贴
<!-- prettier-ignore-start -->
| Parameter | Description |
| --------- | ---------------------------------- |
| `url` | **必需的** 外部托管代码文件的 URL. |
| `type` | 用于语法突出显示的代码类型. |
<!-- prettier-ignore-end -->
**Example:**
```md
{{</* codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" */>}}
```
{{< codeimporter url="https://raw.githubusercontent.com/nunocoracao/blowfish/main/layouts/shortcodes/mdimporter.html" type="go" >}}
<br/><br/>
## Figure
Blowfish 包含一个 `figure` 简码,用于将图像添加到内容中。该简码取代了基本的 Hugo 功能,且性能更好。
@ -197,16 +223,16 @@ Blowfish 包含一个 `figure` 简码,用于将图像添加到内容中。该
`figure` 简码接受六个参数:
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| --------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 参数 | 功能 |
| --------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `src` | **必填** 图像的本地路径/文件名或 URL。当提供路径和文件名时主题将尝试使用以下查找顺序来查找图像首先作为与页面绑定的[页面资源](https://gohugo.io/content-management/page-resources/);然后是 `assets/` 目录中的文件;最后是,`static/`目录中的文件。 |
| `alt` | 图像的[替代文本描述](https://moz.com/learn/seo/alt-text)。 |
| `caption` | Markdown 格式的图像标题,将显示在图像下方。 |
| `class` | 应用于图像的其他 CSS 类。 |
| `href` | 图像应链接到的 URL。 |
| `target` | `href` URL 的目标属性。 |
| `nozoom` | `nozoom=true` 会禁用图像`缩放`功能。与 `href` 结合使用十分有用。 |
| `default` | 用于恢复默认 Hugo `figure` 行为的特殊参数。只需提供`default=true`,然后使用正常的 [Hugo 简码语法](https://gohugo.io/content-management/shortcodes/#figure)。 |
| `alt` | 图像的[替代文本描述](https://moz.com/learn/seo/alt-text)。 |
| `caption` | Markdown 格式的图像标题,将显示在图像下方。 |
| `class` | 应用于图像的其他 CSS 类。 |
| `href` | 图像应链接到的 URL。 |
| `target` | `href` URL 的目标属性。 |
| `nozoom` | `nozoom=true` 会禁用图像`缩放`功能。与 `href` 结合使用十分有用。 |
| `default` | 用于恢复默认 Hugo `figure` 行为的特殊参数。只需提供`default=true`,然后使用正常的 [Hugo 简码语法](https://gohugo.io/content-management/shortcodes/#figure)。 |
<!-- prettier-ignore-end -->
Blowfish 还支持使用标准 Markdown 语法自动转换图像。只需使用以下格式,主题将自动处理:
@ -297,9 +323,9 @@ Blowfish 还支持使用标准 Markdown 语法自动转换图像。只需使用
`github` 允许您快速链接到 github Repo同时显示和更新有关它的实时统计信息例如它的 star 和 fork 数。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| --------- | ----------------------------------------------------- |
| `repo` | [String] 格式为 `username/repo` 的 github repo |
| 参数 | 功能 |
| ------ | ---------------------------------------------- |
| `repo` | [String] 格式为 `username/repo` 的 github repo |
<!-- prettier-ignore-end -->
**例1:**
@ -320,9 +346,9 @@ Blowfish 还支持使用标准 Markdown 语法自动转换图像。只需使用
最后,只要 `api/v4/projects/` 可用,就可以提供自定义 GitLab 实例 URL从而使此简码能够显示大多数自托管/企业组织。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| ----------- | ----------------------------------------------------------------------- |
| `projectID` | [String] gitlab 数字项目ID |
| 参数 | 功能 |
| ----------- | ----------------------------------------------------------- |
| `projectID` | [String] gitlab 数字项目ID |
| `baseURL` | [String] 可选 gitlab 实例 URL默认为 `https://gitlab.com/` |
<!-- prettier-ignore-end -->
@ -386,9 +412,9 @@ Blowfish 还支持使用标准 Markdown 语法自动转换图像。只需使用
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| --------- | --------------------------------------- |
| `icon` | **可选** 关键字中使用的图标 |
| 参数 | 功能 |
| ------ | --------------------------- |
| `icon` | **可选** 关键字中使用的图标 |
<!-- prettier-ignore-end -->
输入内容是用 Markdown 编写的,因此您可以根据需要设置其格式。
@ -443,12 +469,12 @@ When life gives you lemons, make lemonade.
`List` 将显示最近文章的列表。此简码需要一个限制值来约束列表。此外,它还支持输入 `where``value` ,以便按参数过滤文章。请注意,此简码不会显示其父页面,但会计入限制值。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| ---------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `limit` | **必填** 要显示的最近文章数量。 |
| `title` | **可选** 列表标题,默认为 `Recent` |
| `cardView` | **可选** 列表启用卡片视图,默认为 `false` |
| `where` | 用于筛选文章的变量,例如 `Type` |
| 参数 | 功能 |
| ---------- | ------------------------------------------------------------------------------------------------------ |
| `limit` | **必填** 要显示的最近文章数量。 |
| `title` | **可选** 列表标题,默认为 `Recent` |
| `cardView` | **可选** 列表启用卡片视图,默认为 `false` |
| `where` | 用于筛选文章的变量,例如 `Type` |
| `value` | 需要与 `where` 中定义的参数匹配的值,以进行文章查询,例如对于 `where` == `Type`,可以找到文章 `sample` |
{{< alert >}}
@ -504,9 +530,9 @@ When life gives you lemons, make lemonade.
此简码允许您从外部源导入 Markdown 文件。这对于包含来自其他仓库或网站的内容非常有用,而无需复制和粘贴内容。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| --------- | ------------------------------------------------------- |
| `url` | **必填** 外部托管 Markdown 文件的 URL。 |
| 参数 | 功能 |
| ----- | --------------------------------------- |
| `url` | **必填** 外部托管 Markdown 文件的 URL。 |
<!-- prettier-ignore-end -->
@ -572,12 +598,12 @@ B-->C[Profit]
`timeline` 创建了一个可视化时间线,用于展示专业经验、项目成就等。 `timeline` 简码依赖于 `timelineItem` 子简码来定义主时间线中的每个项目。每个项目可以具有以下属性。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| ----------- | -------------------------------------------- |
| 参数 | 功能 |
| ----------- | ------------------------ |
| `icon` | 要在时间线中使用的图标。 |
| `header` | 每个条目的标题 |
| `badge` | 放置在右上角徽章内的文本 |
| `subheader` | 每个条目的副标题 |
| `header` | 每个条目的标题 |
| `badge` | 放置在右上角徽章内的文本 |
| `subheader` | 每个条目的副标题 |
<!-- prettier-ignore-end -->
@ -658,17 +684,17 @@ With other shortcodes
Blowfish 使用简码实现 TypeIt 功能的子集。在 `typeit` 简码中编写文本,并使用以下参数来配置您想要的行为。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| ------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------- |
| `tag` | [String] 将用于呈现字符串的 `html` 标签。 |
| `classList` | [String] 应用于 `html` 元素的 `css` 类列表。 |
| `initialString` | [String] 将显示为先写入并将被替换的初始字符串。 |
| `speed` | [number] 每步之间的打字速度,以毫秒为单位。 |
| `lifeLike` | [boolean] 使打字速度不规律,就像真人在打字一样。 |
| `startDelay` | [number] 插件在初始化后到开始输入的延迟时间。 |
| `breakLines` | [boolean] 将多个字符串换行输出 (true),或者将它们删除并替换 (false)。 |
| 参数 | 功能 |
| ------------------ | ------------------------------------------------------------------------- |
| `tag` | [String] 将用于呈现字符串的 `html` 标签。 |
| `classList` | [String] 应用于 `html` 元素的 `css` 类列表。 |
| `initialString` | [String] 将显示为先写入并将被替换的初始字符串。 |
| `speed` | [number] 每步之间的打字速度,以毫秒为单位。 |
| `lifeLike` | [boolean] 使打字速度不规律,就像真人在打字一样。 |
| `startDelay` | [number] 插件在初始化后到开始输入的延迟时间。 |
| `breakLines` | [boolean] 将多个字符串换行输出 (true),或者将它们删除并替换 (false)。 |
| `waitUntilVisible` | [boolean] 决定脚本在网站加载时启动还是在目标元素可见时启动。默认为 `true` |
| `loop` | [boolean] 字符串动画是否会循环 |
| `loop` | [boolean] 字符串动画是否会循环 |
<!-- prettier-ignore-end -->
@ -737,10 +763,10 @@ consectetur adipiscing elit.
使用 [lite-youtube-embed](https://github.com/paulirish/lite-youtube-embed) 库嵌入 YouTube 视频的简码。该库是 YouTube 嵌入播放器的轻量级替代品,其设计速度更快、更高效。
<!-- prettier-ignore-start -->
| 参数 | 功能 |
| --------- | ----------------------------------- |
| `id` | [String] 要嵌入的 YouTube 视频 ID。 |
| `label` | [String] 视频的标签 |
| 参数 | 功能 |
| ------- | ----------------------------------- |
| `id` | [String] 要嵌入的 YouTube 视频 ID。 |
| `label` | [String] 视频的标签 |
<!-- prettier-ignore-end -->
**例1:**