feat: updates
This commit is contained in:
@@ -4,15 +4,37 @@
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} · {{ .Site.Title }}{{ end }}</title>
|
||||
<link rel="stylesheet" href="/css/theme.css">
|
||||
<link id="chroma-latte" rel="stylesheet" href="/css/latte-chroma-style.css">
|
||||
<link id="chroma-mocha" rel="stylesheet" href="/css/mocha-chroma-style.css" disabled>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Rubik:wght@300..900&display=swap" rel="stylesheet">
|
||||
<script>
|
||||
window.tailwind = { config: { darkMode: 'class', theme: { extend: { fontFamily: { sans: ['Rubik','ui-sans-serif','system-ui','-apple-system','Segoe UI','Roboto','Helvetica Neue','Arial','Noto Sans'] } } } } };
|
||||
(function() {
|
||||
var root = document.documentElement;
|
||||
try {
|
||||
var stored = localStorage.getItem('theme');
|
||||
var prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||
var initial = stored || (prefersDark ? 'mocha' : 'latte');
|
||||
root.setAttribute('data-theme', initial);
|
||||
if (initial === 'mocha') root.classList.add('dark'); else root.classList.remove('dark');
|
||||
} catch (e) {
|
||||
root.setAttribute('data-theme', 'mocha');
|
||||
root.classList.add('dark');
|
||||
}
|
||||
})();
|
||||
</script>
|
||||
<link rel="stylesheet" href="/css/app.css">
|
||||
<script defer src="/theme.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<body class="{{ if .IsHome }}is-home {{ end }}font-sans">
|
||||
{{ partial "header.html" . }}
|
||||
<main>
|
||||
<main class="container main-container max-w-prose mx-auto px-4 py-8 md:py-12">
|
||||
{{ block "main" . }}{{ end }}
|
||||
</main>
|
||||
<footer class="site-footer">
|
||||
<div class="container max-w-prose mx-auto px-4 py-4 text-sm text-ctp-subtext0">
|
||||
<small>© {{ now.Year }} {{ .Site.Title }} | Powered by <a class="underline" href="https://gohugo.io">Hugo</a></small>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -1,18 +1,16 @@
|
||||
{{ define "main" }}
|
||||
<section>
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ range .Pages.ByDate.Reverse }}
|
||||
<article class="post-card">
|
||||
<h2><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
|
||||
<div class="post-meta">
|
||||
<time datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "Jan 2, 2006" }}</time>
|
||||
{{ with .Params.tags }}
|
||||
· {{ range . }}<span class="tag">#{{ . }}</span>{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ with .Summary }}<p>{{ . }}</p>{{ end }}
|
||||
</article>
|
||||
{{ end }}
|
||||
<h1 class="sr-only">{{ .Title }}</h1>
|
||||
<ul class="grid grid-cols-1 gap-4">
|
||||
{{ range .Pages.ByDate.Reverse }}
|
||||
<li class="border border-ctp-surface1 rounded-xl bg-ctp-base/70 px-4 py-3">
|
||||
<a class="flex items-baseline justify-between gap-4 no-underline text-inherit" href="{{ .RelPermalink }}">
|
||||
<span class="font-semibold">{{ .Title }}</span>
|
||||
<time class="text-sm text-ctp-subtext0" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time>
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</section>
|
||||
{{ end }}
|
||||
|
||||
|
||||
@@ -1,15 +1,23 @@
|
||||
{{ define "main" }}
|
||||
<article class="with-sidenotes">
|
||||
<header>
|
||||
<h1>{{ .Title }}</h1>
|
||||
<article class="post">
|
||||
<header class="post-header">
|
||||
<h1 class="post-title">{{ .Title }}</h1>
|
||||
<div class="post-meta">
|
||||
<time datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "Jan 2, 2006" }}</time>
|
||||
<time datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time>
|
||||
{{ with .Params.tags }}
|
||||
· {{ range . }}<span class="tag">#{{ . }}</span>{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
</header>
|
||||
<div class="content">{{ .Content }}</div>
|
||||
<nav class="post-nav">
|
||||
{{ with .PrevInSection }}
|
||||
<a class="post-nav__prev" href="{{ .RelPermalink }}">← {{ .Title }}</a>
|
||||
{{ end }}
|
||||
{{ with .NextInSection }}
|
||||
<a class="post-nav__next" href="{{ .RelPermalink }}">{{ .Title }} →</a>
|
||||
{{ end }}
|
||||
</nav>
|
||||
</article>
|
||||
{{ end }}
|
||||
|
||||
|
||||
@@ -1,18 +1,12 @@
|
||||
<header class="site-header">
|
||||
<div class="container header-inner">
|
||||
<a class="site-logo" href="/">{{ .Site.Title }}</a>
|
||||
<nav class="site-nav" aria-label="Main">
|
||||
{{ $p := . }}
|
||||
{{ with .Site.Menus.main }}
|
||||
{{ range . }}
|
||||
{{ $active := or ($p.IsMenuCurrent "main" .) ($p.HasMenuCurrent "main" .) }}
|
||||
<a class="site-nav__link {{ if $active }}is-active{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
<header class="site-header sticky top-0 backdrop-blur supports-[backdrop-filter]:bg-ctp-base/80 dark:supports-[backdrop-filter]:bg-ctp-base/70 border-b border-ctp-surface1 dark:border-ctp-surface1">
|
||||
<div class="container header-inner max-w-prose mx-auto flex items-center gap-3 px-4 py-3">
|
||||
<a class="site-logo font-semibold mr-auto no-underline text-inherit" href="/">{{ .Site.Title }}</a>
|
||||
<nav class="site-nav flex gap-2 flex-wrap" aria-label="Main">
|
||||
<a class="site-nav__link no-underline text-inherit border border-transparent rounded-md px-2 py-1 hover:bg-ctp-surface0/70" href="/posts/">All posts</a>
|
||||
<a class="site-nav__link no-underline text-inherit border border-transparent rounded-md px-2 py-1 hover:bg-ctp-surface0/70" href="/about/">About</a>
|
||||
</nav>
|
||||
<button id="theme-toggle" class="theme-toggle" aria-label="Toggle theme">🌙</button>
|
||||
</div>
|
||||
<div class="progress" id="progress"></div>
|
||||
<div class="progress fixed left-0 top-0 h-0.5 bg-ctp-teal w-0" id="progress"></div>
|
||||
</header>
|
||||
|
||||
|
||||
|
||||
22
layouts/index.html
Normal file
22
layouts/index.html
Normal file
@@ -0,0 +1,22 @@
|
||||
{{ define "main" }}
|
||||
<section id="home-post-list">
|
||||
<h1 class="sr-only">Latest posts</h1>
|
||||
<ul class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-4" id="home-post-items">
|
||||
{{ $posts := where .Site.RegularPages "Section" "posts" }}
|
||||
{{ range sort $posts "Date" "desc" }}
|
||||
<li class="home-post-item hidden border border-ctp-surface1 rounded-xl bg-ctp-base/70 shadow-sm hover:shadow-xl hover:-translate-y-1 transition px-4 py-3">
|
||||
<a class="grid gap-1 no-underline text-inherit" href="{{ .RelPermalink }}">
|
||||
<span>
|
||||
<span class="font-semibold">{{ .Title }}</span>
|
||||
{{ $subtitle := or .Params.subtitle (or .Params.summary .Summary) }}
|
||||
{{ with $subtitle }}<span class="block text-ctp-subtext0 text-sm">{{ . | plainify }}</span>{{ end }}
|
||||
</span>
|
||||
<time class="justify-self-end text-sm text-ctp-subtext0" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time>
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</section>
|
||||
{{ end }}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user