mirror of
https://github.com/tiennm99/HugoBlox-kit.git
synced 2026-10-05 02:13:24 +00:00
- Linting/format - Replace ESLint/Prettier with Biome; remove old configs; add `biome.json`; update scripts - Tailwind-friendly `.stylelintrc.yaml`; Stylelint and Biome pass - Enable Biome across `modules/**`; prune legacy JS globals; ignore oversized `devicon.json` - Code fixes - `hb-theme.js`: avoid assignment-in-expressions; clearer dataset updates - `hugoblox-slides.js`: fix inner var scope (var → let); apply formatting - CI/CD - Split lint/build workflows; add path filters; Node via Corepack (pnpm from package.json) - Hugo pinned to env `HUGO_VERSION`; add consistency check vs `starters/academic-cv/hugoblox.yaml` - Nightly starters matrix build (academic-cv, landing-page); CodeQL weekly; resource caches - Workflows/Community - Greeter: switch to `pull_request_target`; add Contributor Guide to PR message - PR labeler for path-based labels - Repo policies/docs - `CODEOWNERS` for `@gcushen` - `SECURITY.md`, `SUPPORT.md` - Documented branch protection in `.github/settings.yml` - Move `CODE_OF_CONDUCT.md` to `.github/` - docs(zh): update `README.zh.md` translation Notes: - pnpm is sourced from `package.json: packageManager` via Corepack; no hard-coded pnpm versions in CI.
Hugo Blox Tailwind UI
The Hugo Blox web framework utilizing Tailwind CSS v4 with Hugo's native integration for styling components with Tailwind v4.
Requirements
- Hugo v0.148.2+ (Extended Edition)
- Node.js v20+
- pnpm (see
packageManagerfield in package.json)
Quick Start
1. Install Dependencies
pnpm install
2. Run Development Server
hugo server
Tailwind CSS is processed automatically by Hugo using the css.TailwindCSS function.
Features
- Tailwind CSS v4: Latest version with improved performance over Tailwind v3
- Hugo Native Integration: Uses Hugo's built-in
css.TailwindCSSfunction - Dynamic CSS Generation: Only includes utilities actually used in your content for ultra-fast page loads
- No Pre-compilation: CSS is generated on-demand (previously Tailwind v3 was pre-compiled in Hugo Blox as
wc.min.css) - Community Components: Community components work seamlessly without manual compilation
Configuration
The Tailwind configuration is now in CSS format at assets/css/main.css using the @theme directive. The configuration includes:
- Hugo Blox color schemes (primary, secondary, neutral)
- Typography settings
- Safelist patterns for dynamic classes
- Dark mode support
Migration from Tailwind v3
If you're upgrading from Tailwind v3:
- Install the new dependencies:
pnpm install - Remove any
assets/dist/wc.min.cssfiles - Add the
package.jsonfile from the latest starter templates - Update your deployment scripts to install it with
pnpm install(refer to the latest.githubfolder in the starters) - The old
tailwind.config.jsandpostcss.config.jsfiles are no longer needed
Development
For module development:
# Install dependencies
pnpm install
# Run development server
hugo server --disableFastRender
# Build for production
hugo --minify