Cursor rule

1---
2description: Tailwind CSS class organization and best practices
3globs: *.vue, *.jsx, *.tsx, *.html
4---
5# Tailwind CSS Standards
6 
7Ensures consistent and optimized usage of Tailwind CSS classes.
8 
9<rule>
10name: tailwind_standards
11description: Enforce Tailwind CSS best practices and organization
12filters:
13  - type: file_extension
14    pattern: "\\.(vue|jsx|tsx|html)$"
15 
16actions:
17  - type: enforce
18    conditions:
19      - pattern: "class=\"[^\"]*\\s{2,}"
20        message: "Remove multiple spaces between Tailwind classes"
21 
22      - pattern: "class=\"[^\"]*(?:text-\\w+\\s+text-\\w+|bg-\\w+\\s+bg-\\w+)"
23        message: "Avoid conflicting utility classes"
24 
25  - type: suggest
26    message: |
27      Tailwind Best Practices:
28      - Group related utilities together
29      - Use @apply for commonly repeated patterns
30      - Follow responsive design patterns
31      - Implement proper dark mode support
32      - Consider extracting components for repeated patterns
33 
34metadata:
35  priority: medium
36  version: 1.0
37</rule>