Skip to content
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

Feature: tailwind animations and fluid typography #13

Merged
merged 2 commits into from
Sep 21, 2024

Conversation

Zyruks
Copy link
Member

@Zyruks Zyruks commented Sep 21, 2024

Changes Made 🎉

  • feat: added tailwindcss-animated and removed tailwindcss-scrollbar:

    • Added tailwindcss-animated version ^1.1.2 to enhance animations in the project.
    • Removed tailwindcss-scrollbar version ^0.1.0 as it is no longer required.
    • Updated tailwindcss from version ^3.3.1 to ^3.4.10 for new features and improvements.
  • feat: updated tailwind.config.js for animation and fluid typography:

    • Replaced the plugin tailwindcss-scrollbar with tailwindcss-animated.
    • Added custom animation delays and durations for more control over animations.
    • Introduced fluid typography for better scaling of text based on viewport sizes, including fluid-base, fluid-lg, fluid-xl, and fluid-2xl.
    • Added small screen breakpoints: 3xs (240px), 2xs (360px), and xs (480px).

Describe Changes

Tailwind CSS has been updated to the latest stable version (^3.4.10).
The deprecated tailwindcss-scrollbar plugin was removed and replaced with tailwindcss-animated, enhancing animation capabilities.

  • The addition of tailwindcss-animated brings animation utilities.
  • Fluid typography ensures text scales appropriately with different screen sizes.
  • Custom breakpoints and animation controls improve responsiveness and animation flexibility.

Checklist ✅

  • My code follows the code style of this project.
  • My change requires a change to the documentation.
  • I have updated the documentation accordingly.

…r, and update tailwindcss

- Added `tailwindcss-animated` version `^1.1.2` to enhance animations in the project.
- Removed `tailwindcss-scrollbar` version `^0.1.0` as it is no longer needed.
- Updated `tailwindcss` from version `^3.3.1` to `^3.4.10` for improved features and fixes.
@Zyruks Zyruks added the Type: Enhancement Suggest an improvement for an existing feature. label Sep 21, 2024
@Zyruks Zyruks requested a review from serudda September 21, 2024 20:25
@Zyruks Zyruks self-assigned this Sep 21, 2024
@Zyruks Zyruks force-pushed the feat/tailwind-animations-and-fluid-typography branch from 8c7f027 to bcfdf31 Compare September 21, 2024 20:39
…typography

- Replaced `tailwindcss-scrollbar` with `tailwindcss-animated` to enable animation utilities.
- Added custom animation delays and durations for enhanced control over animation timings.
- Introduced fluid typography settings to dynamically adjust font sizes based on viewport width:
  - `fluid-base`, `fluid-lg`, `fluid-xl`, `fluid-2xl`.
- Added custom screen sizes (`3xs`, `2xs`, `xs`) for better responsiveness on smaller devices.

chore: 🔧 update pnpm-lock

feat(config): 🔧 add tailwindcss-scrollbar

chore: 🔧 update pnpm-lock
@Zyruks Zyruks force-pushed the feat/tailwind-animations-and-fluid-typography branch from 6fe666d to d68dee8 Compare September 21, 2024 20:42
@serudda serudda merged commit 5a0525d into main Sep 21, 2024
1 check passed
@serudda serudda deleted the feat/tailwind-animations-and-fluid-typography branch September 21, 2024 20:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Type: Enhancement Suggest an improvement for an existing feature.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants