diff options
| -rw-r--r-- | assets/css/base.css | 8 | ||||
| -rw-r--r-- | assets/css/markdown.css | 22 | ||||
| -rw-r--r-- | assets/css/site.css | 34 | ||||
| -rw-r--r-- | assets/css/tailwind.config.js | 4 | ||||
| -rw-r--r-- | layouts/_default/list.html | 24 | ||||
| -rw-r--r-- | layouts/_default/section.html | 19 | ||||
| -rw-r--r-- | layouts/_default/single.html | 6 | ||||
| -rw-r--r-- | layouts/partials/head.html | 18 | ||||
| -rw-r--r-- | layouts/partials/header.html | 2 | ||||
| -rw-r--r-- | layouts/partials/post_metadata.html | 6 | ||||
| -rw-r--r-- | layouts/partials/post_series.html | 2 | ||||
| -rw-r--r-- | layouts/partials/post_toc.html | 6 |
12 files changed, 108 insertions, 43 deletions
diff --git a/assets/css/base.css b/assets/css/base.css index b871eef..9fc2705 100644 --- a/assets/css/base.css +++ b/assets/css/base.css @@ -3,7 +3,7 @@ --color-eureka: #38B2AC; --color-primary-bg: rgba(242,242,247,1.00); --color-secondary-bg: rgba(255,255,255,1.00); - --color-tertiary-bg: rgba(120,120,128,0.20); + --color-tertiary-bg: rgba(242,242,247,1.00); --color-primary-text: rgba(0,0,0,0.85); --color-secondary-text: rgba(0,0,0,0.65); --color-tertiary-text: rgba(0,0,0,0.45); @@ -11,9 +11,9 @@ .dark { --color-eureka: #38B2AC; - --color-primary: rgba(0,0,0,1.00); - --color-secondary: rgba(28,28,30,1.00); - --color-tertiary: rgba(44,44,46,1.00); + --color-primary-bg: rgba(0,0,0,1.00); + --color-secondary-bg: rgba(28,28,30,1.00); + --color-tertiary-bg: rgba(44,44,46,1.00); --color-primary-text: rgba(255,255,255,0.85); --color-secondary-text: rgba(255,255,255,0.65); --color-tertiary-text: rgba(255,255,255,0.45); diff --git a/assets/css/markdown.css b/assets/css/markdown.css index e1802aa..0aa9bda 100644 --- a/assets/css/markdown.css +++ b/assets/css/markdown.css @@ -25,7 +25,15 @@ } .content a { - @apply font-semibold; + @apply text-eureka; +} + +.content a:focus { + @apply text-eureka underline; +} + +.content a:hover { + @apply text-eureka underline; } .content strong a { @@ -53,19 +61,19 @@ } .content h6 { - @apply leading-tight text-sm font-semibold text-gray-600 mb-4 mt-6; + @apply leading-tight text-sm font-semibold text-secondary-text mb-4 mt-6; } .content blockquote { - @apply text-base border-l-4 border-gray-300 pl-4 pr-4 text-gray-600; + @apply text-base border-l-4 border-tertiary-text pl-4 pr-4 text-secondary-text; } .content code { - @apply font-mono text-sm inline bg-gray-200 rounded px-1 py-05; + @apply font-mono text-sm inline bg-tertiary-bg rounded p-1; } .content pre { - @apply bg-gray-100 rounded p-4; + @apply bg-tertiary-bg rounded p-4; } .content pre code { @@ -81,11 +89,11 @@ } .content kbd { - @apply text-xs inline-block rounded border px-1 py-05 align-middle font-normal font-mono shadow; + @apply text-xs inline-block rounded border p-1 align-middle font-normal font-mono shadow; } .content table { - @apply text-base border-gray-600; + @apply text-base border-secondary-text; } .content th { diff --git a/assets/css/site.css b/assets/css/site.css index 5623e0f..23ada0c 100644 --- a/assets/css/site.css +++ b/assets/css/site.css @@ -2,19 +2,35 @@ color: blue; } -.sticky-title { - @apply sticky top-16 z-10 bg-primary-bg; -} - .sticky-toc { - @apply sticky z-0; + @apply sticky z-0 ease-in-out duration-300; top: 8rem; } -/* .sticky-toc a { - @apply text-gray-100 -} */ +.sticky-toc a { + @apply text-primary-text ease-in-out duration-200; +} -.sticky-toc a:hover, a:focus { +.sticky-toc a:hover { @apply text-eureka; +} + +.sticky-toc a:focus { + @apply text-eureka; +} + +.sticky-toc ul { + @apply text-base pl-8 list-disc; +} + +.sticky-toc ol { + @apply text-base pl-8 list-decimal; +} + +.sticky-toc li + li { + @apply mt-1; +} + +.sticky-toc li > p + p { + @apply mt-6; }
\ No newline at end of file diff --git a/assets/css/tailwind.config.js b/assets/css/tailwind.config.js index ed10c1a..58c9603 100644 --- a/assets/css/tailwind.config.js +++ b/assets/css/tailwind.config.js @@ -1,6 +1,10 @@ module.exports = { important: true, theme: { + fontFamily: { + 'serif': ['Lora', 'Noto Serif SC', 'serif'], + 'mono': ['SFMono-Regular', 'Menlo'], + }, extend: { inset: { '16': '4rem', diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 43df083..a8890bb 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -1,8 +1,20 @@ {{ define "main" }} -{{ range .Pages }} - <article class="text-gray-700 sm:mx-12 mb-4"> - <h1 class="font-bold font-thin text-3xl text-gray-700"><a href="{{ .Permalink }}">{{ .Title }}</a></h1> - {{ .Content }} - </article> -{{ end }} +<article class="mx-6 mb-8"> + <h1 class="font-bold text-3xl text-primary-text">{{.Title}}</h1> + {{ with .Content }} + <div class="content"> + {{ . }} + </div> + {{ end }} +</article> +<ul class="bg-secondary-bg px-6 py-8"> + {{ range .Pages }} + <li class="text-lg text-primary-text my-2"> + <a href="{{ .Permalink }}" class="text-eureka hover:underline"> + {{ .Title }} + </a> + </li> + {{ end }} +</ul> + {{ end }}
\ No newline at end of file diff --git a/layouts/_default/section.html b/layouts/_default/section.html new file mode 100644 index 0000000..9cb4a5e --- /dev/null +++ b/layouts/_default/section.html @@ -0,0 +1,19 @@ +{{ define "main" }} +<article class="mx-6 mb-8"> + <h1 class="font-bold text-3xl text-primary-text">{{.Title}}</h1> + {{ with .Content }} + <div class="content"> + {{ . }} + </div> + {{ end }} +</article> +{{ range .Pages }} +<article class="bg-secondary-bg px-6 py-8 mb-8"> + <h1 class="font-bold text-3xl text-primary-text"><a href="{{ .Permalink }}" + class="hover:text-eureka">{{ .Title }}</a></h1> + <div class="content"> + {{ .Summary }} + </div> +</article> +{{ end }} +{{ end }}
\ No newline at end of file diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 3e6725d..1a59519 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -4,7 +4,7 @@ <div class="grid grid-cols-2 lg:grid-cols-8 gap-4"> <div class="col-span-2 {{ if not $hasSidebar }} {{- print "lg:col-start-2" -}} {{ end }} lg:col-span-6 bg-secondary-bg px-6 py-8"> - <h1 class="font-bold text-3xl text-gray-700">{{ .Title }}</h1> + <h1 class="font-bold text-3xl text-primary-text">{{ .Title }}</h1> {{ partial "post_metadata.html" . }} <div class="content"> {{ .Content}} @@ -25,7 +25,7 @@ {{ with $related }} <div class="col-span-2 {{ if not $hasSidebar }} {{- print "lg:col-start-2" -}} {{ end }} lg:col-span-6 bg-secondary-bg p-6"> - <h2 class="subtitle">See Also</h2> + <h2 class="text-lg font-semibold mb-4">See Also</h2> <div class="content"> {{ range . }} <a href="{{ .RelPermalink }}">{{ .Title }}</a> @@ -35,6 +35,8 @@ </div> {{ end }} </div> +<script src="//cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.0.0/build/highlight.min.js"></script> +<script>hljs.initHighlightingOnLoad();</script> {{ if $hasToc }} <script> window.addEventListener('DOMContentLoaded', () => { diff --git a/layouts/partials/head.html b/layouts/partials/head.html index fc721ed..ccf8080 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -1,8 +1,8 @@ <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1,user-scalable=no"> <title>{{ block "title" . }} -{{- .Title }} - {{ .Site.Title -}} -{{ end }}</title> + {{- .Title }} - {{ .Site.Title -}} + {{ end }}</title> {{ if .Description }} <meta name="description" content="{{ .Description }}" /> {{ end }} @@ -17,10 +17,16 @@ {{ $styles := resources.Get "css/styles.css" | postCSS (dict "config" "./assets/css/postcss.config.js") }} {{ if .Site.IsServer }} - <link rel="stylesheet" href="{{ $styles.RelPermalink }}"> +<link rel="stylesheet" href="{{ $styles.RelPermalink }}"> {{ else }} - {{ $styles := $styles| minify | fingerprint | resources.PostProcess }} - <link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}"> +{{ $styles := $styles| minify | fingerprint | resources.PostProcess }} +<link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}"> {{ end }} - +<link + href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,700;1,400;1,700&family=Noto+Serif+SC:wght@400;500;700&family=Noto+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap" + rel="stylesheet"> +<link rel="stylesheet" + href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.0.3/build/styles/solarized-light.min.css"> +<!-- <link rel="stylesheet" + href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@10.0.3/build/styles/solarized-dark.min.css"> --> <script defer src="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.13.0/js/all.min.js"></script>
\ No newline at end of file diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 26036fa..1d92de7 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -1,5 +1,5 @@ <nav class="flex items-center justify-between flex-wrap p-4"> - <div class="flex items-center flex-shrink-0 text-eureka hover:text-black mr-6"> + <div class="flex items-center flex-shrink-0 text-primary-text hover:text-eureka mr-6"> <a href="/" class="font-semibold text-xl tracking-tight">{{ .Site.Title }}</a> </div> <div class="block md:hidden"> diff --git a/layouts/partials/post_metadata.html b/layouts/partials/post_metadata.html index 39b69bc..2405e39 100644 --- a/layouts/partials/post_metadata.html +++ b/layouts/partials/post_metadata.html @@ -1,4 +1,4 @@ -<div class="flex flex-wrap flex-row items-center my-2"> +<div class="flex flex-wrap flex-row items-center my-2 text-tertiary-text"> <div class="mx-2 my-2"> <i class="fas fa-calendar"></i> <span>{{ dateFormat "Jan 2, 2006" .Date }}</span> @@ -20,7 +20,7 @@ {{ if gt $index 0 }} <span>, </span> {{ end -}} - <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a> + <a href="{{ .RelPermalink }}" class="hover:text-eureka">{{ .LinkTitle }}</a> {{ end }} </div> {{ end }} @@ -35,7 +35,7 @@ {{ if gt $index 0 }} <span>, </span> {{ end -}} - <a href="{{ .RelPermalink }}">{{ .LinkTitle }}</a> + <a href="{{ .RelPermalink }}" class="hover:text-eureka">{{ .LinkTitle }}</a> {{ end }} </div> {{ end }} diff --git a/layouts/partials/post_series.html b/layouts/partials/post_series.html index 062b39a..6ed0dad 100644 --- a/layouts/partials/post_series.html +++ b/layouts/partials/post_series.html @@ -1,6 +1,6 @@ {{ $series := .Site.Taxonomies.series}} <div class="bg-secondary-bg p-6"> - <h2 class="subtitle">系列文章</h2> + <h3 class="text-lg font-semibold mb-4">系列文章</h3> <div class="content"> {{range .Params.series }} {{ $key := . | urlize}} diff --git a/layouts/partials/post_toc.html b/layouts/partials/post_toc.html index b4910d2..c34f949 100644 --- a/layouts/partials/post_toc.html +++ b/layouts/partials/post_toc.html @@ -1,8 +1,6 @@ -<div class="sticky-title hidden lg:block px-6 py-4"> +<div class="sticky top-16 z-10 text-lg font-semibold bg-primary-bg hidden lg:block px-6 py-4"> <h2 class="subtitle">目录</h2> </div> <div class="sticky-toc hidden lg:block px-6 pb-6"> - <div class="content"> - {{ .TableOfContents }} - </div> + {{ .TableOfContents }} </div>
\ No newline at end of file |