fix: sass config

[tomleo]

🔗 Linked issue

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality like performance)
• ✨ New feature (a non-breaking change that adds functionality)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

• Update vite to 5.4.0 which fixes a bug via vitejs/vite@1025bb6 allowing hooks into the dart-sass API to silence deprecation warnings
• Update to silence deprecation warnings (also applied to es-bs-base)
• Made sure we're using the same version of SASS in es-bs-base and es-ds-docs

🥼 Testing

🧐 Feedback Requested / Focus Areas

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.
• I have documented testing approach

[nathanielwarner]

I think we should try fixing the deprecation warnings before we silence them. If we ignore them, the behavior will change in a future version of sass.

[tomleo]

I think we should try fixing the deprecation warnings before we silence them. If we ignore them, the behavior will change in a future version of sass.

The particular warning being silenced was

175 │ ┌           > .container#{breakpoints.breakpoint-infix($size, variables.$container-max-widths)} {
176 │ │             @extend %container-navbar-expand-#{$breakpoint};
177 │ │           }
    │ └─── nested rule
... │
183 │           justify-content: flex-start;
    │           ^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
    ╵
    ../es-bs-base/scss/_navbar.scss 183:9             @content
    ../es-bs-base/scss/mixins/_breakpoints.scss 69:5  media-breakpoint-up()
    ../es-bs-base/scss/_navbar.scss 181:7             @use
    ../es-bs-base/scss/bootstrap.scss 27:1            root stylesheet

[nathanielwarner]

I think we should try fixing the deprecation warnings before we silence them. If we ignore them, the behavior will change in a future version of sass.

The particular warning being silenced was

175 │ ┌           > .container#{breakpoints.breakpoint-infix($size, variables.$container-max-widths)} {
176 │ │             @extend %container-navbar-expand-#{$breakpoint};
177 │ │           }
    │ └─── nested rule
... │
183 │           justify-content: flex-start;
    │           ^^^^^^^^^^^^^^^^^^^^^^^^^^^ declaration
    ╵
    ../es-bs-base/scss/_navbar.scss 183:9             @content
    ../es-bs-base/scss/mixins/_breakpoints.scss 69:5  media-breakpoint-up()
    ../es-bs-base/scss/_navbar.scss 181:7             @use
    ../es-bs-base/scss/bootstrap.scss 27:1            root stylesheet

That's correct yeah. This is the issue in question I think we should try to address. It just involves moving the declaration above the nested rule for each of the 6 instances