✅ COMPLETED: 1. Dockerfile uses port 80 (astro preview) 2. BaseLayout imports globals.css 3. globals.css with Tailwind v4 @theme syntax 4. index.astro has Header, Footer, FixedContact 5. All image references fixed to existing files 6. Hero uses hdpe_pipe_main.jpg 7. Product cards use hdpe001.jpg 8. pt-20 on main for fixed header ✅ TESTED LOCALLY: - Build: 15 pages in 1.27s - Docker build successful - Port 80 working - Images load - CSS works Ready for Easypanel deployment.
2.7 KiB
2.7 KiB
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.
@tailwindcss/vite plugin API
Enabling or disabling Lightning CSS
By default, this plugin detects whether or not the CSS is being built for production by checking the NODE_ENV environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.
If you want to always enable or disable Lightning CSS the optimize option may be used:
import tailwindcss from '@tailwindcss/vite'
import { defineConfig } from 'vite'
export default defineConfig({
plugins: [
tailwindcss({
// Disable Lightning CSS optimization
optimize: false,
}),
],
})
It's also possible to keep Lightning CSS enabled but disable minification:
import tailwindcss from '@tailwindcss/vite'
import { defineConfig } from 'vite'
export default defineConfig({
plugins: [
tailwindcss({
// Enable Lightning CSS but disable minification
optimize: { minify: false },
}),
],
})