From a3cb5a359b0bec758bcae92e2a9586426e2619e0 Mon Sep 17 00:00:00 2001
From: mivinci <1366723936@qq.com>
Date: Thu, 9 Sep 2021 15:56:22 +0800
Subject: [PATCH] refactor header

---
 assets/sass/atom.scss           | 20 ++++++++++++++++++++
 assets/sass/main.scss           | 15 +++++++++++----
 layouts/_default/list.html      | 25 +++++++++++--------------
 layouts/_default/single.html    | 23 ++++++++++++++++-------
 layouts/index.html              | 11 ++++-------
 layouts/partials/footer.html    |  6 +++---
 layouts/partials/header.html    | 18 ++++++++----------
 layouts/partials/list.html      |  4 ++++
 layouts/partials/paginator.html |  2 +-
 layouts/partials/toc.html       |  2 +-
 10 files changed, 79 insertions(+), 47 deletions(-)
 create mode 100644 layouts/partials/list.html

diff --git a/assets/sass/atom.scss b/assets/sass/atom.scss
index 11d6655..8059163 100644
--- a/assets/sass/atom.scss
+++ b/assets/sass/atom.scss
@@ -1,6 +1,8 @@
 * {
   line-height: 1;
   -webkit-tap-highlight-color: rgba(0,0,0,0);
+  user-select: none;
+  outline: none;
 }
 
 $unit: 0.25rem;
@@ -80,6 +82,18 @@ $screens: (
   .#{$prefix}text-sm {
     font-size: .9rem;
   }
+  .#{$prefix}text-md {
+    font-size: 1.25rem;
+  }
+  .#{$prefix}text-xl {
+    font-size: 1.5rem;
+  }
+  .#{$prefix}text-2xl {
+    font-size: 1.75rem;
+  }
+  .#{$prefix}text-3xl {
+    font-size: 2rem;
+  }
   .#{$prefix}text-4xl {
     font-size: 2.25rem;
   }
@@ -117,3 +131,9 @@ $screens: (
 .cursor-pointer {
   cursor: pointer;
 }
+
+.not-first\:ml-3 {
+  &:not(:first-child) {
+    margin-left: 0.75rem;
+  }
+}
\ No newline at end of file
diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index 82a55fd..86d2b4e 100644
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -44,6 +44,7 @@ h4,
 h5 {
   font-family: "Noto Serif SC", 'Times New Roman', Times, sans-serif;
   font-weight: 700;
+  line-height: 1.5;
 }
 
 p {
@@ -62,6 +63,7 @@ code {
   font-size: 13px;
 }
 
+.tag,
 p code {
   background-color: var(--bd);
   padding: 0.2em 0.4em;
@@ -70,9 +72,14 @@ p code {
 
 a {
   text-decoration: none;
+  color: inherit;
 }
 
-a:not(.icon) {
+a:hover {
+  color: var(--pm);
+}
+
+main a:not(.icon) {
   color: inherit;
   text-decoration: underline;
   text-decoration-color: var(--pm);
@@ -81,13 +88,13 @@ a:not(.icon) {
   transition: background-position 0.2s ease-in-out;
 }
 
-a:not(.icon):hover,
-a:not(.icon):focus {
+main a:not(.icon):hover,
+main a:not(.icon):focus {
   background-position: 0 100%;
   color: #fff;
 }
 
-a.icon:hover {
+main a.icon:hover {
   transform: translateY(-5px);
   transition: transform 0.3s ease-in-out;
 }
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 925aa43..c4ca39c 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,17 +1,14 @@
 {{ define "main" }}
-	<main>
-		{{ if isset .Data "Term" }}
-			<h2>{{ .Data.Singular | title }} - "{{ .Data.Term }}"</h2>
-		{{ else }}
-			
+<main>
+	{{ if isset .Data "Term" }}
+	<h2 class="my-8">{{ .Data.Singular | title }} - "{{ .Data.Term }}"</h2>
+	{{ else }}
+	<h2 class="my-8">{{ .Title }}</h2>
+	{{ end }}
+	<div class="mt-8">
+		{{ range .Data.Pages }}
+		{{ partial "list.html" . }}
 		{{ end }}
-		<div>
-			{{ range .Data.Pages }}
-				<div class="flex sm:flex-col my-5 sm:mb-6 sm:mt-3">
-					<div class="min-w-32 sm:mb-2">{{ dateFormat .Site.Params.timeformat .Date }}</div>
-					<a href="{{ .RelPermalink }}">{{ .Title }}</a>
-				</div>
-			{{ end }}
-		</div>
-	</main>
+	</div>
+</main>
 {{ end }}
\ No newline at end of file
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 15995a1..663b5d8 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,18 +1,27 @@
 {{ define "main" }}
-<main>
-	<h1 class="my-6">{{ .Title }}</h1>
-	<div class="mb-3 text-xs">
+{{ if .Params.toc }}
+{{ partial "toc.html" . }}
+{{ end }}
+<h1 class="mt-8 mb-6">{{ .Title }}</h1>
+<div class="mb-3 text-xs flex justify-between sm:flex-col">
+	<div>
 		Posted at &mdash; {{ dateFormat .Site.Params.timeformat .Date }}
 		{{ if .Draft }}
-		<span class="ml-1">
+		<span class="ml-3 tag">
 			DRAFT
 		</span>
 		{{ end }}
 	</div>
-	<p>{{ .Description | markdownify | safeHTML }}</p>
-	{{ if .Params.toc }}
-	{{ partial "toc.html" . }}
+	{{ if .Params.tags }}
+	<div class="sm:mt-4">
+		{{ range .Params.tags }}
+		<a class="not-first:ml-3" href="/tags/{{ . }}">#{{ . }}</a>
+		{{ end }}
+	</div>
 	{{ end }}
+</div>
+<main>
+	<p>{{ .Description | markdownify | safeHTML }}</p>
 	<article class="md">
 		{{ .Content }}
 	</article>
diff --git a/layouts/index.html b/layouts/index.html
index 0ecfcec..8e25ef6 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,20 +1,17 @@
 {{ define "main" }}
 	<main>
-		<h2 class="mt-5 mb-1">{{ .Site.Params.iam }} {{ .Site.Author.name }}</h2>
+		<h2 class="mt-8 mb-1">{{ .Site.Params.iam }} {{ .Site.Author.name }}</h2>
 		<p class="my-0">{{ .Site.Author.slogon }}</p>
 		<p class="my-3">{{ .Site.Author.description | markdownify | safeHTML }}</p>
 		{{ if eq .Paginator.PageNumber 1 }}
-		<h3 class="my-5">Recent Posts</h3>
+		<h3 class="my-6">Recent Posts</h3>
 		{{ else }}
-		<h3 class="my-5">Older Posts</h3>
+		<h3 class="my-6">Older Posts</h3>
 		{{ end }}
 		<div>
 			{{ $paginator := .Paginate (where .Site.RegularPages "Kind" "page") }}
 			{{ range $paginator.Pages }}
-				<div class="flex sm:flex-col my-5 sm:mb-6 sm:mt-3">
-					<div class="min-w-32 sm:mb-2">{{ dateFormat .Site.Params.timeformat .Date }}</div>
-					<a class="self-start" href="{{ .RelPermalink }}">{{ .Title }}</a>
-				</div>
+			{{ partial "list.html" . }}
 			{{ end }}
 			{{ partial "paginator.html" . }}
 		</div>
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index a21191d..f44e585 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,8 +1,8 @@
-<footer class="flex sm:flex-col-reverse justify-between items-center">
+<footer class="mt-8 flex sm:flex-col-reverse justify-between items-center">
   <p class="mt-0 text-sm">
     {{ .Site.Copyright }} |
-    <a href="https://github.com/mivinci/hugo-theme-minima" target="_blank" rel="noopener noreferrer">MINIMA</a> ON
-    <a href="https://gohugo.io" target="_blank" rel="noopener noreferrer">HUGO</a>
+    <a href="https://github.com/mivinci/hugo-theme-minima" target="_blank" rel="noopener noreferrer">Minima</a> on
+    <a href="https://gohugo.io" target="_blank" rel="noopener noreferrer">Hugo</a>
   </p>
   <p class="flex items-center mt-0">
     {{ range $_, $key := .Site.Params.Social }}
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index ed0d83d..d9b0dfd 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -1,16 +1,14 @@
-<header>
-  <div class="flex justify-between items-center">
-    <h1 class="mb-5 flex items-center
-    whitespace-nowrap overflow-x-auto overflow-y-hidden">
-      {{ .Site.Title }}
-    </h1>
-    <div id="theme-switcher" class="text-4xl ml-4 cursor-pointer">{{ index .Site.Params.switch 1 }}</div>
+<header class="flex justify-between items-center sm:my-3">
+  <div class="flex items-center">
+    {{ if .Site.Params.brand }}
+    <div class="mr-3 text-3xl"><a href="/">{{ .Site.Params.brand }}</a></div>
+    {{ end }}
+    <div id="theme-switcher" class="text-4xl cursor-pointer">{{ index .Site.Params.switch 1 }}</div>
   </div>
-  <nav class="mb-5 flex items-center
+  <nav class="flex items-center
     whitespace-nowrap overflow-x-auto overflow-y-hidden">
     {{ range .Site.Menus.main }}
-    <a class="mr-3" href="{{ .URL }}">{{ .Name }}</a>
+    <a class="ml-3" href="{{ .URL }}">{{ .Name }}</a>
     {{ end }}
   </nav>
-  <hr>
 </header>
\ No newline at end of file
diff --git a/layouts/partials/list.html b/layouts/partials/list.html
new file mode 100644
index 0000000..a915265
--- /dev/null
+++ b/layouts/partials/list.html
@@ -0,0 +1,4 @@
+<div class="flex sm:flex-col my-5 sm:mb-6 sm:mt-3">
+  <div class="min-w-32 sm:mb-2 sm:text-sm">{{ dateFormat .Site.Params.timeformat .Date }}</div>
+  <a class="self-start" href="{{ .RelPermalink }}">{{ .Title }}</a>
+</div>
\ No newline at end of file
diff --git a/layouts/partials/paginator.html b/layouts/partials/paginator.html
index ba2923e..ae21414 100644
--- a/layouts/partials/paginator.html
+++ b/layouts/partials/paginator.html
@@ -1,6 +1,6 @@
 {{ $page := $.Paginator }}
 {{ if gt $page.TotalPages 1 }}
-<div class="my-5 flex justify-between">
+<div class="my-6 flex justify-between">
   {{ if $page.HasPrev }}
   <a href="{{ $page.Prev.URL }}">← Newer</a>
   {{ end }}
diff --git a/layouts/partials/toc.html b/layouts/partials/toc.html
index c1a6a6f..968e727 100644
--- a/layouts/partials/toc.html
+++ b/layouts/partials/toc.html
@@ -1,4 +1,4 @@
-<details class="toc mt-5 mb-4">
+<details class="toc mt-8">
   <summary>Table of Contents</summary>
   <div>
     {{ .TableOfContents }}