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

* feat(syntax): add fraction syntax * docs: add remind for Hugo extended version
pogor-dev · Mar 17, 2020 · 84d48f3 · 84d48f3
1 parent 01d814e
commit 84d48f3
Show file tree

Hide file tree

Showing 19 changed files with 104 additions and 24 deletions.
diff --git a/README.md b/README.md
@@ -66,7 +66,7 @@ I hope you will LoveIt ❤️!
 ### Appearance and Layout
 
 * **Responsive** layout
-* **Dark/Light** mode
+* **Light/Dark** mode
 * Globally consistent **design language**
 * **Pagination** supported
 * Easy-to-use and self-expanding **table of contents**

diff --git a/assets/css/_partial/_archive/_tags.scss b/assets/css/_partial/_archive/_tags.scss
@@ -23,7 +23,7 @@
       transform: scale(1.2);
     }
 
-    small {
+    sup {
       color: $global-font-secondary-color;
 
       .dark-theme & {

diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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
@@ -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) 的替代.

diff --git a/layouts/partials/assets.html b/layouts/partials/assets.html
@@ -70,6 +70,7 @@
                 exThumbImage: 'data-thumbnail',
                 thumbWidth: 80,
                 thumbContHeight: 80,
+                actualSize: false,
             });
         });
     </script>

diff --git a/layouts/partials/function/fraction.html b/layouts/partials/function/fraction.html
@@ -0,0 +1,5 @@
+{{- /* Fraction */ -}}
+{{- /* [A]/[B] -> <sup>A</sup>/<sub>B</sub> */ -}}
+{{- $REin := `\[(.+?)\]/\[(.+?)\]` -}}
+{{- $REout := `<sup>$1</sup>/<sub>$2</sub>` -}}
+{{- return replaceRE $REin $REout . -}}
diff --git a/layouts/partials/single/content.html b/layouts/partials/single/content.html
@@ -1,9 +1,11 @@
 {{- $content := . -}}
 
-{{- $content = partial "function/fontawesome.html" $content -}}
-
 {{- $content = partial "function/ruby.html" $content -}}
 
+{{- $content = partial "function/fraction.html" $content -}}
+
+{{- $content = partial "function/fontawesome.html" $content -}}
+
 {{- $content = partial "function/checkbox.html" $content -}}
 
 {{- $content = partial "function/escape.html" $content -}}

diff --git a/layouts/taxonomy/terms.html b/layouts/taxonomy/terms.html
@@ -49,7 +49,7 @@ <h3 class="card-item-title">
         {{- else if eq $taxonomies "tags" -}}
             <div class="tag-cloud-tags">
                 {{- range $.Site.Taxonomies.tags.ByCount -}}
-                    <a href="{{ .Page.RelPermalink }}"> {{ .Page.Title }} <small>({{ .Count }})</small></a>
+                    <a href="{{ .Page.RelPermalink }}"> {{ .Page.Title }} <sup>{{ .Count }}</sup></a>
                 {{- end -}}
             </div>
         {{- end -}}

diff --git a/resources/_gen/assets/scss/css/style.template.scss_90197bdac482216ecaaaae0fb88517c1.content b/resources/_gen/assets/scss/css/style.template.scss_90197bdac482216ecaaaae0fb88517c1.content
-Original file line number
+Diff line change
@@ Expand Up / @@ -23,7 +23,7 @@ @@
           transform: scale(1.2);
         }
-        small {
+        sup {
           color: $global-font-secondary-color;
           .dark-theme & {
@@ Expand Down @@