SASS Deprecation Warning

[stijns96]

Describe the bug

I'm using SCSS in my projects and use SASS to compile it. However, they now giving me this nesting warnings. More info here.

The warnings only appear with sass v1.77.7

Deprecation Warning: Sass's behavior for declarations that appear after nested
rules will be changing to match the behavior specified by CSS in an upcoming
version. To keep the existing behavior, move the declaration above the nested
rule. To opt into the new behavior, wrap the declaration in `& {}`.

More info: https://sass-lang.com/d/mixed-decls

    ╷
44  │ ┌   body:not(.is-using-mouse) & :focus {
45  │ │     box-shadow: $fancybox-focus-shadow;
46  │ │   }
    │ └─── nested rule
... │
52  │     --carousel-button-svg-height: 24px;
    │     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
    ╵
    node_modules/@fancyapps/ui/src/Fancybox/scss/base.scss 52:3  @import
    ~@fancyapps/ui/src/Fancybox/Fancybox.scss 6:9                @use
    src/assets/scss/modules/fancybox/index.scss 1:1              root stylesheet

Warning: 8 repetitive deprecation warnings omitted.
Run in verbose mode to see all warnings.

Reproduction

/

Additional context

No response

[Patta]

@stijns96 seems that this is the wrong repo. issue belongs to https://github.com/nolimits4web/swiper

[stijns96]

Hi @Patta,

I copied it from my issue in swiperjs indeed. I'm going to update this issue, because it is also happening with Fancybox.

Update
Description now has been updated