Deprecation warnings with Sass 1.77.8

bunnymatic commented 1 month ago

Describe the issue

Ran into deprecation warnings after upgrading sass to 1.77.8 which means some day, this version of Pico might not work :)

31  │ ┌           @media (min-width: map.get($values, "breakpoint")) {
32  │ │             #{$css-var-prefix}font-size: map.get($values, "root-font-size");
33  │ │           }
    │ └─── nested rule
... │
41  │       #{$css-var-prefix}outline-width: 0.125rem;
    │       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
    ╵
    node_modules/@picocss/pico/scss/themes/default/_styles.scss 41:5               @use
    node_modules/@picocss/pico/scss/themes/_default.scss 2:1                       @use
    node_modules/@picocss/pico/scss/_index.scss 7:1                                @use
    node_modules/@picocss/pico/scss/pico.scss 2:1                                  @use
    frontend/stylesheets/layout.scss 2:1                                           @use
    frontend/javascript/react/components/artwork_browser/artwork_browser.scss 1:1  root stylesheet

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

Current Behavior

Running a build with yarn vite build this kind of error came up a lot.

Expected Behavior

No warnings.

Reproduction URL

I'm working on getting a repro that I can share together.

It came up with a bump from Sass: 1.77.4 to 1.77.8 when these warnings started showing up.

Environment

What feels like related tools and versions

yarn 1.22.22
@picocss/pico@2.0.6
with dependencies
picocolors@1.0.1
picomatch@2.3.1
sass@1.77.8
vite@5.3.4

CMDJojo commented 1 month ago

I also get these warnings, just installed Pico to my Vite project.

sass: 1.77.8
vite: 5.3.1
@picocss/pico: 2.0.6

Webinaut commented 4 weeks ago

Same issue for me. I'm using Pico v2.0.6 with Astrojs and Vite and rolled back Sass from 1.77.8 to 1.77.6 to avoid this message. I'm loving Pico, so hopefully the issue can be resolved without a major re-write.

picocss / pico