Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Deprecation warnings with Sass 1.77.8 #577

Open
bunnymatic opened this issue Jul 22, 2024 · 2 comments · Fixed by Yohn/PicoCSS#5 · May be fixed by #596
Open

Deprecation warnings with Sass 1.77.8 #577

bunnymatic opened this issue Jul 22, 2024 · 2 comments · Fixed by Yohn/PicoCSS#5 · May be fixed by #596

Comments

@bunnymatic
Copy link

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/[email protected]
with dependencies
[email protected]
[email protected]
[email protected]
[email protected]
@CMDJojo
Copy link

CMDJojo commented Jul 27, 2024

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
Copy link

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.

nstringham added a commit to nstringham/picocss that referenced this issue Aug 18, 2024
@nstringham
refactor: move nested declarations after non-nested declarations
c3bcecb 
see https://sass-lang.com/documentation/breaking-changes/mixed-decls/

fix picocss#577
@nstringham nstringham linked a pull request Aug 18, 2024 that will close this issue
Open
@ehaynes99 ehaynes99 mentioned this issue Aug 27, 2024
Closed
@Yohn Yohn mentioned this issue Nov 10, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
3 participants
@bunnymatic @Webinaut @CMDJojo