d523f0f600
Document application modes (development/debug/production) Add global file drop handler, order column normalization, SPA hash fix Serve CDN assets via /_vendor/ URLs instead of merging into bundles Add production minification with license preservation Improve JSON formatting for debugging and production optimization Add CDN asset caching with CSS URL inlining for production builds Add three-mode system (development, debug, production) Update Manifest CLAUDE.md to reflect helper class architecture Refactor Manifest.php into helper classes for better organization Pre-manifest-refactor checkpoint: Add app_mode documentation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
CSS Modules: Local by Default
Transformation examples:
Selectors (mode local, by default)::
.foo { ... } /* => */ :local(.foo) { ... }
.foo .bar { ... } /* => */ :local(.foo) :local(.bar) { ... }
/* Shorthand global selector */
:global .foo .bar { ... } /* => */ .foo .bar { ... }
.foo :global .bar { ... } /* => */ :local(.foo) .bar { ... }
/* Targeted global selector */
:global(.foo) .bar { ... } /* => */ .foo :local(.bar) { ... }
.foo:global(.bar) { ... } /* => */ :local(.foo).bar { ... }
.foo :global(.bar) .baz { ... } /* => */ :local(.foo) .bar :local(.baz) { ... }
.foo:global(.bar) .baz { ... } /* => */ :local(.foo).bar :local(.baz) { ... }
Declarations (mode local, by default):
.foo {
animation-name: fadeInOut, global(moveLeft300px), local(bounce);
}
.bar {
animation: rotate 1s, global(spin) 3s, local(fly) 6s;
}
/* => */
:local(.foo) {
animation-name: :local(fadeInOut), moveLeft300px, :local(bounce);
}
:local(.bar) {
animation: :local(rotate) 1s, spin 3s, :local(fly) 6s;
}
Pure Mode
In pure mode, all selectors must contain at least one local class or id selector
To ignore this rule for a specific selector, add the a /* cssmodules-pure-ignore */ comment in front
of the selector:
/* cssmodules-pure-ignore */
:global(#modal-backdrop) {
...;
}
or by adding a /* cssmodules-pure-no-check */ comment at the top of a file to disable this check for the whole file:
/* cssmodules-pure-no-check */
:global(#modal-backdrop) {
...;
}
:global(#my-id) {
...;
}
Building
$ npm install
$ npm test
- Build:
- Lines:
- Statements:
Development
$ yarn test:watch
License
MIT
With thanks
Mark Dalgleish, 2015.