From f52ff6f27d621544b9a30a03f15bc40858491336 Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Wed, 1 Sep 2021 22:36:56 +0800
Subject: [PATCH 01/10] add pic grid and basic pure css support

---
 hugo-theme-moments.code-workspace |  11 ++
 layouts/index.html                |   2 +-
 layouts/partials/head.html        |   7 +-
 layouts/partials/pic_set.html     |  42 +++----
 layouts/partials/row.html         | 180 ++++++++++++++++--------------
 static/css/style.css              |  32 ++++--
 6 files changed, 150 insertions(+), 124 deletions(-)
 create mode 100644 hugo-theme-moments.code-workspace

diff --git a/hugo-theme-moments.code-workspace b/hugo-theme-moments.code-workspace
new file mode 100644
index 0000000..496c341
--- /dev/null
+++ b/hugo-theme-moments.code-workspace
@@ -0,0 +1,11 @@
+{
+	"folders": [
+		{
+			"path": "../.."
+		},
+		{
+			"path": "."
+		}
+	],
+	"settings": {}
+}
\ No newline at end of file
diff --git a/layouts/index.html b/layouts/index.html
index 090f7d0..c7fad02 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,5 +1,5 @@
 {{ define "main" }}
-    <div class="container bodycontainer">
+    <div class="container">
         {{ $paginator := .Paginate ((where .Site.RegularPages "Section" "moments").ByParam "top") }}
         {{ range $paginator.Pages }}
             {{ partial "row.html" . }}
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 3a89563..c0c8935 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -1,9 +1,9 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
-<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
+<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
-<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
+<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> -->
 
 <!-- 点赞 -->
 <link href="https://cdn.bootcss.com/font-awesome/5.8.2/css/all.min.css" rel="stylesheet">
@@ -34,5 +34,8 @@
 <!-- fancybox css (js in the end before the body closing tag) -->
 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui/dist/fancybox.css"/>
 
+<!-- pure.css -->
+<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/pure-min.css">
+
 <!-- website title -->
 <title>{{ .Site.Params.title }}</title>
\ No newline at end of file
diff --git a/layouts/partials/pic_set.html b/layouts/partials/pic_set.html
index 21ca548..7318a2b 100644
--- a/layouts/partials/pic_set.html
+++ b/layouts/partials/pic_set.html
@@ -1,33 +1,17 @@
 <!-- START -->
-<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
-    <ol class="carousel-indicators">
-        {{range $num,$a := .pic_set}}
-            {{if eq $num 0 }}
-        <li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
-            {{ else }}
-        <li data-target="#carouselExampleIndicators" data-slide-to="{{$num}}"></li>
-            {{ end }}
-        {{end}}
-    </ol>
-    <div class="carousel-inner">
-        {{range $num,$a := .pic_set}}
-        {{if eq $num 0 }}
-        <div class="carousel-item active">
-            <img src="{{$a}}" class="d-block w-100 pic-in-set" alt="{{add $num 1}}" data-fancybox="gallery">
+<div class="pic-grid">
+    <!-- todo change display style for 2 * 2 -->
+    <div class="pure-g">
+        {{ range $num, $a := .pic_set }}
+        <div class="pure-u-1-3">
+            <div class="add-padding">
+                <div class="img-container">
+                    <a data-src="{{ $a }}" data-fancybox="gallery">
+                        <img src="{{ $a }}" alt="pictures"/>
+                    </a>
+                </div>
+            </div>
         </div>
-        {{else}}
-        <div class="carousel-item">
-            <img src="{{$a}}" class="d-block w-100 pic-in-set" alt="{{add $num 1}}" data-fancybox="gallery">
-        </div>
-        {{end}}
-        {{end}}
+        {{ end }}
     </div>
-    <a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
-        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
-        <span class="sr-only">Previous</span>
-    </a>
-    <a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
-        <span class="carousel-control-next-icon" aria-hidden="true"></span>
-        <span class="sr-only">Next</span>
-    </a>
 </div>
\ No newline at end of file
diff --git a/layouts/partials/row.html b/layouts/partials/row.html
index 19c93a0..40de635 100644
--- a/layouts/partials/row.html
+++ b/layouts/partials/row.html
@@ -1,94 +1,106 @@
-<div class="row">
-    <!-- 时间 -->
-    <div class="col-sm-4 time">
-        <h2>{{ .Date.Format "Jan 2"}}{{ if in (slice 1 21 31) .Date.Day}}st{{ else if in (slice 2 22) .Date.Day}}nd{{ else if in (slice 3 23) .Date.Day}}rd{{ else }}th{{ end }}</h2>
-        <h4>{{ .Date.Format "2006"}}</h4>
-    </div>
+<div class="moment-row">
 
-    <!-- 正文 -->
-    <div class="col-sm-8">
-        <!-- 置顶标签 -->
-        {{ if gt .Params.top 0}}
-        <div class="top-mark" style="position: absolute; right: 5%;">
-            <i class="fas fa-bookmark" style="color: #e76b4f;"></i>
+    <div class="pure-g">
+        <!-- 时间 -->
+        <!-- <div class="pure-u-1 pure-u-sm-1-3"> -->
+        <div class="pure-u-1-3">
+            <div class="time">
+                <h2>{{ .Date.Format "Jan 2"}}{{ if in (slice 1 21 31) .Date.Day}}st{{ else if in (slice 2 22)
+                    .Date.Day}}nd{{ else if in (slice 3 23) .Date.Day}}rd{{ else }}th{{ end }}</h2>
+                <h4>{{ .Date.Format "2006"}}</h4>
+            </div>
         </div>
-        {{ end }}
 
-        <!-- 抬头 -->
-        <!-- 头像前面margin2px -->
-        <div style="margin-top: 2px;">
-            {{ with .Params.avatar }}
-                <img src='{{ . }}' class="avatar">
-            {{ else }}
-                <!-- fixme check whether the default avatar path is url or not-->
-                <img src='{{ $.Site.BaseURL }}/{{ .Site.Params.avatar }}' class="avatar">
-            {{ end }}
-            <div class="intro">
-                {{ with .Params.name }}
-                    <h4 class="text-primary name">{{ . }}</h4>
-                {{ else }}
-                    <h4 class="text-primary name">{{ .Site.Params.name }}</h4>
-                {{ end }}
-                <div>
-                    {{ $tags_filtered := slice}}
-                    {{ with .Params.tags }}
-                        {{ range . }}
-                            {{ with .}}
-                                {{ $tags_filtered = $tags_filtered | append . }}
-                            {{ end }}
-                        {{ end }}
-                    {{ end }}
-                    {{ with $tags_filtered }}
-                    {{ range . }}<span class="tag text-muted">{{ . }}</span>{{ end }}
-                    {{ end }}
+        <!-- 正文 -->
+        <!-- <div class="pure-u-1 pure-u-sm-1-3"> -->
+        <div class="pure-u-2-3">
+            <div class="moment-content">
+                <!-- 置顶标签 -->
+                {{ if gt .Params.top 0}}
+                <div class="top-mark" style="position: absolute; right: 5%;">
+                    <i class="fas fa-bookmark" style="color: #e76b4f;"></i>
                 </div>
-            </div>
-        </div>
-        <!-- 抬头后面内容右平移5px，与头像兼容显得自然 -->
-        <div style="padding-left: 5px; padding-right: 5px;">
-            <!-- 文字 -->
-            <div class="context">
-                {{ .Content }}    
-            </div>
-
-            <!-- 图片 -->
-            {{ with .Params.pic }}
-                <img src="{{ . }}" class="img-fluid pic1" alt="Responsive image" data-fancybox="gallery"></img>
-            {{ end }}
-
-            <!-- 图片集  -->
-            {{ $pic_set_filtered := slice}}
-            {{ with .Params.pic_set }}
-                {{ range . }}
-                    {{ with .}}
-                        {{ $pic_set_filtered = $pic_set_filtered | append . }}
-                    {{ end }}
                 {{ end }}
-            {{ end }}
-            
-            {{ with $pic_set_filtered }}
-                {{ partial "pic_set.html" (dict "pic_set" .) }}
-            {{ end }}
-            
-            <!-- todo format the name of this part -->
-            <!-- add-on info 3: link -->
-            {{ $link_link := .Params.link }}
-            {{ $link_logo := .Params.link_logo }}
-            {{ $link_text := .Params.link_text }}
-            
-            {{ with .Params.link }}
-                {{ partial "link-block.html" (dict "logo" $link_logo "a" $link_link "word" $link_text "baseurl" $.Site.BaseURL)}}
-            {{ end }}
 
-            <!-- 附注信息 -->
-            <div>
-                <p class="text-black-50 note">
-                    {{ .Date.Format "15:04" }} {{ .Params.note }}
-                </p>
-                <i class="far fa-heart" style="float: right; margin-right: 5px; color:#808080"></i>
+                <!-- 抬头 -->
+                <!-- 头像前面margin2px -->
+                <div style="margin-top: 2px;">
+                    {{ with .Params.avatar }}
+                    <img src='{{ . }}' class="avatar">
+                    {{ else }}
+                    <!-- fixme check whether the default avatar path is url or not-->
+                    <img src='{{ $.Site.BaseURL }}/{{ .Site.Params.avatar }}' class="avatar">
+                    {{ end }}
+                    <div class="intro">
+                        {{ with .Params.name }}
+                        <h4 class="text-primary name">{{ . }}</h4>
+                        {{ else }}
+                        <h4 class="text-primary name">{{ .Site.Params.name }}</h4>
+                        {{ end }}
+                        <div>
+                            {{ $tags_filtered := slice}}
+                            {{ with .Params.tags }}
+                            {{ range . }}
+                            {{ with .}}
+                            {{ $tags_filtered = $tags_filtered | append . }}
+                            {{ end }}
+                            {{ end }}
+                            {{ end }}
+                            {{ with $tags_filtered }}
+                            {{ range . }}<span class="tag text-muted">{{ . }}</span>{{ end }}
+                            {{ end }}
+                        </div>
+                    </div>
+                </div>
+                <!-- 抬头后面内容右平移5px，与头像兼容显得自然 -->
+                <div style="padding-left: 5px; padding-right: 5px;">
+                    <!-- 文字 -->
+                    <div class="context">
+                        {{ .Content }}
+                    </div>
+
+                    <!-- 图片 -->
+                    {{ with .Params.pic }}
+                    <img src="{{ . }}" class="img-fluid pic1" alt="Responsive image" data-fancybox="gallery"></img>
+                    {{ end }}
+
+                    <!-- 图片集  -->
+                    {{ $pic_set_filtered := slice}}
+                    {{ with .Params.pic_set }}
+                    {{ range . }}
+                    {{ with .}}
+                    {{ $pic_set_filtered = $pic_set_filtered | append . }}
+                    {{ end }}
+                    {{ end }}
+                    {{ end }}
+
+                    {{ with $pic_set_filtered }}
+                    {{ partial "pic_set.html" (dict "pic_set" .) }}
+                    {{ end }}
+
+                    <!-- todo format the name of this part -->
+                    <!-- add-on info 3: link -->
+                    {{ $link_link := .Params.link }}
+                    {{ $link_logo := .Params.link_logo }}
+                    {{ $link_text := .Params.link_text }}
+
+                    {{ with .Params.link }}
+                    {{ partial "link-block.html" (dict "logo" $link_logo "a" $link_link "word" $link_text "baseurl"
+                    $.Site.BaseURL)}}
+                    {{ end }}
+
+                    <!-- 附注信息 -->
+                    <div>
+                        <p class="text-black-50 note">
+                            {{ .Date.Format "15:04" }} {{ .Params.note }}
+                        </p>
+                        <i class="far fa-heart" style="float: right; margin-right: 5px; color:#808080"></i>
+                    </div>
+                </div>
+                <!-- 分隔线 -->
+                <hr style="clear: both">
             </div>
         </div>
-        <!-- 分隔线 -->
-        <hr style="clear: both">
     </div>
+
 </div>
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index 2321276..5776418 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -14,11 +14,14 @@ body{
     }
 }
 
-.bodycontainer{
+.container{
     max-width: 760px;
-    /* padding-right: 80px; */
+    margin: auto;
 }
 
+.moment-content{
+    position: relative;
+}
 /* 时间 */
 .time{
     text-align: right;
@@ -78,14 +81,27 @@ body{
     margin-top: 5px; 
 }
 /* 图片集 */
-#carouselExampleIndicators{
-    width: 80%; 
-    padding-bottom:10px;
-    margin-top: 5px;
+.pic-grid{
+    max-width: 80%;
 }
 
-.pic-in-set{
-    height: 250px;
+.pic-grid .img-container{
+    padding-top: 50%;
+    padding-bottom: 50%;
+    position: relative;
+    height: 0px;
+}
+
+.pic-grid img{
+    object-fit: cover;
+    height: 100%;
+    width: 100%;
+    position: absolute;
+    top: 0
+}
+
+.pic-grid .add-padding{
+    padding: 2.5px;
 }
 
 /* 内容附带的超链接 */

From 45abd1c519450bf92731cd84d66bcfa3f7c49545 Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Wed, 1 Sep 2021 23:01:44 +0800
Subject: [PATCH 02/10] fix responsive grid bug

---
 layouts/partials/head.html | 4 +++-
 layouts/partials/row.html  | 6 ++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index c0c8935..29b65ce 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -35,7 +35,9 @@
 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui/dist/fancybox.css"/>
 
 <!-- pure.css -->
-<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/pure-min.css">
+<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/base-min.css">
+<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/grids-min.css">
+<link rel="stylesheet" href="https://unpkg.com/purecss@2.0.6/build/grids-responsive-min.css">
 
 <!-- website title -->
 <title>{{ .Site.Params.title }}</title>
\ No newline at end of file
diff --git a/layouts/partials/row.html b/layouts/partials/row.html
index 40de635..54e40db 100644
--- a/layouts/partials/row.html
+++ b/layouts/partials/row.html
@@ -2,8 +2,7 @@
 
     <div class="pure-g">
         <!-- 时间 -->
-        <!-- <div class="pure-u-1 pure-u-sm-1-3"> -->
-        <div class="pure-u-1-3">
+        <div class="pure-u-1 pure-u-sm-1-3">
             <div class="time">
                 <h2>{{ .Date.Format "Jan 2"}}{{ if in (slice 1 21 31) .Date.Day}}st{{ else if in (slice 2 22)
                     .Date.Day}}nd{{ else if in (slice 3 23) .Date.Day}}rd{{ else }}th{{ end }}</h2>
@@ -12,8 +11,7 @@
         </div>
 
         <!-- 正文 -->
-        <!-- <div class="pure-u-1 pure-u-sm-1-3"> -->
-        <div class="pure-u-2-3">
+        <div class="pure-u-1 pure-u-sm-2-3">
             <div class="moment-content">
                 <!-- 置顶标签 -->
                 {{ if gt .Params.top 0}}

From b7e6c0cd397382f396d905c8880922c938f4464c Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Wed, 1 Sep 2021 23:49:09 +0800
Subject: [PATCH 03/10] add some styles

---
 layouts/partials/head.html |  6 ++++--
 layouts/partials/row.html  | 34 +++++++++++++++---------------
 static/css/style.css       | 43 ++++++++++++++++++++++++++++++++++----
 3 files changed, 60 insertions(+), 23 deletions(-)

diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 29b65ce..4a0b838 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -1,9 +1,11 @@
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
+    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> -->
+
+<!-- todo change jquery -->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
-<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
-<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script> -->
 
 <!-- 点赞 -->
 <link href="https://cdn.bootcss.com/font-awesome/5.8.2/css/all.min.css" rel="stylesheet">
diff --git a/layouts/partials/row.html b/layouts/partials/row.html
index 54e40db..78af075 100644
--- a/layouts/partials/row.html
+++ b/layouts/partials/row.html
@@ -4,9 +4,9 @@
         <!-- 时间 -->
         <div class="pure-u-1 pure-u-sm-1-3">
             <div class="time">
-                <h2>{{ .Date.Format "Jan 2"}}{{ if in (slice 1 21 31) .Date.Day}}st{{ else if in (slice 2 22)
-                    .Date.Day}}nd{{ else if in (slice 3 23) .Date.Day}}rd{{ else }}th{{ end }}</h2>
-                <h4>{{ .Date.Format "2006"}}</h4>
+                <div class="month-day">{{ .Date.Format "Jan 2"}}{{ if in (slice 1 21 31) .Date.Day}}st{{ else if in (slice 2 22)
+                    .Date.Day}}nd{{ else if in (slice 3 23) .Date.Day}}rd{{ else }}th{{ end }}</div>
+                <div class="year">{{ .Date.Format "2006"}}</div>
             </div>
         </div>
 
@@ -22,18 +22,20 @@
 
                 <!-- 抬头 -->
                 <!-- 头像前面margin2px -->
-                <div style="margin-top: 2px;">
-                    {{ with .Params.avatar }}
-                    <img src='{{ . }}' class="avatar">
-                    {{ else }}
-                    <!-- fixme check whether the default avatar path is url or not-->
-                    <img src='{{ $.Site.BaseURL }}/{{ .Site.Params.avatar }}' class="avatar">
-                    {{ end }}
+                <div style="margin-top: 2px;" class="user-info">
+                    <div class="avatar-block">
+                        {{ with .Params.avatar }}
+                        <img src='{{ . }}' class="avatar">
+                        {{ else }}
+                        <!-- fixme check whether the default avatar path is url or not-->
+                        <img src='{{ $.Site.BaseURL }}/{{ .Site.Params.avatar }}' class="avatar">
+                        {{ end }}
+                    </div>
                     <div class="intro">
                         {{ with .Params.name }}
-                        <h4 class="text-primary name">{{ . }}</h4>
+                        <div class="name">{{ . }}</div>
                         {{ else }}
-                        <h4 class="text-primary name">{{ .Site.Params.name }}</h4>
+                        <div class="name">{{ .Site.Params.name }}</div>
                         {{ end }}
                         <div>
                             {{ $tags_filtered := slice}}
@@ -88,11 +90,9 @@
                     {{ end }}
 
                     <!-- 附注信息 -->
-                    <div>
-                        <p class="text-black-50 note">
-                            {{ .Date.Format "15:04" }} {{ .Params.note }}
-                        </p>
-                        <i class="far fa-heart" style="float: right; margin-right: 5px; color:#808080"></i>
+                    <div class="moment-note">
+                        <p class="note">{{ .Date.Format "15:04" }} {{ .Params.note }}</p>
+                        <div style="padding-right: 12px;"><i class="far fa-heart"></i></div>
                     </div>
                 </div>
                 <!-- 分隔线 -->
diff --git a/static/css/style.css b/static/css/style.css
index 5776418..c7e6f04 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -2,6 +2,13 @@
 body{
     background-color: #f5f5f5;
 }
+
+.jumbotron{
+    padding-top: 64px;
+    padding-bottom: 64px;
+    margin-bottom: 32px;
+}
+
 .page{
     max-width: 1150px;
     margin: auto;
@@ -19,9 +26,10 @@ body{
     margin: auto;
 }
 
-.moment-content{
+.moment-content {
     position: relative;
 }
+
 /* 时间 */
 .time{
     text-align: right;
@@ -41,6 +49,11 @@ body{
 }
 
 /* 抬头 */
+
+.user-info{
+    display: flex;
+}
+
 .avatar{
     max-height: 45px;
     float: left;
@@ -56,6 +69,7 @@ body{
     color:#186D9C!important;
     margin-bottom: 0;
     line-height: 1.1;
+    font-size: 24px;
 }
 
 .tag::before{
@@ -65,6 +79,7 @@ body{
     font-size: 80%;
     margin-left: 0px;
     margin-right: 10px;
+    color: #6c757d!important;
 }
 
 /* 正文 */
@@ -125,11 +140,31 @@ body{
 }
 
 /* 附注信息 */
-.note{
+.moment-note{
+    display: flex;
+    margin-bottom: 10px;
+    justify-content: space-between;
+}
+
+.moment-note .note{
     font-size: 80%;
     text-indent: 20px;
-    float: left;
-    margin-bottom: 10px;
+    color: rgb(0, 0, 0, 0.5);
+
+    margin-top: 0;
+    margin-bottom: 0;
+}
+
+.moment-note{
+    margin-right: 5px; 
+    color:#808080
+}
+
+/* hr */
+hr {
+    border-width: 0;
+    border-top: 1px solid;
+    border-color: rgb(0, 0, 0, 0.1);
 }
 
 /* footer底注 */

From 9d41748d8a8e50f08a310631d96b87398a27f55a Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Thu, 2 Sep 2021 10:59:57 +0800
Subject: [PATCH 04/10] add footer style

---
 layouts/partials/footer.html |  8 +++-----
 static/css/style.css         | 11 +++++------
 2 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index f1b14c4..361a026 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,5 +1,3 @@
-<footer class="footer mt-auto py-3">
-    <div class="container footcontainer">
-        <div class="text-muted">Powered by <a href="https://www.hugo.io">Hugo</a> | Theme <a href="https://github.com/FarseaSH/hugo-theme-moments">Moments</a></div>
-    </div>
-</footer>
\ No newline at end of file
+<div class="footer">
+Powered by <a href="https://www.hugo.io">Hugo</a> | Theme <a href="https://github.com/FarseaSH/hugo-theme-moments">Moments</a>
+</div>
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index c7e6f04..880f557 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -169,17 +169,16 @@ hr {
 
 /* footer底注 */
 .footer {
+    padding-top: 20px;
+    padding-bottom: 30px;
     background-color: #f5f5f5;
+    
+    color: #6c757d !important;
     text-align: center;
     font-size: 95%;
 }
-.footcontainer {
-    width: auto;
-    padding-right: 15px;
-    padding-left: 15px;
-}
 
-.footcontainer a{ 
+.footer a{ 
     text-decoration: underline !important; 
     color:#6c757d !important;
 } 

From 400930fcafa3158fd215fe456549333373a589c0 Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Thu, 2 Sep 2021 11:03:10 +0800
Subject: [PATCH 05/10] delete code-workspace file

---
 hugo-theme-moments.code-workspace | 11 -----------
 1 file changed, 11 deletions(-)
 delete mode 100644 hugo-theme-moments.code-workspace

diff --git a/hugo-theme-moments.code-workspace b/hugo-theme-moments.code-workspace
deleted file mode 100644
index 496c341..0000000
--- a/hugo-theme-moments.code-workspace
+++ /dev/null
@@ -1,11 +0,0 @@
-{
-	"folders": [
-		{
-			"path": "../.."
-		},
-		{
-			"path": "."
-		}
-	],
-	"settings": {}
-}
\ No newline at end of file

From 3caa632994e7009fa780414925081acf267c4067 Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Thu, 2 Sep 2021 11:32:49 +0800
Subject: [PATCH 06/10] add simple font paragraph style

---
 static/css/style.css | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/static/css/style.css b/static/css/style.css
index 880f557..5288793 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -3,6 +3,17 @@ body{
     background-color: #f5f5f5;
 }
 
+.pure-g [class*=pure-u]{
+    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" !important;
+    font-weight: normal;
+    font-size: 16px;
+    line-height: 24px;
+}
+
+p{
+    margin-top: 0;
+}
+
 .jumbotron{
     padding-top: 64px;
     padding-bottom: 64px;

From d1bf0b5d0c95dce7bf32b0b66be4d637b3e6b8b7 Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Thu, 2 Sep 2021 11:43:12 +0800
Subject: [PATCH 07/10] cover style added

---
 layouts/partials/header.html |  4 ++--
 static/css/style.css         | 18 ++++++++++++++++--
 2 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 01b186d..ae12357 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,7 +1,7 @@
 <div class="jumbotron jumbotron-fluid" style="background-image: url({{ .Site.Params.cover }});
             background-position: center center;background-size: cover; min-height: 200px; text-align: center">
     <div class="container">
-        <h1 class="display-4 text-secondary">{{ .Site.Params.title }}</h1>
-        <p class="lead text-black-50">{{ .Site.Params.signature }}</p>
+        <div class="site-title">{{ .Site.Params.title }}</div>
+        <p class="signature">{{ .Site.Params.signature }}</p>
     </div>
 </div>
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index 5288793..15e9ee9 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -14,12 +14,26 @@ p{
     margin-top: 0;
 }
 
+/* START - top cover part */
 .jumbotron{
     padding-top: 64px;
-    padding-bottom: 64px;
-    margin-bottom: 32px;
 }
 
+.site-title{
+    color: rgb(108, 117, 125);
+    font-size: 56px;
+    font-weight: 300;
+    margin-bottom: 20px;
+}
+
+.signature{
+    color: rgb(0, 0, 0, 0.5);
+    font-size: 20px;
+    font-weight: 300;
+}
+
+/* END - top cover part */
+
 .page{
     max-width: 1150px;
     margin: auto;

From 3d1a633b7054f67a7508ca6d963492e5964e4011 Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Thu, 2 Sep 2021 12:00:53 +0800
Subject: [PATCH 08/10] minor optimize

---
 layouts/partials/row.html |  3 +--
 static/css/style.css      | 13 ++++++++++++-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/layouts/partials/row.html b/layouts/partials/row.html
index 78af075..8c4f88d 100644
--- a/layouts/partials/row.html
+++ b/layouts/partials/row.html
@@ -21,8 +21,7 @@
                 {{ end }}
 
                 <!-- 抬头 -->
-                <!-- 头像前面margin2px -->
-                <div style="margin-top: 2px;" class="user-info">
+                <div class="user-info">
                     <div class="avatar-block">
                         {{ with .Params.avatar }}
                         <img src='{{ . }}' class="avatar">
diff --git a/static/css/style.css b/static/css/style.css
index 15e9ee9..479eb4f 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -8,6 +8,7 @@ body{
     font-weight: normal;
     font-size: 16px;
     line-height: 24px;
+    color: rgb(33, 37, 41);
 }
 
 p{
@@ -55,11 +56,12 @@ p{
     position: relative;
 }
 
-/* 时间 */
+/* START - time */
 .time{
     text-align: right;
     padding-right: 60px;
     /* white-space: nowrap; */
+    font-weight: 300;
 }
 @media (max-width: 576px){
     .time{
@@ -72,6 +74,15 @@ p{
         padding-right: 20px;
     }
 }
+.time .month-day{
+    font-size: 24px;
+    margin-bottom: 10px;
+}
+.time .year{
+    font-size: 16px;
+}
+
+/* END - time */
 
 /* 抬头 */
 

From 4dfeb932024b09772a067e65d0f46f9dbf30b896 Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Thu, 2 Sep 2021 12:45:58 +0800
Subject: [PATCH 09/10] add pagination style

---
 layouts/_default/baseof.html |  8 +++----
 layouts/index.html           | 25 +++++++++------------
 static/css/style.css         | 43 ++++++++++++++++++++++++++++++++++++
 3 files changed, 58 insertions(+), 18 deletions(-)

diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html
index ac41f1a..f9ee8a3 100644
--- a/layouts/_default/baseof.html
+++ b/layouts/_default/baseof.html
@@ -11,12 +11,12 @@
             {{ end }}
         
             <!-- Pagination -->
-            <nav aria-label="Page navigation .pagination-lg">
-                <ul class="pagination justify-content-center">
+            <div class="center">
+                <div class="pagination">
                     {{ block "pagination" . }}
                     {{ end }}
-                </ul>
-            </nav>
+                </div>
+            </div>
 
             {{ partial "footer.html" . }}
         </div>
diff --git a/layouts/index.html b/layouts/index.html
index c7fad02..08f7148 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -11,31 +11,28 @@
 {{ define "pagination" }}
     {{ $paginator := .Paginate ((where .Site.RegularPages "Section" "moments").ByParam "top") }}
     {{ if $paginator.HasPrev }}
-    <li class="page-item">
-        <a class="page-link" href="{{$.Site.BaseURL}}/{{sub $paginator.PageNumber 1 }}" tabindex="-1">Previous</a>
-    </li>
+    
+    <a class="page-link" href="{{$.Site.BaseURL}}/{{sub $paginator.PageNumber 1 }}">
+        <div class="page-item">Previous</div>
+    </a>
     {{ else }}
-    <li class="page-item disabled">
-        <a class="page-link" href="{{$.Site.BaseURL}}/{{sub $paginator.PageNumber 1 }}" tabindex="-1">Previous</a>
-    </li>
+        <div class="page-item disabled">Previous</div>
     {{ end }}
 
     {{ $current_num := $paginator.PageNumber }}
     {{ range (seq 1 $paginator.TotalPages) }}
         {{ if (eq $current_num .)}}
-            <li class="page-item active"><a class="page-link" href="{{$.Site.BaseURL}}/{{.}}">{{.}}</a></li>
+        <div class="page-item active">{{.}}</div>
         {{ else }}
-            <li class="page-item"><a class="page-link" href="{{$.Site.BaseURL}}/{{.}}">{{.}}</a></li>
+        <a class="page-link" href="{{$.Site.BaseURL}}/{{.}}"><div class="page-item">{{.}}</div></a>
         {{ end }}
     {{end}}
 
     {{ if $paginator.HasNext }}
-    <li class="page-item">
-        <a class="page-link" href="{{$.Site.BaseURL}}/{{ add $paginator.PageNumber 1 }}">Next</a>
-    </li>
+    <a class="page-link" href="{{$.Site.BaseURL}}/{{ add $paginator.PageNumber 1 }}">
+        <div class="page-item">Next</div>
+    </a>
     {{ else }}
-    <li class="page-item disabled">
-        <a class="page-link" href="{{$.Site.BaseURL}}/{{ add $paginator.PageNumber 1 }}">Next</a>
-    </li>
+        <div class="page-item disabled">Next</div>
     {{ end }}
 {{ end }}
\ No newline at end of file
diff --git a/static/css/style.css b/static/css/style.css
index 479eb4f..105cfd7 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -35,6 +35,49 @@ p{
 
 /* END - top cover part */
 
+/* START - pagination */
+.center{
+    display: flex;
+    justify-content: center;
+}
+
+.pagination{
+    display: flex;
+    margin-top: 20px;
+    margin-bottom: 30px;
+}
+
+.pagination a{
+    color: #337cf6;
+    text-decoration: none;
+}
+
+.page-item{
+    border: #80808050;
+    border-style: solid;
+    border-width: 0.5px;
+    border-radius: 2%;
+    padding-left: 10px;
+    padding-right: 10px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+}
+
+.page-link .page-item:hover{
+    background-color: #eaecef;
+    color: #2157ad;
+}
+
+.page-item.active{
+    background-color: #337cf6;
+    color: #ffffff;
+}
+
+.page-item.disabled{
+    color:rgb(108, 117, 125)
+}
+/* END - pagination */
+
 .page{
     max-width: 1150px;
     margin: auto;

From ac83d60ba93e39415032ee407f7e78c9d90131cf Mon Sep 17 00:00:00 2001
From: FarseaSH <yy_shao@outlook.com>
Date: Thu, 2 Sep 2021 12:52:28 +0800
Subject: [PATCH 10/10] add padding to tags

---
 static/css/style.css | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/static/css/style.css b/static/css/style.css
index 105cfd7..ec23899 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -152,7 +152,8 @@ p{
 }
 
 .tag::before{
-    content:"#"
+    content:"#";
+    padding-right: 1px;
 }
 .tag{
     font-size: 80%;