LF-5095: Migrate SCSS from @import to @use

[SayakaOno]

Description

During the build, the following warning is reported:

err: #13 83.68 DEPRECATION WARNING [import]: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.
err: #13 83.68 
err: #13 83.68 More info and automated migrator: https://sass-lang.com/d/import
err: #13 83.68 
err: #13 83.68    ╷
err: #13 83.68 16 │ @import '@assets/mixin.scss';
err: #13 83.68    │         ^^^^^^^^^^^^^^^^^^^^
err: #13 83.68    ╵

This PR updates SCSS files to use @use instead of @import to remove the warning.

Note:
@use adds a namespace by default. In this PR, I used as * to load the module without a namespace.
More info can be found here.

Reference:

• https://sass-lang.com/documentation/breaking-changes/import/

Jira link: https://lite-farm.atlassian.net/browse/LF-5095

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

How Has This Been Tested?

• Passes test case
• UI components visually reviewed on desktop view
• UI components visually reviewed on mobile view
• Other (please explain)

Checklist:

• I have commented my code, particularly in hard-to-understand areas
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• The precommit and linting ran successfully
• I have added or updated language tags for text that's part of the UI
• I have ordered translation keys alphabetically (optional: run pnpm i18n to help with this)
• I have added the GNU General Public License to all new files

[kathyavini]

😍😍😍😍

I don't even know how long I've been used to that flood of errors in the webapp console. Amazing, thank you!!! The SCSS linting is nice too!

It kind of makes me want to hide the 'legacy-js-api' warnings too now, as they are all we have left. I don't think a Vite upgrade is in our immediate future.

Edit: oh, I just saw belatedly the 'legacy-js-api' was mentioned in the Jira ticket for this one. That's not expected to be fixed by this change though, right? I think we have to actively silence that one. I'll open the trivial PR.

[SayakaOno]

Oh, yes! I found out after creating the ticket that it isn’t possible to remove the legacy-js-api warnings at this point!! (without silencing it)