@devagrawal09/specter

// Solid.js with Tailwind CSS .cursorrules

// Prefer functional components

const preferFunctionalComponents = true;

// Solid.js and Tailwind CSS best practices

const solidjsTailwindBestPractices = [ "Use createSignal() for reactive state", "Implement Tailwind CSS classes for styling", "Utilize TypeScript's strict mode", "Utilize @apply directive in CSS files for reusable styles", "Implement responsive design using Tailwind's responsive classes", "Use Tailwind's CSS in /src/styles.css for global styles", "Implement dark mode using Tailwind's dark variant", ];

// Additional instructions

const additionalInstructions = `

1. Use .tsx extension for files with JSX
2. Implement strict TypeScript checks
3. Implement proper Tailwind CSS purging for production builds
4. Utilize TanStack Router for routing when applicable
5. Use type-safe context with createContext
6. Implement proper typing for event handlers
7. Follow TypeScript best practices and naming conventions
8. Use type assertions sparingly and only when necessary
9. Use Tailwind's @layer directive for custom styles
10. Implement utility-first CSS approach
11. Follow both Solid.js and Tailwind naming conventions
12. Use JIT (Just-In-Time) mode for faster development `;