refactor: update Sass modules to use @use instead of @import

[ThanishaDewangan]

Description

The codebase currently uses deprecated Sass @import statements which will be removed in Dart Sass 3.0.0. We need to update these to use the modern @use syntax.

Current Behavior

• Sass files use deprecated @import statements
• Mixins and variables are globally available without namespacing
• Extend statements may fail if placeholders aren't found
• Storybook shows deprecation warnings

Expected Behavior

• All Sass files should use @use instead of @import
• Mixins and variables should be properly namespaced
• Extend statements should be made optional with !optional flag
• No deprecation warnings in Storybook

[vtushar06]

Hi @ThanishaDewangan 👋
I’d like to help with this Sass refactor. Could you please let me know if this issue is still open for contribution or if there are remaining files I can work on?

Thanks!

[AnubhavGitHub07]

Hi! 👋
I'm Anubhav, a new contributor interested in working on this issue as my first contribution to Rocket.Chat.

I noticed the last comment was from June 14 , so I wanted to check if this issue is still open.
If yes, I’d be happy to take it up.

Here’s how I plan to approach it:

• Go through all SCSS files under packages/fuselage and identify occurrences of @import.
• Replace them with the modern Sass module syntax using @use or @forward where appropriate, following the official Sass migration guide.
• Verify that the build and Storybook components work as expected after the change.

This will help modernize the Sass codebase and make it more maintainable going forward.
Please let me know if I can proceed. Thanks!

[SDV96]

IS THIS ISSUE SOLVED I CAN IMPROVE IT By..... if @ThanishaDewangan approves assign within 1 WEEKS {WORKING NOW}