[Bug]: Upgrade Sass to fix breaking changes

[georgephillips]

Bug description

@import is deprecated in the latest versions of sass (https://sass-lang.com/documentation/breaking-changes/import/). So is desaturate: https://sass-lang.com/documentation/modules/color/#desaturate

Expected behavior

It should work exactly the same with no warnings.

Steps to reproduce

1. Build with sass 1.80.4
2. See error:

Deprecation Warning [color-functions]: lighten() is deprecated. Suggestions:

color.scale($color, $lightness: 38.6363636364%)
color.adjust($color, $lightness: 30%)

More info: https://sass-lang.com/d/color-functions

   ╷
57 │             color: lighten(desaturate($select-color-item-text, 100%), $select-lighten-disabled-item-text);
   │                    ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules/tom-select/dist/scss/_items.scss 57:11         @import

and

Deprecation Warning [import]: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import

   ╷
71 │ @import 'items';
   │         ^^^^^^^
   ╵
    node_modules/tom-select/dist/scss/tom-select.scss 71:9      @use
    app/assets/stylesheets/redesign/vendor/tom-select.scss 4:1  @use

Additional context

• OS: [e.g. iOS, Windows]
• Browser [e.g. chrome, safari]
• Version [e.g. 22]
• Device: [e.g. iPhone6]

[xJuvi]

Hey,
there are many other things that would be changed (or deprecated) f.e.

tom-select/src/scss/tom-select.scss

Line 38 in 4522c18

$select-color-dropdown-item-create-text: rgba(red($select-color-text), green($select-color-text), blue($select-color-text), 50%) !default;

Also die change from @import to @use requires some code changes in the scss files. I think also the variables must get an own file for better handling.

Maybe i have enought time the next weeks to refactor and test this.

[xJuvi]

Hi,
I have examined this issue in detail. There are many places that need to be adjusted, but that's not a problem. I have taken care of all of them locally.

The more problematic issue is that we cannot yet switch to “use” and remove “import.”
We will then have to remove Bootstrap4 completely. Bootstrap5 also currently has problems that can be solved indirectly. Modules will only be supported with Bootstrap6. This will be available at the latest when Bootstrap 5.X is released with Dart3.0.0. However, Dart 3.0.0 will not be released until October 2026 at the earliest.

My suggestion:

• Remove all warnings except “import”
• Remove Bootstrap4 at the turn of the year
• Next year, at the latest with the release of Dart3.0.0, remove “import” and implement a workaround for Bootstrap5
• Adapt Bootstrap6

I'll open the next week a PR to fix most of the deprecation warnings.

Kind regards

[andreslucena]

@xJuvi did you manage to open that PR?

I can try to tackle this one if you want.

[xJuvi]

@andreslucena Feel free to solve this. I can support you if you need.