feat(syntax): add fraction syntax (#181)

* feat(syntax): add fraction syntax

* docs: add remind for Hugo extended version

12 files changed, 90 insertions, 18 deletions

diff --git a/exampleSite/content/about.en.md b/exampleSite/content/about.en.md
index 9180e3e..b46a1d2 100644
--- a/exampleSite/content/about.en.md
+++ b/exampleSite/content/about.en.md
@@ -23,7 +23,7 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
 
 #### Performance and SEO
 
-* :(fas fa-rocket): Optimized for **performance**: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
+* :(fas fa-rocket): Optimized for **performance**: [99]/[100] on mobile and [100]/[100] on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
 * :(fab fa-searchengin): Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
 * :(fab fa-google): [**Google Analytics**](https://analytics.google.com/analytics) supported
 * :(fas fa-search): Search engine **verification** supported (Google, Bind, Yandex and Baidu)
@@ -32,8 +32,8 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
 
 #### Appearance and Layout
 
-* :(fas fa-desktop): / :(fas fa-mobile): **Responsive** layout
-* :(fas fa-moon): / :(fas fa-sun): **Dark/Light** mode
+* [:(fas fa-desktop):]/[:(fas fa-mobile):] **Responsive** layout
+* [:(fas fa-sun):]/[:(fas fa-moon):] **[Light]/[Dark]** mode
 * :(fas fa-layer-group): Globally consistent **design language**
 * :(fas fa-ellipsis-h): **Pagination** supported
 * :(far fa-list-alt): Easy-to-use and self-expanding **table of contents**
diff --git a/exampleSite/content/about.fr.md b/exampleSite/content/about.fr.md
index df9c250..d16afba 100644
--- a/exampleSite/content/about.fr.md
+++ b/exampleSite/content/about.fr.md
@@ -28,7 +28,7 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
 
 #### Performance and SEO
 
-* :(fas fa-rocket): Optimized for **performance**: 99/100 on mobile and 100/100 on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
+* :(fas fa-rocket): Optimized for **performance**: [99]/[100] on mobile and [100]/[100] on desktop in [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights)
 * :(fab fa-searchengin): Optimized SEO performance with a correct **SEO SCHEMA** based on JSON-LD
 * :(fab fa-google): [**Google Analytics**](https://analytics.google.com/analytics) supported
 * :(fas fa-search): Search engine **verification** supported (Google, Bind, Yandex and Baidu)
@@ -37,8 +37,8 @@ It is based on the original [LeaveIt Theme](https://github.com/liuzc/LeaveIt/) a
 
 #### Appearance and Layout
 
-* :(fas fa-desktop): / :(fas fa-mobile): **Responsive** layout
-* :(fas fa-moon): / :(fas fa-sun): **Dark/Light** mode
+* [:(fas fa-desktop):]/[:(fas fa-mobile):] **Responsive** layout
+* [:(fas fa-sun):]/[:(fas fa-moon):] **[Light]/[Dark]** mode
 * :(fas fa-layer-group): Globally consistent **design language**
 * :(fas fa-ellipsis-h): **Pagination** supported
 * :(far fa-list-alt): Easy-to-use and self-expanding **table of contents**
diff --git a/exampleSite/content/about.zh-cn.md b/exampleSite/content/about.zh-cn.md
index 2c4d606..75b1487 100644
--- a/exampleSite/content/about.zh-cn.md
+++ b/exampleSite/content/about.zh-cn.md
@@ -23,7 +23,7 @@ lightgallery: true
 
 #### 性能和 SEO
 
-* :(fas fa-rocket): **性能**优化：在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中， 99/100 的移动设备得分和 100/100 的桌面设备得分
+* :(fas fa-rocket): **性能**优化：在 [Google PageSpeed Insights](https://developers.google.com/speed/pagespeed/insights) 中， [99]/[100] 的移动设备得分和 [100]/[100] 的桌面设备得分
 * :(fab fa-searchengin): 使用基于 JSON-LD 格式 的 **SEO SCHEMA** 文件进行 SEO 优化
 * :(fab fa-google): 支持 **[Google Analytics](https://analytics.google.com/analytics)**
 * :(fas fa-search): 支持搜索引擎的**网站验证** (Google, Bind, Yandex and Baidu)
@@ -32,8 +32,8 @@ lightgallery: true
 
 #### 外观和布局
 
-* :(fas fa-desktop): / :(fas fa-mobile): **响应式**布局
-* :(fas fa-moon): / :(fas fa-sun): **夜晚/白天** 主题模式
+* [:(fas fa-desktop):]/[:(fas fa-mobile):] **响应式**布局
+* [:(fas fa-sun):]/[:(fas fa-moon):] **[白天]/[夜晚]** 主题模式
 * :(fas fa-layer-group): 全局一致的**设计语言**
 * :(fas fa-ellipsis-h): 支持**分页**
 * :(far fa-list-alt): 易用和自动展开的**文章目录**
diff --git a/exampleSite/content/posts/theme-documentation-basics.en.md b/exampleSite/content/posts/theme-documentation-basics.en.md
index 8e4fbf8..11637b4 100644
--- a/exampleSite/content/posts/theme-documentation-basics.en.md
+++ b/exampleSite/content/posts/theme-documentation-basics.en.md
@@ -35,12 +35,16 @@ Discover what the Hugo - **LoveIt** theme is all about and the core-concepts beh
 
 Thanks to the simplicity of Hugo, [Hugo](https://gohugo.io/) is the only dependency of this theme.
 
-Just install latest version of [:(far fa-file-archive): Hugo (> 0.62.0)](https://gohugo.io/getting-started/installing/) for your OS (**Windows**, **Linux**, **macOS**).
+Just install latest version of [:(far fa-file-archive): Hugo extended (> 0.62.0)](https://gohugo.io/getting-started/installing/) for your OS (**Windows**, **Linux**, **macOS**).
 
 {{< admonition note "Why not support earlier versions of Hugo?" >}}
 Since [Markdown Render Hooks](https://gohugo.io/getting-started/configuration-markup/#markdown-render-hooks) was introduced in the [Hugo Christmas Edition](https://gohugo.io/news/0.62.0-relnotes/), this theme only supports Hugo versions above **0.62.0**.
 {{< /admonition >}}
 
+{{< admonition note "Why need the Hugo extended version?" >}}
+Since this theme processes SCSS to CSS, the Hugo extended version is needed.
+{{< /admonition >}}
+
 ## 2 Installation
 
 The following steps are here to help you initialize your new website. If you don’t know Hugo at all, we strongly suggest you learn more about it by following this [great documentation for beginners](https://gohugo.io/getting-started/quick-start/).
diff --git a/exampleSite/content/posts/theme-documentation-basics.fr.md b/exampleSite/content/posts/theme-documentation-basics.fr.md
index 9e2ac2d..858946d 100644
--- a/exampleSite/content/posts/theme-documentation-basics.fr.md
+++ b/exampleSite/content/posts/theme-documentation-basics.fr.md
@@ -40,12 +40,16 @@ Welcome to take the time to propose a translation by [making a PR](https://githu
 
 Thanks to the simplicity of Hugo, [Hugo](https://gohugo.io/) is the only dependency of this theme.
 
-Just install latest version of [:(far fa-file-archive): Hugo (> 0.62.0)](https://gohugo.io/getting-started/installing/) for your OS (**Windows**, **Linux**, **macOS**).
+Just install latest version of [:(far fa-file-archive): Hugo extended (> 0.62.0)](https://gohugo.io/getting-started/installing/) for your OS (**Windows**, **Linux**, **macOS**).
 
 {{< admonition note "Why not support earlier versions of Hugo?" >}}
 Since [Markdown Render Hooks](https://gohugo.io/getting-started/configuration-markup/#markdown-render-hooks) was introduced in the [Hugo Christmas Edition](https://gohugo.io/news/0.62.0-relnotes/), this theme only supports Hugo versions above **0.62.0**.
 {{< /admonition >}}
 
+{{< admonition note "Why need the Hugo extended version?" >}}
+Since this theme processes SCSS to CSS, the Hugo extended version is needed.
+{{< /admonition >}}
+
 ## 2 Installation
 
 The following steps are here to help you initialize your new website. If you don’t know Hugo at all, we strongly suggest you learn more about it by following this [great documentation for beginners](https://gohugo.io/getting-started/quick-start/).
diff --git a/exampleSite/content/posts/theme-documentation-basics.zh-cn.md b/exampleSite/content/posts/theme-documentation-basics.zh-cn.md
index fda353c..87ae150 100644
--- a/exampleSite/content/posts/theme-documentation-basics.zh-cn.md
+++ b/exampleSite/content/posts/theme-documentation-basics.zh-cn.md
@@ -35,12 +35,16 @@ comment: true
 
 由于 Hugo 提供的便利性, [Hugo](https://gohugo.io/) 本身是这个主题唯一的依赖.
 
-直接安装满足你操作系统 (**Windows**, **Linux**, **macOS**) 的最新版本 [:(far fa-file-archive): Hugo (> 0.62.0)](https://gohugo.io/getting-started/installing/).
+直接安装满足你操作系统 (**Windows**, **Linux**, **macOS**) 的最新版本 [:(far fa-file-archive): Hugo extended (> 0.62.0)](https://gohugo.io/getting-started/installing/).
 
 {{< admonition note "为什么不支持早期版本的 Hugo?" >}}
 由于 [Markdown 渲染钩子函数](https://gohugo.io/getting-started/configuration-markup/#markdown-render-hooks) 在 [Hugo 圣诞节版本](https://gohugo.io/news/0.62.0-relnotes/) 中被引入, 本主题只支持高于 **0.62.0** 的 Hugo 版本.
 {{< /admonition >}}
 
+{{< admonition note "为什么需要 Hugo extended 版本?" >}}
+由于本主题需要转换 SCSS 文件为 CSS 文件, Hugo extended 版本是必要的.
+{{< /admonition >}}
+
 ## 2 安装
 
 以下步骤可帮助你初始化新网站. 如果你根本不了解 Hugo, 我们强烈建议你按照此 [快速入门文档](https://gohugo.io/getting-started/quick-start/) 进一步了解它.
diff --git a/exampleSite/content/posts/theme-documentation-content.en.md b/exampleSite/content/posts/theme-documentation-content.en.md
index aaed2c4..21e2750 100644
--- a/exampleSite/content/posts/theme-documentation-content.en.md
+++ b/exampleSite/content/posts/theme-documentation-content.en.md
@@ -241,6 +241,26 @@ The rendered output looks like this:
 
 [Hugo]^(An open-source static site generator)
 
+### Fraction
+
+{{< admonition warning >}}
+{{< version 0.2.0 >}}
+{{< /admonition >}}
+
+An extended Markdown syntax for **fraction** is supported in **LoveIt** theme:
+
+```markdown
+[Light]{?/}[Dark]
+
+[99]{?/}[100]
+```
+
+The rendered output looks like this:
+
+[Light]/[Dark]
+
+[90]/[100]
+
 ### Font Awesome
 
 **LoveIt** theme uses [Font Awesome](https://fontawesome.com/) as the icon library.
diff --git a/exampleSite/content/posts/theme-documentation-content.fr.md b/exampleSite/content/posts/theme-documentation-content.fr.md
index 1a635ab..7ebbe4d 100644
--- a/exampleSite/content/posts/theme-documentation-content.fr.md
+++ b/exampleSite/content/posts/theme-documentation-content.fr.md
@@ -246,6 +246,26 @@ The rendered output looks like this:
 
 [Hugo]^(An open-source static site generator)
 
+### Fraction
+
+{{< admonition warning >}}
+{{< version 0.2.0 >}}
+{{< /admonition >}}
+
+An extended Markdown syntax for **fraction** is supported in **LoveIt** theme:
+
+```markdown
+[Light]{?/}[Dark]
+
+[99]{?/}[100]
+```
+
+The rendered output looks like this:
+
+[Light]/[Dark]
+
+[90]/[100]
+
 ### Font Awesome
 
 **LoveIt** theme uses [Font Awesome](https://fontawesome.com/) as the icon library.
diff --git a/exampleSite/content/posts/theme-documentation-content.zh-cn.md b/exampleSite/content/posts/theme-documentation-content.zh-cn.md
index 2e3de1c..f681bac 100644
--- a/exampleSite/content/posts/theme-documentation-content.zh-cn.md
+++ b/exampleSite/content/posts/theme-documentation-content.zh-cn.md
@@ -241,6 +241,26 @@ $$ \ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-} $$
 
 [Hugo]^(一个开源的静态网站生成工具)
 
+### 分数
+
+{{< admonition warning >}}
+{{< version 0.2.0 >}}
+{{< /admonition >}}
+
+**LoveIt** 主题支持一种 **分数** Markdown 扩展语法:
+
+```markdown
+[白天]{?/}[夜晚]
+
+[99]{?/}[100]
+```
+
+呈现的输出效果如下:
+
+[白天]/[夜晚]
+
+[90]/[100]
+
 ### Font Awesome
 
 **LoveIt** 主题使用 [Font Awesome](https://fontawesome.com/) 作为图标库.
diff --git a/exampleSite/content/posts/theme-documentation-shortcodes.en.md b/exampleSite/content/posts/theme-documentation-shortcodes.en.md
index 2ad2999..2ff765d 100644
--- a/exampleSite/content/posts/theme-documentation-shortcodes.en.md
+++ b/exampleSite/content/posts/theme-documentation-shortcodes.en.md
@@ -219,8 +219,8 @@ This is a right-aligned paragraph.
 
 ### `link`
 
-{{< admonition >}}
-{{< version 1.2.0 >}}
+{{< admonition warning >}}
+{{< version 0.2.0 >}}
 {{< /admonition >}}
 
 `link` shortcode is an alternative to [Markdown link syntax](../basic-markdown-syntax/#links). `link` shortcode can provide some other features and can be used in code blocks.
diff --git a/exampleSite/content/posts/theme-documentation-shortcodes.fr.md b/exampleSite/content/posts/theme-documentation-shortcodes.fr.md
index d270a11..4aa5943 100644
--- a/exampleSite/content/posts/theme-documentation-shortcodes.fr.md
+++ b/exampleSite/content/posts/theme-documentation-shortcodes.fr.md
@@ -224,8 +224,8 @@ This is a right-aligned paragraph.
 
 ### `link`
 
-{{< admonition >}}
-{{< version 1.2.0 >}}
+{{< admonition warning >}}
+{{< version 2.2.0 >}}
 {{< /admonition >}}
 
 `link` shortcode is an alternative to [Markdown link syntax](../basic-markdown-syntax/#links). `link` shortcode can provide some other features and can be used in code blocks.
diff --git a/exampleSite/content/posts/theme-documentation-shortcodes.zh-cn.md b/exampleSite/content/posts/theme-documentation-shortcodes.zh-cn.md
index 05e38c3..f20fdc6 100644
--- a/exampleSite/content/posts/theme-documentation-shortcodes.zh-cn.md
+++ b/exampleSite/content/posts/theme-documentation-shortcodes.zh-cn.md
@@ -221,8 +221,8 @@ This is a right-aligned paragraph.
 
 ### `link`
 
-{{< admonition >}}
-{{< version 1.2.0 >}}
+{{< admonition warning >}}
+{{< version 2.2.0 >}}
 {{< /admonition >}}
 
 `link` shortcode 是 [Markdown 链接语法](../basic-markdown-syntax/#links) 的替代.