summaryrefslogtreecommitdiff
path: root/themes/rose-pine/home.html
diff options
context:
space:
mode:
authorHimanshu Sardana <himanshusardana2005@gmail.com>2026-03-26 21:50:35 +0000
committerHimanshu Sardana <himanshusardana2005@gmail.com>2026-03-26 21:50:35 +0000
commit9cfd3dbeb7967eb4971ccfd5124bbded901acf7a (patch)
treee1978db79ad9516adabdfb75b69f76a07d87bf6f /themes/rose-pine/home.html
parent580b7553fcac8bc5924d24e71487bdabb9595220 (diff)
feat: add rose-pine theme
Diffstat (limited to 'themes/rose-pine/home.html')
-rw-r--r--themes/rose-pine/home.html324
1 files changed, 324 insertions, 0 deletions
diff --git a/themes/rose-pine/home.html b/themes/rose-pine/home.html
new file mode 100644
index 0000000..5b7b6fa
--- /dev/null
+++ b/themes/rose-pine/home.html
@@ -0,0 +1,324 @@
+<!doctype html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8" />
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+ <title>{{ .SiteTitle }}</title>
+ <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=Zodiak:ital,wght@0,400;0,500;0,700;1,400;1,500&family=Cabinet+Grotesk:wght@400;500;700;800&family=Commit+Mono:ital,wght@0,400;0,700;1,400&display=swap"
+ rel="stylesheet"
+ />
+ <style>
+ :root {
+ --rp-base: #191724;
+ --rp-surface: #1f1d2e;
+ --rp-overlay: #26233a;
+ --rp-muted: #6e6a86;
+ --rp-subtle: #908caa;
+ --rp-text: #e0def4;
+ --rp-gold: #f6c177;
+ --rp-rose: #ebbcba;
+ --rp-pine: #31748f;
+ --rp-foam: #9ccfd8;
+ --rp-iris: #c4a7e7;
+ --rp-highlight-med: #403d52;
+ --border: var(--rp-highlight-med);
+ --text: var(--rp-text);
+ --text-dim: var(--rp-subtle);
+ --serif: "Zodiak", "Playfair Display", Georgia, serif;
+ --sans: "Cabinet Grotesk", "Outfit", system-ui, sans-serif;
+ --mono: "Commit Mono", "JetBrains Mono", ui-monospace, monospace;
+ --radius: 6px;
+ --max-w: 740px;
+ }
+
+ *,
+ *::before,
+ *::after {
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+ }
+ html {
+ scroll-behavior: smooth;
+ }
+
+ body {
+ margin: 0;
+ padding: 4rem 2rem 6rem;
+ background-color: var(--rp-base);
+ background-image:
+ radial-gradient(
+ ellipse 80% 50% at 50% -10%,
+ rgba(196, 167, 231, 0.08) 0%,
+ transparent 60%
+ );
+ color: var(--rp-text);
+ font-family: var(--serif);
+ line-height: 1.8;
+ font-size: 19px;
+ -webkit-font-smoothing: antialiased;
+ }
+
+ body > * {
+ max-width: var(--max-w);
+ margin-left: auto;
+ margin-right: auto;
+ }
+
+ a {
+ color: var(--rp-foam);
+ text-decoration: none;
+ border-bottom: 1px solid var(--rp-highlight-med);
+ }
+
+ a:hover {
+ color: var(--rp-iris);
+ }
+
+ nav {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 1.2rem 0 3rem;
+ border-bottom: 1px solid var(--rp-highlight-med);
+ margin-bottom: 3.5rem;
+ }
+
+ nav .logo {
+ font-family: var(--sans);
+ font-weight: 800;
+ font-size: 1.1rem;
+ letter-spacing: -0.02em;
+ color: var(--rp-text);
+ border: none;
+ }
+
+ nav .logo span {
+ color: var(--rp-iris);
+ }
+
+ nav ul {
+ display: flex;
+ gap: 2rem;
+ margin: 0;
+ padding: 0;
+ list-style: none;
+ }
+
+ nav ul li::before {
+ display: none;
+ }
+
+ nav a {
+ font-family: var(--mono);
+ font-size: 0.72rem;
+ letter-spacing: 0.08em;
+ text-transform: uppercase;
+ color: var(--rp-muted);
+ border: none;
+ }
+
+ nav a:hover {
+ color: var(--rp-foam);
+ }
+
+ .hero {
+ padding: 3rem 0 4rem;
+ }
+
+ .hero h1 {
+ font-family: var(--sans);
+ font-size: clamp(2.5rem, 6vw, 3.5rem);
+ font-weight: 800;
+ margin-bottom: 1rem;
+ background: linear-gradient(
+ 135deg,
+ var(--rp-text) 30%,
+ var(--rp-iris) 65%,
+ var(--rp-foam) 100%
+ );
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ background-clip: text;
+ }
+
+ .author-block {
+ display: flex;
+ flex-direction: column;
+ gap: 0.25rem;
+ margin-bottom: 2rem;
+ }
+
+ .author-name {
+ font-family: var(--sans);
+ font-size: 1.1rem;
+ font-weight: 600;
+ color: var(--rp-text);
+ }
+
+ .author-meta {
+ font-family: var(--mono);
+ font-size: 0.7rem;
+ letter-spacing: 0.08em;
+ text-transform: uppercase;
+ color: var(--rp-muted);
+ }
+
+ .author-bio {
+ font-size: 1rem;
+ color: var(--rp-subtle);
+ line-height: 1.7;
+ max-width: 50ch;
+ }
+
+ .section-title {
+ font-family: var(--mono);
+ font-size: 0.65rem;
+ letter-spacing: 0.15em;
+ text-transform: uppercase;
+ color: var(--rp-muted);
+ padding-bottom: 1rem;
+ border-bottom: 1px solid var(--rp-highlight-med);
+ margin-bottom: 2rem;
+ }
+
+ .post-list {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+ }
+
+ .post-item {
+ display: block;
+ text-decoration: none;
+ padding: 1.2rem 0;
+ border-bottom: 1px solid var(--rp-highlight-med);
+ transition: background 130ms ease;
+ }
+
+ .post-item:last-child {
+ border-bottom: none;
+ }
+
+ .post-item:hover {
+ background: var(--rp-surface);
+ }
+
+ .post-item:hover .post-title {
+ color: var(--rp-iris);
+ }
+
+ .post-title {
+ font-family: var(--sans);
+ font-size: 1.1rem;
+ font-weight: 600;
+ color: var(--rp-text);
+ line-height: 1.4;
+ margin-bottom: 0.35rem;
+ transition: color 130ms ease;
+ border: none;
+ }
+
+ .post-meta {
+ font-family: var(--mono);
+ font-size: 0.7rem;
+ letter-spacing: 0.04em;
+ color: var(--rp-muted);
+ }
+
+ .post-tags {
+ display: flex;
+ gap: 0.4rem;
+ margin-top: 0.5rem;
+ }
+
+ .tag {
+ font-family: var(--mono);
+ font-size: 0.6rem;
+ letter-spacing: 0.08em;
+ text-transform: uppercase;
+ padding: 0.15rem 0.5rem;
+ border: 1px solid var(--rp-highlight-med);
+ border-radius: 2px;
+ color: var(--rp-muted);
+ }
+
+ footer {
+ margin-top: 5rem;
+ padding-top: 2rem;
+ border-top: 1px solid var(--rp-highlight-med);
+ font-family: var(--mono);
+ font-size: 0.72rem;
+ letter-spacing: 0.05em;
+ color: var(--rp-muted);
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ }
+
+ @media (max-width: 700px) {
+ body {
+ padding: 2rem 1.2rem 4rem;
+ font-size: 17px;
+ }
+ nav {
+ flex-wrap: wrap;
+ gap: 1rem;
+ }
+ footer {
+ flex-direction: column;
+ text-align: center;
+ }
+ }
+ </style>
+ </head>
+ <body>
+ <nav>
+ <a href="/" class="logo">Kite<span>.</span></a>
+ <ul>
+ <li><a href="/">Home</a></li>
+ </ul>
+ </nav>
+
+ <main>
+ <section class="hero">
+ <h1>{{ .SiteTitle }}</h1>
+ <div class="author-block">
+ <span class="author-name">{{ .AuthorName }}</span>
+ <span class="author-meta">{{ .AuthorRole }}</span>
+ </div>
+ <p class="author-bio">{{ .AuthorBio }}</p>
+ </section>
+
+ <section class="posts">
+ <h2 class="section-title">Latest Posts</h2>
+ <ul class="post-list">
+ {{ range .Posts }}
+ <li>
+ <a href="/{{ .Slug }}/" class="post-item">
+ <span class="post-title">{{ .Title }}</span>
+ <div class="post-meta">
+ <time>{{ .Date }}</time>
+ </div>
+ {{ if .Tags }}
+ <div class="post-tags">
+ {{ range .Tags }}
+ <span class="tag">{{ . }}</span>
+ {{ end }}
+ </div>
+ {{ end }}
+ </a>
+ </li>
+ {{ end }}
+ </ul>
+ </section>
+ </main>
+
+ <footer>
+ <span>&copy; {{ .Year }} {{ .AuthorName }}</span>
+ </footer>
+ </body>
+</html> \ No newline at end of file
generated by cgit v1.3.1 (git 2.54.0) at 2026-05-22 10:56:07 +0000