Deprecation Warning [mixed-decls]: Sass's behavior for declarations that appear after nested [...]

[willdurand]

I ran yarn && yarn start and saw this warning in the output:

Deprecation Warning [mixed-decls]: 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

    ┌──> ../../../foundation-sites/scss/xy-grid/_grid.scss
19  │     max-width: $width;
    │     ^^^^^^^^^^^^^^^^^ declaration
    ╵
    ┌──> ../../../foundation-sites/scss/util/_breakpoint.scss
180 │ ┌         @media print, screen and #{$str} {
181 │ │           @content;
182 │ │         }
    │ └─── nested rule
    ╵
    ../../../foundation-sites/scss/xy-grid/_grid.scss 19:3      xy-grid-container()
    ../../../foundation-sites/scss/xy-grid/_classes.scss 14:5   xy-base-grid-classes()
    ../../../foundation-sites/scss/xy-grid/_classes.scss 457:5  foundation-xy-grid-classes()
    ../../../../src/assets/css/styles.scss 27:1                 root stylesheet

We probably need to do something about it.