No description
## Summary This PR adds support for logical block-start and block-end CSS properties in Tailwind CSS utilities. These properties are part of the CSS Logical Properties specification and provide writing-mode-aware alternatives to physical top/bottom properties. The following new utilities are added: - **Border utilities**: `border-bs-*` and `border-be-*` (for `border-block-start` and `border-block-end`) - **Margin utilities**: `mbs-*` and `mbe-*` (for `margin-block-start` and `margin-block-end`) - **Scroll margin utilities**: `scroll-mbs-*` and `scroll-mbe-*` (for `scroll-margin-block-start` and `scroll-margin-block-end`) - **Scroll padding utilities**: `scroll-pbs-*` and `scroll-pbe-*` (for `scroll-padding-block-start` and `scroll-padding-block-end`) - **Padding utilities**: `pbs-*` and `pbe-*` (for `padding-block-start` and `padding-block-end`) These utilities follow the same patterns as their existing inline-start/inline-end counterparts and support all standard modifiers (arbitrary values, negative values, opacity modifiers, etc.). ## Changes 1. **utilities.ts**: Added new utility definitions for all block-start/block-end properties 2. **property-order.ts**: Updated CSS property ordering to include the new logical properties in the correct cascade order 3. **utilities.test.ts**: Added comprehensive test cases for all new utilities 4. **utilities.test.ts.snap**: Updated snapshots showing generated CSS for the new utilities ## Test plan All changes are covered by existing test infrastructure: - Unit tests verify correct CSS generation for each utility variant - Snapshot tests validate the complete output for border utilities - Invalid modifier combinations are tested to ensure proper error handling - Tests cover standard values, arbitrary values, negative values, and opacity modifiers https://claude.ai/code/session_01V89HxEtppGVvMtuPbYrayM --------- Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Co-authored-by: Robin Malfait <malfait.robin@gmail.com> |
||
|---|---|---|
| .github | ||
| crates | ||
| integrations | ||
| packages | ||
| patches | ||
| playgrounds | ||
| scripts | ||
| .gitignore | ||
| .prettierignore | ||
| Cargo.lock | ||
| Cargo.toml | ||
| CHANGELOG.md | ||
| LICENSE | ||
| package.json | ||
| pnpm-lock.yaml | ||
| pnpm-workspace.yaml | ||
| README.md | ||
| rust-toolchain.toml | ||
| turbo.json | ||
| vitest.config.ts | ||
A utility-first CSS framework for rapidly building custom user interfaces.
Documentation
For full documentation, visit tailwindcss.com.
Community
For help, discussion about best practices, or feature ideas:
Discuss Tailwind CSS on GitHub
Contributing
If you're interested in contributing to Tailwind CSS, please read our contributing docs before submitting a pull request.