Unified background colors for smoother visual flow:
Changes:
- Header background: bg-darker → bg-dark (matches body)
- Footer background: bg-darker → bg-dark (matches body)
- Body background: bg-darker → bg-dark (consistent base color)
- Removed redundant main content background override
This creates a cohesive color scheme where:
- Body, header, and footer all use bg-dark (HSL 0, 0%, 17.5%)
- Cards and panels use bg-lighter (HSL 0, 0%, 22%) for subtle contrast
- Rose borders on header/footer provide visual separation
- No more jarring black-to-gray transitions
The result is a smooth, unified dark theme with the Pivoine rose
accent colors providing visual interest and hierarchy.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Enhanced the Pivoine theme with better visual hierarchy and usability:
Logo improvements:
- Fixed logo selector to target .navbar-brand img (not just .logo)
- Logo now properly colorized with primary rose/magenta color
Contrast improvements:
- Changed body background to darker shade (bg-darker)
- Added main content area with lighter background (bg-dark) for better separation
- Added heading styles with rose accent color
- H1/H2 headings now have rose bottom border for visual hierarchy
Button refinements:
- Split button styling into primary buttons and filter buttons
- Filter buttons (.btn-light in .btn-group) now have subtle, elegant styling:
* Lighter background with border
* Smaller size and lighter font weight
* Hover shows rose border and text color
* Active state has solid rose background
- Primary buttons maintain bold rose background styling
The result is clearer visual separation between navigation, content, and
interactive elements with better contrast throughout.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Fixed awkward appearance where Bootstrap .container elements were being
styled as cards with backgrounds, borders, and padding.
Changes:
- Removed .container from card/panel styling rule
- Added explicit .container reset to transparent background
- Removed .container from responsive design rule
- .container now maintains proper Bootstrap layout behavior
This fixes the "inner looks like a card" issue where main content areas
had unwanted card styling applied.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
Updated custom.css to target the actual Bootstrap classes used by
asciinema server instead of generic selectors:
- Added .navbar-dark and .bg-dark overrides for navigation
- Added .btn-light targeting for button styles
- Added .btn.active and .btn-light.active for active button states
This ensures the Pivoine theme properly overrides Bootstrap's default
dark theme classes.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
