prt 0.3.0

data/skel/css/app.scss

@@ -0,0 +1,189 @@
+// Write your custom css here
+
+// Simple.css switches themes only via prefers-color-scheme. These let the
+// header toggle (data-theme on <html>) override the system choice either way.
+// The colors mirror simple.css's own light and dark palettes.
+:root[data-theme="light"] {
+  color-scheme: light;
+  --bg: #fff;
+  --accent-bg: #f5f7ff;
+  --text: #212121;
+  --text-light: #585858;
+  --accent: #0d47a1;
+  --accent-hover: #1266e2;
+  --code: #d81b60;
+  --preformatted: #444;
+  --disabled: #efefef;
+
+  img,
+  video {
+    opacity: 1;
+  }
+}
+
+:root[data-theme="dark"] {
+  color-scheme: dark;
+  --bg: #212121;
+  --accent-bg: #2b2b2b;
+  --text: #dcdcdc;
+  --text-light: #ababab;
+  --accent: #ffb300;
+  --accent-hover: #ffe099;
+  --code: #f06292;
+  --preformatted: #ccc;
+  --disabled: #111;
+
+  img,
+  video {
+    opacity: 0.8;
+  }
+}
+
+.site-header {
+  position: relative;
+  text-align: center;
+  padding: 2.5rem 1rem 2rem;
+  margin-bottom: 2rem;
+  border-bottom: 1px solid var(--border);
+}
+
+.theme-toggle {
+  position: absolute;
+  top: 1rem;
+  right: 1rem;
+  display: inline-flex;
+  padding: 0.4rem;
+  border: 1px solid var(--border);
+  border-radius: 50%;
+  background: transparent;
+  color: var(--text-light);
+
+  &:enabled:hover {
+    background: transparent;
+    border-color: var(--accent);
+    color: var(--accent);
+  }
+
+  svg {
+    width: 1.1rem;
+    height: 1.1rem;
+    fill: none;
+    stroke: currentColor;
+    stroke-width: 2;
+    stroke-linecap: round;
+    stroke-linejoin: round;
+  }
+
+  // Show the theme you'd switch to: a moon in light mode, a sun in dark mode.
+  .icon-sun {
+    display: none;
+  }
+}
+
+@mixin show-sun {
+  .theme-toggle .icon-moon {
+    display: none;
+  }
+
+  .theme-toggle .icon-sun {
+    display: block;
+  }
+}
+
+:root[data-theme="dark"] {
+  @include show-sun;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root:not([data-theme="light"]) {
+    @include show-sun;
+  }
+}
+
+.site-name {
+  display: inline-block;
+  font-size: 2rem;
+  font-weight: 700;
+  letter-spacing: -0.02em;
+  text-decoration: none;
+  color: var(--text);
+
+  &:hover {
+    color: var(--accent);
+  }
+}
+
+.tagline {
+  margin: 0.4rem auto 0;
+  color: var(--text-light);
+  font-size: 1.05rem;
+}
+
+.site-nav {
+  margin-top: 1rem;
+  font-size: 0.95rem;
+}
+
+.back-link {
+  margin-top: 0;
+  margin-bottom: 1.5rem;
+  font-size: 0.9rem;
+
+  a {
+    text-decoration: none;
+  }
+}
+
+// The date and category line Parrot adds under a post's title.
+.post-meta {
+  margin-top: -0.5rem;
+  color: var(--text-light);
+  font-size: 0.95rem;
+}
+
+// A post's category, linking to that category's listing: under a post's
+// title, and in listings via list_format's {post_category_tag}.
+.category-tag {
+  display: inline-block;
+  padding: 0 0.5rem;
+  border: 1px solid var(--border);
+  border-radius: 1rem;
+  font-size: 0.85rem;
+  line-height: 1.6;
+  text-decoration: none;
+  vertical-align: middle;
+
+  &,
+  &:visited {
+    color: var(--text-light);
+  }
+
+  &:hover {
+    border-color: var(--accent);
+    color: var(--accent);
+  }
+}
+
+.post-tags {
+  margin-top: 2rem;
+  font-size: 0.9rem;
+  color: var(--text-light);
+
+  .tag {
+    display: inline-block;
+    padding: 0.1rem 0.5rem;
+    border: 1px solid var(--border);
+    border-radius: 1rem;
+  }
+}
+
+.pagination {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 2rem;
+  font-size: 0.9rem;
+
+  a {
+    text-decoration: none;
+  }
+}

data/skel/images/favicon.svg

@@ -0,0 +1,40 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 64 64">
+  <defs>
+    <linearGradient id="badge" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#4bb45f"/>
+      <stop offset="100%" stop-color="#2f9e4d"/>
+    </linearGradient>
+  </defs>
+
+  <rect width="64" height="64" rx="12" fill="url(#badge)"/>
+
+  <!-- crest -->
+  <g fill="#ffd23f" stroke="#e0a91f" stroke-width="1.6" stroke-linejoin="round">
+    <path d="M26 13 C24 8 26 5 30 4 C31 9 30 13 28 16 Z"/>
+    <path d="M32 11 C32 5 35 3 39 4 C39 9 37 13 35 16 Z"/>
+    <path d="M38 13 C40 8 44 6 47 7 C45 12 42 15 40 17 Z"/>
+  </g>
+
+  <!-- head -->
+  <circle cx="32" cy="36" r="22.5" fill="#57c06a" stroke="#1f7a3c" stroke-width="2.6"/>
+
+  <!-- face -->
+  <path d="M32 19 C43 19 49 27 49 36 C49 46 42 52 32 52 C23 52 16 46 15 37 C14 27 21 19 32 19 Z" fill="#ffd94a"/>
+
+  <!-- cheeks -->
+  <circle cx="19" cy="40" r="4.2" fill="#ff9fb2" opacity="0.7"/>
+  <circle cx="45" cy="40" r="4.2" fill="#ff9fb2" opacity="0.7"/>
+
+  <!-- eyes (no outline, wide-set so they stay cute, not spectacled, when tiny) -->
+  <circle cx="23" cy="33" r="7" fill="#ffffff"/>
+  <circle cx="41" cy="33" r="7" fill="#ffffff"/>
+  <circle cx="24.4" cy="34" r="4" fill="#2b2b2b"/>
+  <circle cx="39.6" cy="34" r="4" fill="#2b2b2b"/>
+  <circle cx="22.6" cy="32.2" r="1.5" fill="#ffffff"/>
+  <circle cx="37.8" cy="32.2" r="1.5" fill="#ffffff"/>
+
+  <!-- beak -->
+  <path d="M30 41 C28.5 41 27.5 43.5 28.5 46 C29.5 49.5 34 50.5 36.5 47.5 C38.5 45.5 38.5 42 36.5 40.5 C35 39.5 32 41 30 41 Z"
+        fill="#ff8f3f" stroke="#d9691f" stroke-width="2" stroke-linejoin="round"/>
+  <path d="M29.5 44.5 C30.5 47 32.5 48.5 34.5 47.5 C33 50 30.5 49 29 46.5 Z" fill="#e0641c"/>
+</svg>

data/skel/javascripts/app.js

@@ -0,0 +1,37 @@
+// Light/dark toggle. The saved choice is applied early by an inline script in
+// layout.html.erb; this wires up the header button and remembers new choices.
+(function () {
+  var root = document.documentElement;
+  var button = document.querySelector('.theme-toggle');
+  if (!button) return;
+
+  var systemDark = window.matchMedia('(prefers-color-scheme: dark)');
+  var themeColors = { light: '#ffffff', dark: '#212121' };
+
+  function currentTheme() {
+    return root.dataset.theme || (systemDark.matches ? 'dark' : 'light');
+  }
+
+  function render() {
+    var theme = currentTheme();
+    button.setAttribute('aria-pressed', theme === 'dark');
+    button.title = theme === 'dark' ? 'Switch to light mode' : 'Switch to dark mode';
+    // Only override the browser chrome color once the visitor has picked a theme.
+    if (root.dataset.theme) {
+      document.querySelectorAll('meta[name="theme-color"]').forEach(function (meta) {
+        meta.content = themeColors[theme];
+      });
+    }
+  }
+
+  button.addEventListener('click', function () {
+    var theme = currentTheme() === 'dark' ? 'light' : 'dark';
+    root.dataset.theme = theme;
+    try { localStorage.setItem('theme', theme); } catch (e) {}
+    render();
+  });
+
+  systemDark.addEventListener('change', render);
+  button.hidden = false;
+  render();
+})();

data/skel/views/404.md

@@ -0,0 +1,7 @@
+# Page not found
+
+![A parrot](images/parrot.jpeg "This parrot is as lost as you are")
+
+The page you were looking for isn't here — it may have moved or never existed.
+
+[Back to the home page](/)

data/skel/views/about.md

@@ -0,0 +1,17 @@
+<!--
+title: About
+description: Who writes this blog, and where else to find them.
+-->
+
+# About
+
+Write a few lines about yourself and this blog here. This page is built from
+`views/about.md` and linked from the navigation at the top of every page.
+
+## Find me elsewhere
+
+- [GitHub](https://github.com/your-username)
+- [X](https://x.com/your-username)
+- [LinkedIn](https://www.linkedin.com/in/your-username)
+- [Mastodon](https://mastodon.social/@your-username)
+- [RSS feed](feed.xml)

data/skel/views/layout.html.erb

@@ -0,0 +1,72 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <meta name="theme-color" media="(prefers-color-scheme: light)" content="#ffffff">
+  <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#212121">
+  <!-- Warm up the connections to the CDNs the page pulls from. Add
+       https://www.googletagmanager.com here too if you wire up GTM/Analytics. -->
+  <link rel="preconnect" href="https://cdn.simplecss.org" crossorigin>
+  <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin>
+  <link rel="dns-prefetch" href="https://cdn.jsdelivr.net">
+  <link rel="icon" type="image/x-icon" href="images/favicon.ico" sizes="16x16 32x32 48x48">
+  <link rel="icon" type="image/svg+xml" href="images/favicon.svg">
+  <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
+  <!-- Apply a saved light/dark choice before the first paint, so the page
+       doesn't flash the system theme first. Without one, the system theme wins. -->
+  <script>
+    try {
+      var theme = localStorage.getItem('theme');
+      if (theme === 'light' || theme === 'dark') document.documentElement.dataset.theme = theme;
+    } catch (e) {}
+  </script>
+  <link rel="stylesheet" href="https://cdn.simplecss.org/simple.min.css">
+  <link rel="stylesheet" href="app.css">
+  <script src="app.js" defer></script>
+  <link rel="alternate" type="application/rss+xml" title="Parrot" href="feed.xml">
+  <meta name="generator" content="Parrot">
+  <meta name="author" content="Your name">
+  <!-- Site-wide fallback description. Each post overrides it from its header
+       `description` (or its first paragraph) at build time. -->
+  <meta name="description" content="A blog built with Parrot.">
+  <!-- Set this to your site's URL. Parrot appends each page's path when building. -->
+  <meta property="og:url" content="https://example.com">
+  <link rel="canonical" href="https://example.com">
+  <meta property="og:type" content="website">
+  <meta property="og:site_name" content="Parrot">
+  <meta property="og:title" content="Parrot">
+  <meta property="og:description" content="A blog built with Parrot.">
+  <meta property="og:locale" content="en_US">
+  <!-- Link-preview image. A relative images/… path is copied to the build and
+       rewritten to an absolute URL; you can also use a full URL. -->
+  <meta property="og:image" content="images/parrot.jpeg">
+  <meta name="twitter:card" content="summary_large_image">
+  <meta name="twitter:description" content="A blog built with Parrot.">
+  <title>Parrot</title>
+</head>
+<body>
+  <header class="site-header">
+    <button class="theme-toggle" type="button" aria-label="Toggle dark mode" hidden>
+      <svg class="icon-moon" viewBox="0 0 24 24" aria-hidden="true"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg>
+      <svg class="icon-sun" viewBox="0 0 24 24" aria-hidden="true"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>
+    </button>
+    <a class="site-name" href="/">Your name</a>
+    <p class="tagline">Your tagline</p>
+    <nav class="site-nav">
+      <a href="/">Home</a>
+      <a href="/categories.html">Categories</a>
+      <a href="/about.html">About</a>
+    </nav>
+  </header>
+
+  <main>
+    <%= yield %>
+  </main>
+
+  <footer>
+    Made with love using <a href="https://github.com/deepakkumarnd/parrot">Parrot</a>
+  </footer>
+</body>
+</html>

data/skel/views/posts/about_parrot.md

@@ -0,0 +1,63 @@
+<!--
+title: About Parrot
+date: 08/09/2026
+lang: en
+tags: parrot, markdown
+category: Guides
+-->
+
+# About Parrot
+
+Parrot turns a folder of Markdown into a static blog. This post is also a
+cheat sheet: it shows the formatting you can use in any `views/posts/*.md`
+file.
+
+## Headings and text
+
+Use `#` for the post title and `##` / `###` for sections, like the ones on
+this page. Inline styles work too: **bold**, _italic_, and `inline code`.
+
+## Code blocks
+
+Tag a fenced block with a language and Parrot highlights it (Monokai theme by
+default — change `HIGHLIGHT_THEME` in `lib/parrot/constants.rb`):
+
+```ruby
+class Greeter
+  def initialize(name)
+    @name = name
+  end
+
+  def greet
+    puts "Hello, #{@name}!"
+  end
+end
+
+Greeter.new("Parrot").greet
+```
+
+```bash
+parrot new blog
+cd blog
+parrot serve
+```
+
+An untagged, indented block renders as plain preformatted text:
+
+    $ parrot build
+
+## Math
+
+LaTeX between `$$ … $$` is rendered with MathJax. Inline, it flows with the
+sentence: $$e^{i\pi} + 1 = 0$$.
+
+On its own line it becomes a display block:
+
+$$
+W = W - \text{lr} \cdot \frac{\partial L}{\partial W}
+$$
+
+## Links between posts
+
+Link to another post by its Markdown filename and Parrot rewrites it to the
+built page at build time: [read the next post](#post2.md).

data/skel/views/posts/sample.md

@@ -0,0 +1,37 @@
+<!--
+title: Your second post
+date: 08/09/2026
+lang: en
+category: Guides
+-->
+
+# Your second post
+
+This is `views/posts/post2.md`. Edit it, or delete it and drop your own
+`.md` files into `views/posts/` — each one is built into its own page and can
+be listed from `views/index.md`.
+
+For headings, code blocks and LaTeX math, see [About Parrot](#post1.md). This
+post covers the rest of the everyday Markdown.
+
+## Images
+
+Keep image files in `images/` and link them with a relative path. Parrot copies
+the ones a page actually uses into `public/images/`:
+
+![A parrot](images/parrot.jpeg "Say hi to the parrot")
+
+## Lists, quotes and tables
+
+- A bullet list
+- with **bold**, _italic_ and a [link to another site](https://www.ruby-lang.org)
+
+1. A numbered list
+2. for steps in order
+
+> Blockquotes are good for asides and pull quotes.
+
+| Feature | Supported |
+| ------- | --------- |
+| Tables  | yes       |
+| Footers | yes       |