Skip to content

Commit 60d8b79

Browse files
committed
feat(config): add support for multiple CSS entry points (#174)
- Add TAILWIND_CLI_CSS_MAP setting for multiple source/destination pairs - Add CSSEntry NamedTuple for structured CSS entry representation - Add mutual exclusivity validation between single-file and multi-file modes - Update template tag to use Config class for consistent validation - Add optional name parameter to {% tailwind_css %} for filtering entries - Add MultiWatchProcessManager for parallel watch processes - Add integration tests for multi-file build and watch commands - Add documentation for new settings and template tag usage
1 parent 49887c5 commit 60d8b79

11 files changed

Lines changed: 832 additions & 110 deletions

File tree

CHANGELOG.md

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,18 @@
22

33
## Unreleased
44

5+
### 🎯 New Features
6+
- **Multiple CSS entry points**: Added `TAILWIND_CLI_CSS_MAP` setting for compiling multiple CSS files in a single project (e.g., separate admin and frontend styles)
7+
- **Template tag enhancement**: `{% tailwind_css %}` now supports optional name parameter for multi-file mode: `{% tailwind_css "admin" %}`
8+
59
### 🔧 Technical Improvements
610
- **Django support**: Dropped support for Django 5.1 (now supporting Django 4.2 LTS, 5.2, and 6.0 only)
711
- **Pre-commit hooks**: Updated uv-secure (0.15.4) and pyright (1.1.407)
812
- **Security**: Updated Django and Werkzeug to fix security vulnerabilities
913
- **Documentation**: Migrated from MkDocs to Sphinx with myst-parser and Furo theme
1014
- **Documentation**: Added Advanced Configuration and Development Workflow pages
15+
- **Template tag consistency**: Template tag now uses Config class for consistent validation
16+
- **Test coverage**: Added integration tests for multi-file build and watch commands
1117

1218
### 🛠️ Developer Experience
1319
- **Cleanup command**: Added `just clean` target to remove temporary files and build artifacts

docs/settings.md

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,6 +85,30 @@ If it is an absolute path, this path is used as the input file for Tailwind CSS
8585
The name of the output file. This file is stored relative to the first element of the
8686
`STATICFILES_DIRS` array.
8787

88+
### TAILWIND_CLI_CSS_MAP
89+
90+
**Default**: `None`
91+
92+
A list of tuples defining multiple CSS source/destination pairs. Each tuple contains:
93+
- Source CSS file path (relative to `BASE_DIR`)
94+
- Destination CSS file path (relative to `STATICFILES_DIRS[0]`)
95+
96+
```python
97+
TAILWIND_CLI_CSS_MAP = [
98+
("admin.css", "admin.output.css"),
99+
("web.css", "web.output.css"),
100+
]
101+
```
102+
103+
:::{warning}
104+
This setting is **mutually exclusive** with `TAILWIND_CLI_SRC_CSS` and `TAILWIND_CLI_DIST_CSS`.
105+
You cannot use both configuration modes at the same time. If `TAILWIND_CLI_CSS_MAP` is defined,
106+
the single-file settings will be ignored and a warning will be raised.
107+
:::
108+
109+
The entry name is derived from the source filename (without extension). This name can be used
110+
with the `{% tailwind_css %}` template tag to include specific CSS files.
111+
88112
### TAILWIND_CLI_USE_DAISY_UI
89113

90114
**Default**: `False`
@@ -198,6 +222,61 @@ Example content of `src/styles/daisyui.css` with theme configuration:
198222

199223
For more configuration options, see the [DaisyUI Configuration Documentation](https://daisyui.com/docs/config/).
200224

225+
### Multiple CSS Entry Points
226+
227+
For projects that need separate CSS files for different parts of the application (e.g., admin panel and public website):
228+
229+
```python
230+
# settings.py
231+
TAILWIND_CLI_CSS_MAP = [
232+
("styles/admin.css", "css/admin.css"),
233+
("styles/web.css", "css/web.css"),
234+
]
235+
```
236+
237+
Example source files:
238+
239+
`styles/admin.css`:
240+
```css
241+
@import "tailwindcss";
242+
243+
@source "../templates/admin/**/*.html";
244+
245+
@layer components {
246+
.admin-panel {
247+
@apply bg-gray-100 p-4 rounded-lg;
248+
}
249+
}
250+
```
251+
252+
`styles/web.css`:
253+
```css
254+
@import "tailwindcss";
255+
256+
@source "../templates/web/**/*.html";
257+
258+
@layer components {
259+
.hero-section {
260+
@apply bg-gradient-to-r from-blue-500 to-purple-600;
261+
}
262+
}
263+
```
264+
265+
In your templates, include all CSS files or filter by name:
266+
267+
```htmldjango
268+
{# Include all CSS files #}
269+
{% tailwind_css %}
270+
271+
{# Include only admin CSS #}
272+
{% tailwind_css "admin" %}
273+
274+
{# Include only web CSS #}
275+
{% tailwind_css "web" %}
276+
```
277+
278+
The `build` command processes all entries, and the `watch` command monitors all source files simultaneously.
279+
201280
### Staging Environment
202281

203282
Balanced between dev flexibility and prod stability:

docs/template_tags.md

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,3 +28,35 @@ Depending on the value of the variable `settings.DEBUG` it also activates preloa
2828
```html
2929
<link rel="stylesheet" href="/static/css/styles.css" />
3030
```
31+
32+
### Optional `name` Parameter
33+
34+
When using `TAILWIND_CLI_CSS_MAP` for multiple CSS entry points, you can optionally filter
35+
which CSS files to include by passing a name:
36+
37+
```htmldjango
38+
{# Include all CSS files defined in CSS_MAP #}
39+
{% tailwind_css %}
40+
41+
{# Include only the "admin" entry #}
42+
{% tailwind_css "admin" %}
43+
44+
{# Include only the "web" entry #}
45+
{% tailwind_css "web" %}
46+
```
47+
48+
The name corresponds to the source filename (without extension and path) defined in your
49+
`TAILWIND_CLI_CSS_MAP` setting. For example, with this configuration:
50+
51+
```python
52+
TAILWIND_CLI_CSS_MAP = [
53+
("styles/admin.css", "css/admin.output.css"),
54+
("styles/web.css", "css/web.output.css"),
55+
]
56+
```
57+
58+
- `{% tailwind_css "admin" %}` includes only `css/admin.output.css`
59+
- `{% tailwind_css "web" %}` includes only `css/web.output.css`
60+
- `{% tailwind_css %}` includes both files
61+
62+
If the specified name doesn't match any entry, no output is generated.

0 commit comments

Comments
 (0)