📝 Catala - A Theme for Luasmith

Catala is a minimalist and typographic theme designed to prioritize readability and content.

Key Features

• Persistent Dark Mode: The global layout (outer.etlua) includes a lightweight Vanilla JavaScript script that toggles the theme and safely remembers the user's preference across sessions and page reloads using the browser's localStorage.
• Interactive Code Blocks: A built-in Vanilla JS script inside outer.etlua automatically traverses your parsed markdown code snippets (<pre><code>) and dynamically injects a functional "Copy to clipboard" button. It even provides instant visual feedback ("Copiat!") without requiring heavy third-party libraries.
• Hidden / Standalone Pages: Need a page (like an "About me" or "Uses" page) to be accessible via direct link but hidden from the main blog index and RSS feed? Just prefix the Markdown file name with an underscore (e.g., _about.md). The theme's custom regex pipeline (^[^_].*%.html$) automatically filters these out of the aggregators while still building the HTML.
• Custom 404 Pipeline: Includes a dedicated pipeline to generate a custom 404.html error page. The theme dynamically injects specific metadata into the 404 page during the build process.
• Centralized Configuration: Zero external dependencies. The reliance on an external site.lua file has been completely removed. All your site metadata is centralized in a single, clean site table at the very top of theme.lua.
• Catalan Localization: Fully localized out-of-the-box. The htmlifyDate and htmlifyDateShort functions have been rewritten to output translated months and grammatically correct date formatting (e.g., "11 de març de 2026").
• Footnotes and Table of Contents: The theme supports Footnotes ([^1]) and Table of Contents ([TOC]). It features a custom "Extract & Restore" pipeline that safely hides code blocks, URLs, and raw HTML tags before parsing, preventing regex from breaking your formatting.
• Automated Reading Time: Dynamically calculates and displays the estimated reading time for each article (based on a 200 WPM average) by stripping HTML tags and counting words during the build process.
• Fully Self-Contained RSS/Atom Feed: The feed.etlua template has been moved from the global shared/ directory directly into the theme folder. The feed generator itself has been completely overhauled:
  • Syntax Cleaning: A custom Lua function automatically strips HTML syntax-highlighting tags from titles and summaries, preventing XML corruption.
  • CDATA Wrapping: Post content is safely wrapped in <![CDATA[...]]> blocks to ensure strict XML compliance.
  • Smart Date Extraction: Gracefully handles custom date strings (e.g., ignoring "Updated on..." text) without crashing the build.

Elements to Customize

To make this theme yours, you will need to update a few personal details across the files:

1. In theme.lua (Site configuration & Localization):

   • Update the site table at the top of the file with your own title, url, description, author, and email.
   • Date Language: To change the language from Catalan to English (or any other language), locate the months array near the top and translate the names (e.g., {"Jan", "Feb", "Mar"...}). You can also tweak the longDate string inside the htmlifyDate function to match your language's grammar.

2. In style.css (Colors & Fonts):

   • Tweak the color variables inside the :root and @media (prefers-color-scheme: dark) selectors to match your personal brand.

3. In outer.etlua (Global layout):

   • Change the HTML language attribute on line 2 (e.g., from lang="ca-ES" to lang="en-US").
   • You can also translate the text of the copy button inside the script at the bottom (change "Copiar" and "Copiat!").

4. In the Page Templates (blog.etlua, post.etlua, index.etlua, 404.etlua):

   • Header Navigation: Update the hardcoded links in the <nav class="nav-header"> section (currently pointing to _usos.html and _colofo.html).
   • Footer Links: Update the footer copyright text (CC BY-SA 4.0 / GPLv3) and replace the default GitHub URL inside the <div class="nav-right"> container with your own profile.

🚀 Installation Steps

1. Download the theme files (theme.lua, style.css, and all the .etlua templates).
2. Copy them into your Luasmith project's theme folder (e.g., themes/catala/).
3. Customize your personal data and links following the customization guide above.
4. Build your site by running your Luasmith build script (e.g., ./luasmith catala).