Add @font-face rules with metric overrides for Inter, Plus Jakarta Sans, and
JetBrains Mono fallback fonts. Update font stacks to reference the new
fallbacks, preventing cumulative layout shift when custom fonts swap in.
* refactor(docs): simplify CSS with shared placeholders and design tokens
- Extract duplicate H1/H2 underline styles to %heading-underline placeholder
- Add border-radius scale CSS variables (--wt-radius-sm/md/lg/pill)
- Consolidate duplicate .button shadow definitions
- Remove redundant TOC hover state and gentle-bounce animation
- Standardize all border-radius values to use design tokens
Net: -23 lines, more consistent design system.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(docs): increase TOC child item padding for better hover targets
Child items had only 0.1rem vertical padding (cramped), now 0.35rem.
Also removed redundant 0.15rem bottom padding on the li element since
anchor padding now provides sufficient spacing.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(docs): add missing H4 margin definitions
H4 lacked margin-top/bottom, now matches heading hierarchy pattern.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(docs): standardize heading margin ratios to 4:1
- h2: 1.5rem -> 1.6rem top margin (now 4:1 with 0.4rem bottom)
- h3: 1.25rem -> 1.2rem top margin (now 4:1 with 0.3rem bottom)
All headings now use consistent 4:1 top:bottom margin ratio.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(docs): use CSS variable for asymmetric border-radius
Images and code blocks with left accent borders now use
var(--wt-radius-md) instead of hardcoded 0.5rem.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(docs): increase TOC H1 item font-size for better hierarchy
H1 section markers in TOC now use 0.8rem font-size (same as parent
command items) instead of inheriting 0.75rem from child items.
Creates clearer visual hierarchy between H1 and H2 entries.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(docs): reduce TOC child item vertical padding for better density
0.35rem was too tall, making it hard to see all items on one page.
0.2rem provides a good balance between hover target size and density.
Co-Authored-By: Claude <noreply@anthropic.com>
* fix(docs): make TOC links fill parent elements for consistent cursor
Move padding from <li> to <a> elements so links fill the entire
clickable area. This eliminates dead zones where pointer cursor
showed but nothing was clickable.
Co-Authored-By: Claude <noreply@anthropic.com>
---------
Co-authored-by: Claude <noreply@anthropic.com>
Simplify link styling with permanent underline and animated accent on
hover. Update inline code with new color variable and remove padding
from code inside links. Add CSS custom property for inline code text
color in both light and dark themes.
Replace hardcoded shadow values with CSS custom properties for consistency
across light and dark modes. Update image dimensions in documentation.
Consolidate code block and terminal styles using SCSS mixins. Improve
table styling with proper border-collapse and overflow handling. Add print
styles for better document output. Expand demo placeholder parser to
support optional dimension attributes.
Custom "warm workbench" theme now self-contained without Juice inheritance. Eliminates theme extension complexity and provides complete control over documentation site design.
Key changes:
- Removed docs/themes/juice submodule and all Juice template inheritance
- Rewrote base.html as standalone template with full HTML structure
- Migrated all Juice CSS variables and utilities into custom.scss
- Updated config.toml to remove theme reference and rename juice_* config keys
- Consolidated template structure: page.html and index.html now extend base.html directly
- Removed lychee exclusion for Juice theme README (no longer applicable)
- Moved normalize.css from theme to docs/static for direct control
The theme is now fully self-hosted with no external dependencies, making it easier to maintain and extend.
Replace green accent color throughout the documentation with amber
to align with updated brand guidelines. This includes updates to:
- Primary accent colors in light and dark modes
- Hero section gradient backgrounds and drop-shadow effects
- Interactive elements (buttons, links, focus states)
- Search input focus glow
- Code block hover states
- Logo hover effects
Code blocks now feature a distinctive left accent border with subtle shadows
and hover effects for better visual hierarchy. Terminal output styling updated
with improved line-height calculations and gutter spacing.
Typography improved by adding Inter and Plus Jakarta Sans fonts for better
readability and visual distinction between body and heading text.
Hero section enhanced with warm radial gradient background, glowing logo effect
with hover animation, and floating "explore more" button animation. Dark mode
adjustments ensure consistent visual experience across color schemes.
Adds a new CSS variable for a subtle bright white color, and styles
gutter spans in the terminal output to form continuous vertical lines.
The line-height in the terminal class is also adjusted to allow
proper calculation of the gutter span's vertical margin and padding.
Implement a custom "warm workbench" theme for the Worktrunk documentation,
built on the Juice Zola theme. Key features:
- Warm color palette with WCAG AA compliant contrast ratios
- Sticky header and TOC with definitional CSS variable positioning
- Smooth scroll behavior for anchor links and hero buttons
- Logo preload to prevent flash on navigation
- Scrollbar-gutter: stable to prevent layout shift
- Responsive breakpoints with variable overrides
- IntersectionObserver intercept to disable conflicting scroll-spy
The layout system uses CSS custom properties (--wt-header-height,
--wt-main-padding-top) so all dependent calculations stay in sync
automatically, preventing visual jumps when the TOC transitions to
sticky mode.
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-authored-by: Claude <noreply@anthropic.com>
Maximilian Roos