Skip to content

hoverkraft-tech/docusaurus-theme

@hoverkraft/docusaurus-theme

Strictly opinionated Docusaurus theme that enforces Hoverkraft branding and accessibility standards.


License PRs Welcome

Overview

@hoverkraft/docusaurus-theme delivers a production-ready Hoverkraft-branded experience for every Docusaurus documentation project. The theme removes customization levers so that every property stays synchronized with the official Hoverkraft design system, accessibility bar, and editorial tone.

Feature Highlights

  • Enforced branding: Colors, typography, spacing, and component styling sourced from the Hoverkraft Branding Guidelines.
  • Accessibility-first: Built to meet WCAG 2.1 Level AA, with detailed practices captured in ACCESSIBILITY.md.
  • Responsive layout: Mobile-first breakpoints and fluid components covering desktop, tablet, and handset experiences.
  • Shared components: Header, footer, hero, feature grid, buttons, and layout primitives with consistent semantics.
  • Print-friendly defaults: Print styles remove noise while preserving content hierarchy.

Documentation

  • Public docs site content lives in packages/docs and is sourced from packages/docs/content.
  • Generated static output is emitted to packages/docs/build during CI and local testing.
  • Component usage and configuration examples are organized under packages/docs/content/components and packages/docs/content/configuration.

Packages

Package Description
packages/theme Source for the published @hoverkraft/docusaurus-theme package (TypeScript, compiled to lib/).
packages/docs Docusaurus site showcasing the theme, used for QA and documentation.

Installation

npm install @hoverkraft/docusaurus-theme

Add the theme to your Docusaurus configuration:

// docusaurus.config.js
module.exports = {
  // ...other config
  themes: ["@hoverkraft/docusaurus-theme"],
};

The theme is opinionated by design and intentionally exposes no customization knobs.

Development

Use make targets to manage both packages in the monorepo:

make setup      # Prepare stack to run
make lint       # Run linters
make build      # Build libs and applications
make start      # Start application in dev mode
  • Run builds before publishing or submitting pull requests to ensure packages/theme/lib is up to date.
  • Accessibility changes must be mirrored in documentation updates; see ACCESSIBILITY.md for the audit checklist.

Testing

make test       # Run tests
make lint       # Run linters
  • Theme unit tests are located in packages/theme/src/__tests__.
  • The docs site can be smoke-tested locally with make start.

Releasing

  1. Update semantic versioning in packages/theme/package.json.
  2. Regenerate packages/theme/lib via make build.
  3. Validate docs output with make build when content changes.
  4. Publish the theme package via your chosen registry workflow (GitHub Actions or manual npm publish).

Contributing

Please review CONTRIBUTING.md for accessibility requirements, review expectations, and code of conduct.

Support

Questions or issues? Open an issue in the GitHub repository or start a discussion.

License

MIT License — see LICENSE for details.