-
Notifications
You must be signed in to change notification settings - Fork 282
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
refactor: tailwindcss, remove all unnecessary arbitrary values, update TailwindCSS to v3.4 #269
refactor: tailwindcss, remove all unnecessary arbitrary values, update TailwindCSS to v3.4 #269
Conversation
…e TailwindCSS to v3.4
Nice changes @romanhrynevych 💯 We should pay more attention to the TailwindCSS blog and changelogs All Good! can you resolve this conflicts? |
@sadeghbarati thanks 🙌 Yeah, I will resolve conflict and notify you for review ❤️ |
…nd-classes # Conflicts: # apps/www/src/public/registry/styles/default/calendar.json # apps/www/src/public/registry/styles/default/select.json # apps/www/src/public/registry/styles/new-york/calendar.json # apps/www/src/public/registry/styles/new-york/select.json
@sadeghbarati all conficts was in |
Don't worry about it Zernonia will fixed it later |
Well done @romanhrynevych for this update ! I know that |
I think there is no need for making that changes, in Calendar.vue used <style> tag with @apply styles, if styles was defined like classNames maybe, but now I think we can just leave this) |
Also, I'm not a very big fan of |
Deploying with Cloudflare Pages
|
Dam, I'll resolve the conflict |
1. Remove some arbitrary values: For example we had
translate-x-[-50%]
previously, but there is-translate-x-1/2
predefined class 🙂2. In TailwindCSS v3.4 we received extended
min/max-width/height
predefined rules: updated all values to be more native [min-w-[8rem]
->min-w-32
]3. In TailwindCSS v3.3 we received CSS variabled without var(): update all custom variables [
h-[var(--radix-select-trigger-height)]
->h-[--radix-select-trigger-height]
]4. Grid Updates. There is some custom
grid-templates
defined, for examplegrid-cols-[25px_1fr]
, but usefr
values without wrap it insideminmax(0,*fr)
not safe, so updated all values to be wrapped up. [grid-cols-[25px_1fr]
->grid-cols-[25px_minmax(0,1fr)]
]. As a reference used defaultgrid-templates
rules, whereminmax
used. Link to docsIf you have some suggestions or wishes please add comments, I will update my PR ❤️