Osmwithspace/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Introduce TailwindCSS CLI with JIT-Mode

Browse source 
Remove Tailwind Compatibility Mode and PostCSS. Install newest tailwind and configure it to use JIT-Mode. Setup npm run scripts to run TailwindCSS CLI and Parcel in parallel. The Tailwind index.css and all .html/.ts files are scanned live and generated to /css/index-tailwind-output which is in turn included in index.html.
This commit is contained in:
Tobias Jordans 2021-09-22 19:56:05 +02:00
parent 6ceb589f00
commit 45e8b96f9f
7 changed files with 4871 additions and 1230 deletions
Download patch file Download diff file Expand all files Collapse all files

20
index.css
View file

@ -1,17 +1,18 @@
/*
TailwindCSS JIT-Mode Input file.
Use TailwindCSS functions and directives here – https://tailwindcss.com/docs/functions-and-directives
About JIT-Mode: https://tailwindcss.com/docs/just-in-time-mode#styles-rebuild-in-an-infinite-loop
TailwindCSS CLI generates the css/index-tailwind-output.css file based on this file.
It is not used directly in the app.
*/
@tailwind base;
@tailwind components;
@tailwind utilities;
@layer utilities {
@variants responsive {
.max-h-65vh {
max-height: 65vh;
}
.max-h-20vh {
max-height: 20vh;
}
.z-above-map {
z-index: 10000
}
@ -19,7 +20,6 @@
.z-above-controls {
z-index: 10001
}
}
.btn {
@ -381,4 +381,4 @@ li::marker {
.slideshow-item img {
height: var(--image-carousel-height);
width: unset;
}
}