x/wiki
1
0
Fork 0
mirror of https://github.com/waynesutton/markdown-site.git synced 2026-01-12 04:09:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

update: Centralized defaultTheme in siteConfig.ts

Browse Source
This commit is contained in:
Wayne Sutton
2026-01-03 12:49:21 -08:00
parent 560582928f
commit 83265d5e52
16 changed files with 174 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
FORK_CONFIG.md
View File

@@ -61,7 +61,8 @@ This updates all 11 configuration files automatically:
- `public/robots.txt`
- `public/openapi.yaml`
- `public/.well-known/ai-plugin.json`
- `src/context/ThemeContext.tsx`
Theme is now configured in `src/config/siteConfig.ts` (via the `defaultTheme` field).
### Step 4: Review and deploy
@@ -92,7 +93,7 @@ Edit each file individually following the guide below.
| `public/robots.txt` | Sitemap URL |
| `public/openapi.yaml` | Server URL, site name |
| `public/.well-known/ai-plugin.json` | Plugin metadata |
| `src/context/ThemeContext.tsx` | Default theme |
| `src/config/siteConfig.ts` | Default theme (`defaultTheme` field) |
---
@@ -423,12 +424,15 @@ Update plugin metadata:
}
```
### 11. src/context/ThemeContext.tsx
### 11. Default Theme (in siteConfig.ts)
Change the default theme (line 21):
Change the default theme in `src/config/siteConfig.ts`:
```typescript
const DEFAULT_THEME: Theme = "tan"; // Options: dark, light, tan, cloud
export const siteConfig: SiteConfig = {
// ... other config
defaultTheme: "tan", // Options: "dark", "light", "tan", "cloud"
};
```
---

15
TASK.md
View File

@@ -9,10 +9,23 @@
## Current Status
v2.8.0 ready. Docs sidebar group icons via frontmatter.
v2.8.1 ready. Centralized defaultTheme in siteConfig.ts.
## Completed
- [x] Centralize defaultTheme in siteConfig.ts
- [x] Added `defaultTheme` field to siteConfig.ts (type: `Theme`)
- [x] Added `Theme` type export to siteConfig.ts
- [x] Updated ThemeContext.tsx to import and use siteConfig.defaultTheme
- [x] Updated configure-fork.ts to update siteConfig.ts instead of ThemeContext.tsx
- [x] Renamed `updateThemeContext` to `updateThemeConfig` in configure-fork.ts
- [x] Updated docs.md Theme section with new siteConfig.ts example
- [x] Updated setup-guide.md "Change the Default Theme" section
- [x] Updated FORK_CONFIG.md with new theme configuration instructions
- [x] Updated fork-configuration-guide.md with siteConfig.ts reference
- [x] Backward compatible: falls back to "tan" if defaultTheme not set
- [x] Docs sidebar group icons via frontmatter
- [x] Added `docsSectionGroupIcon` frontmatter field for posts and pages
- [x] Icon appears left of the group title expand/collapse chevron

18
changelog.md
View File

@@ -4,6 +4,24 @@ All notable changes to this project will be documented in this file.
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
## [2.8.1] - 2026-01-03
### Changed
- Centralized `defaultTheme` configuration in `siteConfig.ts`
- Theme is now configured via `defaultTheme` field in siteConfig instead of ThemeContext.tsx
- ThemeContext.tsx now imports and uses `siteConfig.defaultTheme` with fallback to "tan"
- Fork configuration script (`configure-fork.ts`) now updates siteConfig.ts for theme changes
- Backward compatible: existing sites work without changes
### Technical
- Added `Theme` type export to `src/config/siteConfig.ts`
- Added `defaultTheme?: Theme` field to SiteConfig interface
- Updated `src/context/ThemeContext.tsx` to import from siteConfig
- Renamed `updateThemeContext` to `updateThemeConfig` in `scripts/configure-fork.ts`
- Updated documentation: `docs.md`, `setup-guide.md`, `FORK_CONFIG.md`, `fork-configuration-guide.md`
## [2.8.0] - 2026-01-03
### Added

4
content/blog/fork-configuration-guide.md
View File

@@ -84,7 +84,7 @@ Updating public/llms.txt...
Updating public/robots.txt...
Updating public/openapi.yaml...
Updating public/.well-known/ai-plugin.json...
Updating src/context/ThemeContext.tsx...
Updating default theme in src/config/siteConfig.ts...
Configuration complete!
```
@@ -113,7 +113,7 @@ The configuration script updates these files:
| `public/robots.txt` | Sitemap URL |
| `public/openapi.yaml` | Server URL, site name |
| `public/.well-known/ai-plugin.json` | Plugin metadata |
| `src/context/ThemeContext.tsx` | Default theme |
| `src/config/siteConfig.ts` | Default theme (`defaultTheme` field) |
## Optional settings

9
content/blog/setup-guide.md
View File

@@ -551,7 +551,7 @@ Follow the step-by-step guide in `FORK_CONFIG.md` to update each file manually.
| `public/robots.txt` | Sitemap URL and header comment |
| `public/openapi.yaml` | API title, server URL, site name in examples |
| `public/.well-known/ai-plugin.json` | Site name, descriptions |
| `src/context/ThemeContext.tsx` | Default theme |
| `src/config/siteConfig.ts` | Default theme (`defaultTheme` field) |
### Site title and description metadata
@@ -992,10 +992,13 @@ The button uses Phosphor ArrowUp icon and works with all four themes. It uses a
### Change the Default Theme
Edit `src/context/ThemeContext.tsx`:
Configure in `src/config/siteConfig.ts`:
```typescript
const DEFAULT_THEME: Theme = "tan"; // Options: "dark", "light", "tan", "cloud"
export const siteConfig: SiteConfig = {
// ... other config
defaultTheme: "tan", // Options: "dark", "light", "tan", "cloud"
};
```
### Change the Font

30
content/pages/changelog-page.md
View File

@@ -12,6 +12,36 @@ docsSectionOrder: 4
All notable changes to this project.
![](https://img.shields.io/badge/License-MIT-yellow.svg)
## v2.8.1
Released January 3, 2026
**Centralized defaultTheme in siteConfig.ts**
- Theme configuration moved from ThemeContext.tsx to siteConfig.ts
- New `defaultTheme` field in siteConfig for centralized theme management
- ThemeContext.tsx now imports theme setting from siteConfig
- Fork configuration script updated to modify siteConfig.ts
- Backward compatible: falls back to "tan" if defaultTheme not set
**Configuration example:**
```typescript
export const siteConfig: SiteConfig = {
// ... other config
defaultTheme: "tan", // Options: "dark", "light", "tan", "cloud"
};
```
**Technical details:**
- Added `Theme` type export to `src/config/siteConfig.ts`
- Added `defaultTheme?: Theme` field to SiteConfig interface
- Updated `src/context/ThemeContext.tsx` to import from siteConfig
- Renamed `updateThemeContext` to `updateThemeConfig` in `scripts/configure-fork.ts`
Updated files: `src/config/siteConfig.ts`, `src/context/ThemeContext.tsx`, `scripts/configure-fork.ts`, `content/pages/docs.md`, `content/blog/setup-guide.md`, `FORK_CONFIG.md`, `content/blog/fork-configuration-guide.md`
## v2.8.0
Released January 3, 2026

9
content/pages/docs.md
View File

@@ -462,7 +462,7 @@ Follow the step-by-step guide in `FORK_CONFIG.md` to update each file manually.
| `public/robots.txt` | Sitemap URL and header comment |
| `public/openapi.yaml` | API title, server URL, site name in examples |
| `public/.well-known/ai-plugin.json` | Site name, descriptions |
| `src/context/ThemeContext.tsx` | Default theme |
| `src/config/siteConfig.ts` | Default theme (`defaultTheme` field) |
### Site title and description metadata
@@ -780,10 +780,13 @@ Uses Phosphor ArrowUp icon and works with all themes.
Default: `tan`. Options: `dark`, `light`, `tan`, `cloud`.
Edit `src/context/ThemeContext.tsx`:
Configure in `src/config/siteConfig.ts`:
```typescript
const DEFAULT_THEME: Theme = "tan";
export const siteConfig: SiteConfig = {
// ... other config
defaultTheme: "tan",
};
```
### Font

30
public/raw/changelog.md
View File

@@ -8,6 +8,36 @@ Date: 2026-01-03
All notable changes to this project.
![](https://img.shields.io/badge/License-MIT-yellow.svg)
## v2.8.1
Released January 3, 2026
**Centralized defaultTheme in siteConfig.ts**
- Theme configuration moved from ThemeContext.tsx to siteConfig.ts
- New `defaultTheme` field in siteConfig for centralized theme management
- ThemeContext.tsx now imports theme setting from siteConfig
- Fork configuration script updated to modify siteConfig.ts
- Backward compatible: falls back to "tan" if defaultTheme not set
**Configuration example:**
```typescript
export const siteConfig: SiteConfig = {
// ... other config
defaultTheme: "tan", // Options: "dark", "light", "tan", "cloud"
};
```
**Technical details:**
- Added `Theme` type export to `src/config/siteConfig.ts`
- Added `defaultTheme?: Theme` field to SiteConfig interface
- Updated `src/context/ThemeContext.tsx` to import from siteConfig
- Renamed `updateThemeContext` to `updateThemeConfig` in `scripts/configure-fork.ts`
Updated files: `src/config/siteConfig.ts`, `src/context/ThemeContext.tsx`, `scripts/configure-fork.ts`, `content/pages/docs.md`, `content/blog/setup-guide.md`, `FORK_CONFIG.md`, `content/blog/fork-configuration-guide.md`
## v2.8.0
Released January 3, 2026

9
public/raw/documentation.md
View File

@@ -452,7 +452,7 @@ Follow the step-by-step guide in `FORK_CONFIG.md` to update each file manually.
| `public/robots.txt` | Sitemap URL and header comment |
| `public/openapi.yaml` | API title, server URL, site name in examples |
| `public/.well-known/ai-plugin.json` | Site name, descriptions |
| `src/context/ThemeContext.tsx` | Default theme |
| `src/config/siteConfig.ts` | Default theme (`defaultTheme` field) |
### Site title and description metadata
@@ -770,10 +770,13 @@ Uses Phosphor ArrowUp icon and works with all themes.
Default: `tan`. Options: `dark`, `light`, `tan`, `cloud`.
Edit `src/context/ThemeContext.tsx`:
Configure in `src/config/siteConfig.ts`:
```typescript
const DEFAULT_THEME: Theme = "tan";
export const siteConfig: SiteConfig = {
// ... other config
defaultTheme: "tan",
};
```
### Font

4
public/raw/fork-configuration-guide.md
View File

@@ -74,7 +74,7 @@ Updating public/llms.txt...
Updating public/robots.txt...
Updating public/openapi.yaml...
Updating public/.well-known/ai-plugin.json...
Updating src/context/ThemeContext.tsx...
Updating default theme in src/config/siteConfig.ts...
Configuration complete!
```
@@ -103,7 +103,7 @@ The configuration script updates these files:
| `public/robots.txt` | Sitemap URL |
| `public/openapi.yaml` | Server URL, site name |
| `public/.well-known/ai-plugin.json` | Plugin metadata |
| `src/context/ThemeContext.tsx` | Default theme |
| `src/config/siteConfig.ts` | Default theme (`defaultTheme` field) |
## Optional settings

9
public/raw/setup-guide.md
View File

@@ -540,7 +540,7 @@ Follow the step-by-step guide in `FORK_CONFIG.md` to update each file manually.
| `public/robots.txt` | Sitemap URL and header comment |
| `public/openapi.yaml` | API title, server URL, site name in examples |
| `public/.well-known/ai-plugin.json` | Site name, descriptions |
| `src/context/ThemeContext.tsx` | Default theme |
| `src/config/siteConfig.ts` | Default theme (`defaultTheme` field) |
### Site title and description metadata
@@ -981,10 +981,13 @@ The button uses Phosphor ArrowUp icon and works with all four themes. It uses a
### Change the Default Theme
Edit `src/context/ThemeContext.tsx`:
Configure in `src/config/siteConfig.ts`:
```typescript
const DEFAULT_THEME: Theme = "tan"; // Options: "dark", "light", "tan", "cloud"
export const siteConfig: SiteConfig = {
// ... other config
defaultTheme: "tan", // Options: "dark", "light", "tan", "cloud"
};
```
### Change the Font

14
scripts/configure-fork.ts
View File

@@ -809,16 +809,16 @@ function updateAiPluginJson(config: ForkConfig): void {
console.log(` Updated: public/.well-known/ai-plugin.json`);
}
// Update src/context/ThemeContext.tsx
function updateThemeContext(config: ForkConfig): void {
// Update default theme in siteConfig.ts
function updateThemeConfig(config: ForkConfig): void {
if (!config.theme) return;
console.log("\nUpdating src/context/ThemeContext.tsx...");
console.log("\nUpdating default theme in src/config/siteConfig.ts...");
updateFile("src/context/ThemeContext.tsx", [
updateFile("src/config/siteConfig.ts", [
{
search: /const DEFAULT_THEME: Theme = "(?:dark|light|tan|cloud)";/,
replace: `const DEFAULT_THEME: Theme = "${config.theme}";`,
search: /defaultTheme: "(?:dark|light|tan|cloud)"/,
replace: `defaultTheme: "${config.theme}"`,
},
]);
}
@@ -844,7 +844,7 @@ function main(): void {
updateRobotsTxt(config);
updateOpenApiYaml(config);
updateAiPluginJson(config);
updateThemeContext(config);
updateThemeConfig(config);
console.log("\n=========================");
console.log("Configuration complete!");

4
src/components/SocialFooter.tsx
View File

@@ -2,7 +2,7 @@ import siteConfig from "../config/siteConfig";
import type { SocialLink } from "../config/siteConfig";
import {
GithubLogo,
TwitterLogo,
XLogo,
LinkedinLogo,
InstagramLogo,
YoutubeLogo,
@@ -16,7 +16,7 @@ import {
// Exported for reuse in header social icons
export const platformIcons: Record<SocialLink["platform"], Icon> = {
github: GithubLogo,
twitter: TwitterLogo,
twitter: XLogo,
linkedin: LinkedinLogo,
instagram: InstagramLogo,
youtube: YoutubeLogo,

12
src/config/siteConfig.ts
View File

@@ -80,6 +80,11 @@ export interface GitHubRepoConfig {
// default font family options: "serif" (New York), "sans" (system fonts), "monospace" (IBM Plex Mono)
export type FontFamily = "serif" | "sans" | "monospace";
// Theme configuration
// Controls the default color theme for the site
// Options: "dark", "light", "tan", "cloud"
export type Theme = "dark" | "light" | "tan" | "cloud";
// Right sidebar configuration
// Shows CopyPageDropdown in a right sidebar on posts/pages at 1135px+ viewport width
export interface RightSidebarConfig {
@@ -274,6 +279,9 @@ export interface SiteConfig {
// Font family configuration
fontFamily: FontFamily;
// Default theme configuration
defaultTheme?: Theme;
// Featured section configuration
featuredViewMode: "cards" | "list";
featuredTitle: string; // Featured section title (e.g., "Get started:", "Featured", "Popular")
@@ -374,6 +382,10 @@ export const siteConfig: SiteConfig = {
// Options: "serif" (New York), "sans" (system fonts), "monospace" (IBM Plex Mono)
fontFamily: "sans",
// Default theme configuration
// Options: "dark", "light", "tan", "cloud"
defaultTheme: "tan",
// Featured section configuration
// viewMode: 'list' shows bullet list, 'cards' shows card grid with excerpts
featuredViewMode: "cards",

8
src/context/ThemeContext.tsx
View File

@@ -1,10 +1,8 @@
import { createContext, useContext, useState, useEffect, ReactNode } from "react";
import { siteConfig, Theme } from "../config/siteConfig";
// Available theme options
type Theme = "dark" | "light" | "tan" | "cloud";
// Default theme for new users (tan matches warm aesthetic)
const DEFAULT_THEME: Theme = "tan";
// Default theme for new users (reads from siteConfig, falls back to "tan")
const DEFAULT_THEME: Theme = siteConfig.defaultTheme || "tan";
interface ThemeContextType {
theme: Theme;

25
src/pages/Post.tsx
View File

@@ -13,7 +13,8 @@ import ContactForm from "../components/ContactForm";
import { extractHeadings } from "../utils/extractHeadings";
import { useSidebar } from "../context/SidebarContext";
import { format, parseISO } from "date-fns";
import { ArrowLeft, Link as LinkIcon, Twitter, Rss, Tag } from "lucide-react";
import { ArrowLeft, Link as LinkIcon, Rss, Tag } from "lucide-react";
import { XLogo, LinkedinLogo } from "@phosphor-icons/react";
import { useState, useEffect } from "react";
import siteConfig from "../config/siteConfig";
@@ -452,6 +453,14 @@ export default function Post({
);
};
const handleShareLinkedIn = () => {
const url = encodeURIComponent(window.location.href);
window.open(
`https://www.linkedin.com/sharing/share-offsite/?url=${url}`,
"_blank",
);
};
// Check if this post should use docs layout
if (post.docsSection && siteConfig.docsSection?.enabled) {
const docsHeadings = extractHeadings(post.content);
@@ -639,10 +648,18 @@ export default function Post({
<button
onClick={handleShareTwitter}
className="share-button"
aria-label="Share on Twitter"
aria-label="Share on X"
>
<Twitter size={16} />
<span>Tweet</span>
<XLogo size={16} weight="bold" />
<span>Post</span>
</button>
<button
onClick={handleShareLinkedIn}
className="share-button"
aria-label="Share on LinkedIn"
>
<LinkedinLogo size={16} weight="bold" />
<span>LinkedIn</span>
</button>
<a
href="/rss.xml"