TCBA - Technical Reference

CSS Custom Properties

All modern pages use CSS custom properties for consistent theming. These are defined in tcba-modern.css.

Night Mode (Default)

Variable	Value	Usage
`--bg-primary`	#0a1628	Page background
`--bg-secondary`	#132238	Section background
`--bg-card`	rgba(255,255,255,0.05)	Card backgrounds
`--text-primary`	#ffffff	Main text
`--text-secondary`	rgba(255,255,255,0.85)	Secondary text
`--text-muted`	rgba(255,255,255,0.6)	Muted/disabled text
`--accent`	#ffaa00	Accent color (gold)
`--border-color`	rgba(255,255,255,0.1)	Borders
`--link-color`	#66b3ff	Link text

Day Mode

Variable	Value	Usage
`--bg-primary`	#f5f0e6	Page background
`--bg-secondary`	#fff9f0	Section background
`--text-primary`	#1a1a1a	Main text
`--accent`	#c45500	Accent color (brown)
`--link-color`	#0066cc	Link text

Typography

Font Families

Variable	Value	Usage
`--font-display`	'Bebas Neue', Impact, sans-serif	Headers, titles, labels
`--font-body`	'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif	Body text, paragraphs

Font Sizes

Variable	Value	Usage
`--text-sm`	0.95rem	Small text, captions
`--text-base`	1.1rem	Body text
`--text-lg`	1.35rem	Large text, h4
`--text-xl`	1.75rem	h3 headers
`--text-2xl`	2.25rem	h2 headers
`--text-3xl`	3rem	h1 headers, titles

Era Designation System

Teams are tagged with era indicators showing when they were active in TCBA history:

Tag	Era Name	Color	Hex
Y	Yesterday	Medium Purple	#7B68EE
G	Gold	Peru/Tan	#CD853F
O	Origins	Slate Gray	#708090
T	Today	Steel Blue	#4682B4

Theme Toggle Implementation

HTML Button

<button class="theme-toggle" onclick="toggleTheme()">☀️ Day</button>

CSS Styles

.theme-toggle {
    position: fixed;
    top: 1rem;
    right: 1rem;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    font-family: var(--font-display);
    z-index: 1000;
}

JavaScript

function toggleTheme() {
    const html = document.documentElement;
    const btn = document.querySelector('.theme-toggle');
    const current = html.getAttribute('data-theme') || 'night';
    const next = current === 'night' ? 'day' : 'night';
    html.setAttribute('data-theme', next);
    localStorage.setItem('tcba-theme', next);
    btn.textContent = next === 'night' ? '☀️ Day' : '🌙 Night';
}

Back Navigation

All modernized pages include a floating back-to-home button in the upper-left corner.

HTML Structure

<nav class="back-nav">
    <a href="index.htm"><span class="arrow">←</span> Back</a>
</nav>

CSS Styles (in tcba-modern.css)

.back-nav {
    position: fixed;
    top: 1rem;
    left: 1rem;
    z-index: 1000;
}

.back-nav a {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    text-decoration: none;
    font-family: var(--font-display);
    transition: all 0.2s ease;
}

.back-nav a:hover {
    border-color: var(--accent);
    color: var(--accent);
}

Python Scripts

Script	Purpose	Usage
`extract_team.py`	Extract structured data from Word-generated team pages	`python extract_team.py TeamName.htm`
`modernize_team.py`	Generate modern HTML from extracted data	`python modernize_team.py --batch team_pages_list.txt`
`add_theme_toggle.py`	Add theme toggle button to existing modern pages	`python add_theme_toggle.py`
`add_back_nav.py`	Add floating back navigation to modern pages	`python add_back_nav.py`

Batch Processing Example

# Modernize all team pages
python modernize_team.py --batch team_pages_list.txt

# Force re-process using -OLD backup files
python modernize_team.py --batch team_pages_list.txt --force

# Add theme toggle to all modern pages
python add_theme_toggle.py

# Add back navigation to all modern pages
python add_back_nav.py

File Structure

Key Files

tcba-modern.css

extract_team.py

modernize_team.py

add_theme_toggle.py

add_back_nav.py

team_pages_list.txt

Naming Conventions

Pattern	Example	Description
`TeamName.htm`	Long Island.htm	Modern team page
`TeamName-OLD.htm`	Long Island-OLD.htm	Backup of original
`Career Batting XX.htm`	Career Batting LI.htm	Team batting stats
`Career Pitching by Team XX.htm`	Career Pitching by Team LI.htm	Team pitching stats

Modernized Pages (73 total)

Navigation Pages

LeagueChamps.htm

Franchise Teams.htm

Team Pages.htm

Team_Franchise Link.htm

Team Abbreviations.htm

Stats-Lineup.htm

Player Value Link.htm

Hall of Fame Entrance.htm

Woody's Origins History.htm

Team Pages (64)

All team pages follow the same structure with team header, history brief, all-time record, stats links, and season records table.

Allegheny Innocents.htm

Annapolis.htm

Arlington.htm

Baltimore.htm

Barrow.htm

Beacon.htm

Bergen.htm

Bethesda.htm

Boston Beaneaters.htm

Bradenton.htm

Brooklyn.htm

Buffalo Mules.htm

+ 52 more team pages...

TCBA TECHNICAL REFERENCE

Table of Contents