BlueStar Theme
A clean, responsive Jekyll theme designed for documentation and game-dev sites.
Features a collapsible left navigation panel, a right-side table of contents, dark/light modes, and easy theming via CSS variables.
🚀 Installation
- In your site’s
_config.yml, enable remote themes and point to this repo:
plugins:
- jekyll-remote-theme
remote_theme: BlueStar03/theme@v1.0.0
- Remove any existing
theme:entry. - Push to GitHub Pages — your site will rebuild with BlueStar Theme.
⚙️ Configuration
All of the following settings go in your site repo’s _config.yml. Each has a sensible default, but you can override to customize the look, layout, and functionality.
| Key | Default | Description |
|---|---|---|
title |
— | Your site’s title (shown in header and browser tab). |
description |
— | Meta description for SEO & social previews. |
lang |
en |
Page language attribute (<html lang="…">). |
logo |
unset | URL or path to a logo image for the left-panel toggle. |
font_base |
16px |
Base font size for the site (html { font-size: … }). |
panel_width |
20em |
Width of both left & right panels (--panel-width). |
accent_color |
blue |
Primary accent color for header, links, highlights (--accent-color). |
content_max |
66.67em |
Maximum width for the main content area (--content-max). |
nav |
see example | Array of navigation items for the left panel |
social |
empty array | Social links for the footer: |
toc_icon |
📑 |
Icon for the right-panel toggle |
toc-include-h1 |
false |
Whether to include <h1> in the generated Table of Contents (via <meta> tag). |
author |
— | Default author name (shown in right-panel metadata). |
date / last_modified_at |
auto | Page date formatting; if unset, falls back to site.time. |
fontawesome_kit |
unset | defaults to cdnjs.cloudflare.com |
Example _config.yml
title: “Chronicle Destiny Docs”
description: “Design documents, devlogs, and reference for the Chronicle Destiny game.”
lang: en
plugins:
- jekyll-remote-theme
remote_theme: BlueStar03/theme@v1.0.0
logo: /assets/img/logo.svg
toc_icon: fa fa-list
toc-include-h1: true
fontawesome_kit: abcde12345
font_base: 16px
panel_width: 20em
accent_color: red
content_max: 70em
colors:
accent: "#0078d7" # link/buttons highlight
light:
bg: "#ffffff" # page background (light)
bg_alt: "#f3f3f3" # panel/background (light)
text: "#000000" # main text (light)
text_alt: "#555555" # muted text (light)
dark:
bg: "#1d1d1d" # page background (dark)
bg_alt: "#2a2a2a" # panel/background (dark)
text: "#ffffff" # main text (dark)
text_alt: "#aaaaaa" # muted text (dark)
nav:
- title: 🏠 Home
url: /
- title: 📄 Documentation
url: /docs
- title: 📝 Blog
url: /blog
- title: 📰 Updates
url: /updates
social:
- title: GitHub
url: https://github.com/your-user/your-repo
icon: fab fa-github
- title: Twitter
url: https://twitter.com/your-handle
icon: fab fa-twitter