From 746537a801bbf851248be44d0bbc7ff8dab1636f Mon Sep 17 00:00:00 2001
From: Jimmy Cai <jimmehcai@gmail.com>
Date: Sat, 29 Aug 2020 11:34:26 +0200
Subject: [PATCH] refactor(article): add components/details

---
 layouts/partials/article-list/default.html    | 39 +------------------
 .../partials/article/components/details.html  | 38 ++++++++++++++++++
 .../partials/article/components/header.html   | 38 +-----------------
 3 files changed, 40 insertions(+), 75 deletions(-)
 create mode 100644 layouts/partials/article/components/details.html

diff --git a/layouts/partials/article-list/default.html b/layouts/partials/article-list/default.html
index 84fc93b..e58ef18 100644
--- a/layouts/partials/article-list/default.html
+++ b/layouts/partials/article-list/default.html
@@ -12,42 +12,5 @@
     </div>
     {{ end }}
 
-    {{ $i := .Params.image }}
-    {{ $context := . }}
-
-    <div class="article-details">
-        {{ with $categories := .Params.categories }}
-        <header class="article-category">
-            {{ range $categories }}
-                {{ if $i }}
-                    {{- $image := partial "helper/image" $context | resources.Fingerprint "md5"  -}}
-                    {{- $20x := $image.Fill "20x20 smart"  -}}
-                    <a href="/categories/{{ . | urlize }}" class="color-tag"
-                        data-image="{{ $20x.RelPermalink }}" data-id="{{ $context.Slug }}" data-key="{{ $image.Data.Integrity }}">{{ . | humanize }}</a>
-                {{ else }}
-                    <a href="/categories/{{ . | urlize }}">{{ . | humanize }}</a>
-                {{ end }}
-            {{ end }}
-        </header>
-        {{ end }}
-
-        <h2 class="article-title">
-            <a href="{{ .Permalink }}">
-                {{- .Title -}}
-            </a>
-        </h2>
-
-        {{ with .Params.description }}
-        <h3 class="article-subtitle">
-            {{ . }}
-        </h3>
-        {{ end }}
-
-        <footer class="article-time">
-            {{ (resources.Get "icons/clock.svg").Content | safeHTML }}
-            <time data-timeago="true" datetime='{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}'>
-                {{- .Date.Format ( or .Site.Params.dateFormat "Jan 02, 2006" ) -}}
-            </time>
-        </footer>
-    </div>
+    {{ partial "article/components/details" . }}
 </article>
\ No newline at end of file
diff --git a/layouts/partials/article/components/details.html b/layouts/partials/article/components/details.html
new file mode 100644
index 0000000..99c26f8
--- /dev/null
+++ b/layouts/partials/article/components/details.html
@@ -0,0 +1,38 @@
+{{ $i := .Params.image }}
+{{ $context := . }}
+
+<div class="article-details">
+    {{ with $categories := .Params.categories }}
+    <header class="article-category">
+        {{ range $categories }}
+            {{ if $i }}
+                {{- $image := partial "helper/image" $context | resources.Fingerprint "md5"  -}}
+                {{- $20x := $image.Fill "20x20 smart"  -}}
+                <a href="/categories/{{ . | urlize }}" class="color-tag"
+                    data-image="{{ $20x.RelPermalink }}" data-id="{{ $context.Slug }}" data-key="{{ $image.Data.Integrity }}">{{ . | humanize }}</a>
+            {{ else }}
+                <a href="/categories/{{ . | urlize }}">{{ . | humanize }}</a>
+            {{ end }}
+        {{ end }}
+    </header>
+    {{ end }}
+
+    <h2 class="article-title">
+        <a href="{{ .Permalink }}">
+            {{- .Title -}}
+        </a>
+    </h2>
+
+    {{ with .Params.description }}
+    <h3 class="article-subtitle">
+        {{ . }}
+    </h3>
+    {{ end }}
+
+    <footer class="article-time">
+        {{ (resources.Get "icons/clock.svg").Content | safeHTML }}
+        <time data-timeago="true" datetime='{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}'>
+            {{- .Date.Format ( or .Site.Params.dateFormat "Jan 02, 2006" ) -}}
+        </time>
+    </footer>
+</div>
\ No newline at end of file
diff --git a/layouts/partials/article/components/header.html b/layouts/partials/article/components/header.html
index 632be2f..1bd5663 100644
--- a/layouts/partials/article/components/header.html
+++ b/layouts/partials/article/components/header.html
@@ -13,41 +13,5 @@
     </div>
     {{ end }}
 
-    {{ $i := .Params.image }}
-    {{ $context := . }}
-    <div class="article-details">
-        {{ with $categories := .Params.categories }}
-        <header class="article-category">
-            {{ range $categories }}
-                {{ if $i }}
-                    {{- $image := partial "helper/image" $context | resources.Fingerprint "md5"  -}}
-                    {{- $20x := $image.Fill "20x20 smart"  -}}
-                    <a href="/categories/{{ . | urlize }}" class="color-tag"
-                        data-image="{{ $20x.RelPermalink }}" data-id="{{ $context.Slug }}" data-key="{{ $image.Data.Integrity }}">{{ . | humanize }}</a>
-                {{ else }}
-                    <a href="/categories/{{ . | urlize }}">{{ . | humanize }}</a>
-                {{ end }}
-            {{ end }}
-        </header>
-        {{ end }}
-
-        <h2 class="article-title">
-            <a href="{{ .Permalink }}">
-                {{- .Title -}}
-            </a>
-        </h2>
-
-        {{ with .Params.description }}
-        <h3 class="article-subtitle">
-            {{ . }}
-        </h3>
-        {{ end }}
-
-        <footer class="article-time">
-            {{ (resources.Get "icons/clock.svg").Content | safeHTML }}
-            <time datetime='{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}'>
-                {{- .Date.Format ( or .Site.Params.dateFormat "Jan 02, 2006" ) -}}
-            </time>
-        </footer>
-    </div>
+    {{ partial "article/components/details" . }}
 </header>
\ No newline at end of file