fix: improve clipboard success animation in code blocks (#7946)

[Everkers]

Description

Improves the clipboard success animation for code blocks.
The previous animation was abrupt and barely visible, which felt out of place compared to the otherwise modern UI. This PR introduces a smoother transition, to improve visibility and user experience.

Validation

Tested locally by clicking the copy button on multiple code blocks.
The new animation is clearly visible, smoother, and feels more consistent with the design language of the site.

Related Issues

Fixes #7946

Check List

• I have read the Contributing Guidelines and made commit messages that follow the guideline.
• I have run pnpm format to ensure the code follows the style guide.
• I have run pnpm test to check if all tests are passing.
• I have run pnpm build to check if the website builds without errors.
• [] I've covered new added functionality with unit tests if necessary.

Screen.Recording.2025-07-04.at.3.09.44.PM.mov

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
nodejs-org	✅ Ready (Inspect)	Visit Preview	Jul 15, 2025 3:01pm

[avivkeller]

@Everkers Can you take a look at the reviews, and rebase? Thank you!

[Everkers]

@Everkers Can you take a look at the reviews, and rebase? Thank you!

Hello @avivkeller, apologies for the late reply. I've updated the PR to only increase the duration of the toast to avoid the UI flash. Unfortunately, achieving the animation with Radix requires those CSS keyframes, which I agree complicates what should have been a simple change.

[avivkeller]

Thank you! I'm not opposed to the other change, per-say, but IMO it requires separate discussion, since, it's vastly more complex.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 73.12%. Comparing base (b035290) to head (f2cebf6).
Report is 1 commits behind head on main.

✅ All tests successful. No failed tests found.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #7950      +/-   ##
==========================================
+ Coverage   73.10%   73.12%   +0.02%     
==========================================
  Files          95       95              
  Lines        8355     8354       -1     
  Branches      219      218       -1     
==========================================
+ Hits         6108     6109       +1     
+ Misses       2246     2244       -2     
  Partials        1        1              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.