While working on one of my newer sites, which I created from this template repository, I found out that I was not able to use TailwindCSS
fill utility class, which can change the fill color of SVG elements.
Reason for this was that this repo is still on TailwindCSS 3.0.0-alpha1
It can be fixed by using the newer stable version 3.0.23, as shown here: https://github.com/ricardobalk/webdevsunite/blob/ef763ea0965efe1680b2f3cd5f56196c4683e5ec/package.json#L13, it being used here: https://github.com/ricardobalk/webdevsunite/blob/ef763ea0965efe1680b2f3cd5f56196c4683e5ec/layouts/home.vue#L94.
~~Don't blame me for using
@apply instead of normal CSS classes. I like my code to be readable and beautiful. Which is kinda the opposite of TailwindCSS, as in, a tool of quickly prototyping apps by not having to think about class names, but yeah.~~
Update TailwindCSS to 3.0.23.
Step 1: Smash these commands into your command line of choice. Also, use
npm install instead of
yarn if you'd like 😉
git clone https://github.com/ricardobalk/nuxt3-tailwindcss ~/Git/nuxt3-tailwindcss \
&& cd $_ \
&& git checkout develop \
&& git branch feature/update-tailwindcss-3.0.23 \
&& git checkout $_ \
&& yarn add -D tailwindcss@^3.0.23 && git add --all \
&& git commit -m 'Upgrade TailwindCSS to version 3.0.23' \
&& git push -u origin feature/update-tailwindcss-3.0.23
Step 2: Make a PR.