Skip to content

fix: bootstrap update with additional variable - #1562

Merged
leangseu-edx merged 3 commits into
masterfrom
leangseu-edx/bootstrap-core-scss
Aug 16, 2022
Merged

fix: bootstrap update with additional variable#1562
leangseu-edx merged 3 commits into
masterfrom
leangseu-edx/bootstrap-core-scss

Conversation

@leangseu-edx

Copy link
Copy Markdown
Contributor

Description

TLDR; update bootstrap scss version to fix core.scss issue

Bootstrap 4.6.1 doesn't have $transition-collapse-width variable in the scss. Since package.json use bootstrap: ^4.6.1, any project that used paragon will try to install 4.6.2. Hence this issue #1559

Deploy Preview

Include a direct link to your changes in this PR's deploy preview here (e.g., a specific component page).

Merge Checklist

  • If your update includes visual changes, have they been reviewed by a designer? Send them a link to the Netlify deploy preview, if applicable.
  • Does your change adhere to the documented style conventions?
  • Do any prop types have missing descriptions in the Props API tables in the documentation site (check deploy preview)?
  • Were your changes tested using all available themes (see theme switcher in the header of the deploy preview, under the "Settings" icon)?
  • Were your changes tested in the example app?
  • Is there adequate test coverage for your changes?
  • Consider whether this change needs to reviewed/QA'ed for accessibility (a11y). If so, please add wittjeff and adamstankiewicz as reviewers on this PR.

Post-merge Checklist

  • Verify your changes were released to NPM at the expected version.
  • If you'd like, share your contribution in #show-and-tell.
  • 🎉 🙌 Celebrate! Thanks for your contribution.

@netlify

netlify Bot commented Aug 15, 2022

Copy link
Copy Markdown

Deploy Preview for paragon-openedx ready!

Name Link
🔨 Latest commit d346c6b
🔍 Latest deploy log https://app.netlify.com/sites/paragon-openedx/deploys/62fbdf629cd5850009ca3e1c
😎 Deploy Preview https://deploy-preview-1562--paragon-openedx.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

@codecov

codecov Bot commented Aug 15, 2022

Copy link
Copy Markdown

Codecov Report

Merging #1562 (d346c6b) into master (c1aa150) will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##           master    #1562   +/-   ##
=======================================
  Coverage   91.46%   91.46%           
=======================================
  Files         206      206           
  Lines        3490     3490           
  Branches      818      818           
=======================================
  Hits         3192     3192           
  Misses        283      283           
  Partials       15       15           

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

@leangseu-edx
leangseu-edx merged commit ae1f06f into master Aug 16, 2022
@leangseu-edx
leangseu-edx deleted the leangseu-edx/bootstrap-core-scss branch August 16, 2022 19:45
edx-semantic-release pushed a commit that referenced this pull request Aug 16, 2022
## [20.9.2](v20.9.1...v20.9.2) (2022-08-16)

### Bug Fixes

* bootstrap update with additional variable ([#1562](#1562)) ([ae1f06f](ae1f06f))
@edx-semantic-release

Copy link
Copy Markdown
Contributor

🎉 This PR is included in version 20.9.2 🎉

The release is available on:

Your semantic-release bot 📦🚀

pshiu added a commit to openedx-unsupported/frontend-app-payment that referenced this pull request Aug 22, 2022
Newer versions of Bootstrap cause the following error in
frontend-app-payment:

    ERROR in ./example/index.scss (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[4]!./example/index.scss)
    Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
    SassError: Undefined variable.
       ╷
    24 │     @include transition($transition-collapse-width);
       │                         ^^^^^^^^^^^^^^^^^^^^^^^^^^
       ╵
      node_modules/bootstrap/scss/_transitions.scss 24:25  @import
      node_modules/@edx/paragon/scss/core/core.scss 8:9    @import
      example/index.scss 3:9                               root stylesheet

This has been fixed in Paragon 20.9.2. See
openedx/paragon#1562. But we cannot upgrade to
that version of Paragon yet due to a bug in how we use <Dropdown.Toggle>
in frontend-component-header-edx. See previous commit for more details.
pshiu added a commit to openedx-unsupported/frontend-app-payment that referenced this pull request Aug 23, 2022
Newer versions of Bootstrap cause the following error in
frontend-app-payment:

    ERROR in ./example/index.scss (./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[1].use[4]!./example/index.scss)
    Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
    SassError: Undefined variable.
       ╷
    24 │     @include transition($transition-collapse-width);
       │                         ^^^^^^^^^^^^^^^^^^^^^^^^^^
       ╵
      node_modules/bootstrap/scss/_transitions.scss 24:25  @import
      node_modules/@edx/paragon/scss/core/core.scss 8:9    @import
      example/index.scss 3:9                               root stylesheet

This has been fixed in Paragon 20.9.2. See
openedx/paragon#1562. But we cannot upgrade to
that version of Paragon yet due to a bug in how we use <Dropdown.Toggle>
in frontend-component-header-edx. See previous commit for more details.
ghassanmas added a commit to ghassanmas/frontend-app-account that referenced this pull request Sep 6, 2022
  Bootsrap 4.6.2 cause build to fail due to missing variable:
  ref: openedx/paragon/pull/1562
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Importing core.scss is broken due to missing Bootstrap Variables

3 participants