refactor: move inline style to assets/customize.scss

.editorconfig

@@ -14,3 +14,6 @@ indent_size = 4
 [*.md]
 indent_size = 4
 trim_trailing_whitespace = false
+
+[layouts/**/*]
+insert_final_newline = false

assets/customize.scss

@@ -0,0 +1,86 @@
+img.shields-icon {
+  display: inline-block;
+  vertical-align: text-bottom;
+}
+
+a.github-profile {
+  color: inherit;
+  cursor: pointer;
+  text-decoration: none;
+  display: inline-block;
+  vertical-align: middle;
+  img {
+    display: inline-block;
+    height: 2em;
+    vertical-align: middle;
+    border-radius: 50%;
+  }
+}
+
+.gh-contribuors {
+  display: grid;
+  padding: 0 1rem;
+  margin: 0 0 1rem;
+  grid-gap: 0.5rem;
+  grid-template-columns: repeat(auto-fit, minmax(2rem, 1fr));
+}
+
+.gh-contribuors img {
+  width: 2rem;
+  height: 2rem;
+  border-radius: 50%;
+}
+
+.csv-table {
+  margin: 0;
+  white-space: nowrap;
+  th {
+    text-align: center;
+  }
+}
+
+.mtf-wiki {
+  span:nth-child(1),
+  span:nth-child(4) {
+    color: #5bcefa;
+  }
+  span:nth-child(2),
+  span:nth-child(3) {
+    color: #f6a8b8;
+  }
+}
+
+.doctor-story {
+  display: inline !important;
+  height: 6em;
+  vertical-align: middle;
+}
+
+.user-tag {
+  display: inline-block;
+  padding: 0.25em 0.4em;
+  padding-right: 0.6em;
+  padding-left: 0.6em;
+  border-radius: 10rem;
+  font-weight: 700;
+  line-height: 1;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: baseline;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
+    border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+
+  &.positive {
+    color: #fff;
+    background-color: #28a745;
+  }
+
+  &.negative {
+    color: #212529;
+    background-color: #ffc107;
+  }
+}
+
+.sign-off-by {
+  text-align: right;
+}

config/_default/config.toml

@@ -19,6 +19,9 @@ disableKinds = ["taxonomyTerm"]
 
 [params]
 hostName = "https://mtf.wiki"
+custom_css = [
+  "customize.scss"
+]
 
 [markup]
   [markup.goldmark]

content/zh-cn/_index.md

@@ -39,8 +39,8 @@ footer:
   contents:
     align: left
     applySinglePageCss: true
-    markdown: |
-      <h2><span style="color:#5bcefa">M</span><span style="color:#f6a8b8">t</span>F <span style="color:#f6a8b8">Wi</span><span style="color:#5bcefa">ki</span></h2>
+    markdown: >
+      <h2 class="mtf-wiki"><span>M</span><span>t</span>F <span>Wi</span><span>ki</span></h2>
       <p>Copyright &copy; 2020-2021 MtF Wiki. All rights reserved.</p>
       <blockquote>如果你能记住我的名字，如果你们都能记住我的名字，也许我或者“我们”，终有一天能自由地生存着。</blockquote>
 ---

content/zh-cn/about.md

@@ -23,19 +23,19 @@ weight: 0
 {{< gh-profile "kenchiu233" >}}
 创始人
 
-{{< gh-profile "CoelacanthusHex" >}}&nbsp;{{< email "coelacanthus@outlook.com" >}}
+{{< gh-profile "CoelacanthusHex" >}}&nbsp;<coelacanthus@outlook.com>
 站点与代码维护
 
-{{< gh-profile "saeziae" >}}&nbsp;{{< email "i@estela.cn" >}}
+{{< gh-profile "saeziae" >}}&nbsp;<i@estela.cn>
 药物板块、长三角地区编辑维护，镜像维护，外文翻译
 
-{{< gh-profile "llh721113" >}}&nbsp;{{< email "llh721113@outlook.com" >}}
+{{< gh-profile "llh721113" >}}&nbsp;<llh721113@outlook.com>
 北京地区编辑维护
 
-{{< gh-profile "septs" >}}&nbsp;{{< email "mtfwiki@septs.email" >}}
+{{< gh-profile "septs" >}}&nbsp;<mtfwiki@septs.email>
 手术医疗相关板块维护
 
-{{< gh-profile "Clansty" >}}&nbsp;{{< email "i@gao4.pw" >}}
+{{< gh-profile "Clansty" >}}&nbsp;<i@gao4.pw>
 手术医疗相关板块维护
 
 以及感谢所有 GitHub 贡献者：
@@ -46,11 +46,14 @@ weight: 0
 
 ## 联络
 
-通过 Discord <a href="https://233.plus/discord"><img style="display:inline-block;vertical-align:text-bottom" src="https://img.shields.io/discord/883004164760801320?style=flat-square" /></a>
+通过 Discord [![Discord][shields-discord]](https://233.plus/discord)
 
-通过 GitHub <a href="https://github.com/mtf-wiki/MtF-Wiki/issues/new"><img style="display:inline-block;vertical-align:text-bottom" src="https://img.shields.io/github/issues/mtf-wiki/MtF-Wiki?style=flat-square" /></a>
+通过 GitHub [![GitHub issues][shields-github]](https://github.com/mtf-wiki/MtF-Wiki/issues/new)
 
-通过 邮件 {{< email "mtfwiki@estela.cn" >}}
+通过 邮件 <mtfwiki@estela.cn>
+
+[shields-discord]: https://img.shields.io/discord/883004164760801320?style=flat-square
+[shields-github]: https://img.shields.io/github/issues/mtf-wiki/MtF-Wiki?style=flat-square
 
 ## 致谢
 

content/zh-cn/docs/friendship/index.md

@@ -37,7 +37,7 @@ weight: 9
 
 该 [411]({{< ref "sh411" >}}) MtF SRS 术后交流群采取纯邀请制
 
-请发送邮件至 {{< email "411-mtf-srs@kuaer.club" >}} 经过交叉验证后会邀请加入
+请发送邮件至 <411-mtf-srs@kuaer.club> 经过交叉验证后会邀请加入
 
 {{< hashtag "trans-related-bot" >}}
 

layouts/_default/_markup/render-image.html

@@ -1 +1,5 @@
+{{- if hasPrefix .Destination "https://img.shields.io" -}}
+<img class="shields-icon" src="{{ .Destination }}" loading="lazy" alt="{{ .Text }}" />
+{{- else -}}
 <p class="md__image"><img src="{{ .Destination }}" loading="lazy" alt="{{ .Text }}" {{ with .Title}} title="{{ . }}"{{ end }} /></p>
+{{- end -}}

layouts/_default/_markup/render-link.html

@@ -1 +1,8 @@
-<a href="{{ .Destination }}"{{ with .Title}} title="{{ . }}"{{ end }}{{ if strings.HasPrefix .Destination "http" }} target="_blank"{{ end }}>{{ .Text | safeHTML }}</a>
+{{- if hasPrefix .Destination "mailto:" -}}
+{{- $badge := replace (replace .Text "-" "--") "_" "__" -}}
+<a href="{{ .Destination }}"><img class="shields-icon" src="https://img.shields.io/badge/email-{{ $badge }}-blue?style=flat-square" /></a>
+{{- else -}}
+<a href="{{ .Destination }}"{{ with .Title}} title="{{ . }}"{{ end }}{{ if hasPrefix .Destination "http" }} target="_blank"{{ end }}>
+  {{- .Text | safeHTML -}}
+</a>
+{{- end -}}

layouts/shortcodes/csv-table.html

@@ -1,10 +1,10 @@
 {{ $caption := .Get "caption" }}
 {{ $useHeaderRow := .Get "header" | default true }}
 {{ $rows := .Inner | transform.Unmarshal }}
-<table style="margin:0;white-space:nowrap">
+<table class="csv-table">
 {{ with $caption }}<caption>{{- . -}}</caption>{{ end }}
 {{ if $useHeaderRow -}}
-<thead><tr>{{ range (index $rows 0) }}<th style="text-align:center">{{- . -}}</th>{{ end }}</tr></thead>
+<thead><tr>{{ range (index $rows 0) }}<th>{{- . -}}</th>{{ end }}</tr></thead>
 {{- $rows = after 1 $rows -}}
 {{ end -}}
 <tbody>

layouts/shortcodes/email.html

@@ -1,4 +0,0 @@
-{{- $email := .Get 0 -}}
-{{- $badge := replace $email "-" "--" -}}
-{{- $badge = replace $badge "_" "__" -}}
-<a href="mailto:{{ $email }}"><img style="display:inline-block;vertical-align:text-bottom" src="https://img.shields.io/badge/email-{{ $badge }}-blue?style=flat-square" /></a>

layouts/shortcodes/gh-contributors.html

@@ -1,13 +1,3 @@
-<style>
-  .gh-contribuors {
-    display: grid;
-    padding: 0 1rem;
-    margin: 0 0 1rem;
-    grid-gap: 0.5rem;
-    grid-template-columns: repeat(auto-fit, minmax(2rem, 1fr));
-  }
-  .gh-contribuors img { width: 2rem; height: 2rem; border-radius: 50%; }
-</style>
 {{- $contributors := getJSON
 "https://api.github.com/repos/mtf-wiki/MtF-Wiki/contributors?per_page=100" }}
 <section class="gh-contribuors">

layouts/shortcodes/gh-profile.html

@@ -1,7 +1,7 @@
 {{- $name := .Get 1 -}}
 {{- with getJSON (printf "https://api.github.com/users/%s" (.Get 0)) -}}
-<a style="all:unset;cursor:pointer" href="{{ .html_url }}" title="{{ $name | default .name }}">
-<img src="{{ .avatar_url }}" style="display:inline-block;height:2em;vertical-align:middle;border-radius:50%">
+<a class="github-profile" href="{{ .html_url }}" title="{{ $name | default .name }}">
+<img src="{{ .avatar_url }}">
 <b>{{ $name | default .name }}</b>
 <i class="bi bi-github"></i>
 </a>

layouts/shortcodes/hybl.html

@@ -1 +1 @@
-<img src="/images/hybl.jpg" style="display:inline;height:6em;vertical-align:middle"/>害，您瞧瞧，这儿不花园北路吗？
+<img src="/images/hybl.jpg" class="doctor-story"> 害，您瞧瞧，这儿不花园北路吗？

layouts/shortcodes/mtf-wiki.html

@@ -1 +1 @@
-<span style="color:#5bcefa">M</span><span style="color:#f6a8b8">t</span>F <span style="color:#f6a8b8">Wi</span><span style="color:#5bcefa">ki</span> 
+<span class="mtf-wiki"><span>M</span><span>t</span>F <span>Wi</span><span>ki</span></span>

layouts/shortcodes/sign-name.html

@@ -1 +1 @@
-<p style="text-align:right">由 <u>{{ .Get 0 }}</u> 投稿</p>
+<p class="sign-off-by">由 <u>{{ .Get 0 }}</u> 投稿</p>

layouts/shortcodes/tag-neg.html

@@ -1 +1 @@
-<span style="display: inline-block;padding: 0.25em 0.4em;padding-right: 0.6em;padding-left: 0.6em;border-radius: 10rem;font-weight: 700;line-height: 1;text-align: center;white-space: nowrap;vertical-align: baseline;transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; color: #212529;background-color:#ffc107;">{{ .Get 0 }}</span>
+<span class="user-tag negative">{{ .Get 0 }}</span>

layouts/shortcodes/tag-pos.html

@@ -1 +1 @@
-<span style="display: inline-block;padding: 0.25em 0.4em;padding-right: 0.6em;padding-left: 0.6em;border-radius: 10rem;font-weight: 700;line-height: 1;text-align: center;white-space: nowrap;vertical-align: baseline;transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; color: #fff;background-color: #28a745;">{{ .Get 0 }}</span>
+<span class="user-tag positive">{{ .Get 0 }}</span>

layouts/shortcodes/wpnl.html

@@ -1 +1 @@
-<img src="/images/wpnl.jpg" style="display:inline;height:6em;vertical-align:middle" /> 侬准备到 600 号报到是伐？
+<img src="/images/wpnl.jpg" class="doctor-story"> 侬准备到 600 号报到是伐？