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.

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

feat: swap bootstrap for paragon sass #27771

Conversation

abutterworth
Copy link
Contributor

@abutterworth abutterworth commented May 28, 2021

Swap Bootstrap SASS for Paragon SASS throughout studio and lms.

Builds off https://github.com/edx/edx-platform/pull/27751 and depends on https://github.com/edx/edx-themes/pull/737.

  • Augment the SASS importer to understand the common ~ in imports to mean node_modules/ that Paragon relies upon
  • Swap Paragon SASS for Bootstrap anywhere it's used. In some cases this means adding all of Paragon in places where only Bootstrap mixins were used. Paragon doesn't offer pulling mixins, variables, and functions independently from the component css.
  • Remove edx-bootstrap from default themes
  • Map some missing colors in Paragon to reasonable defaults (inverse -> white, purchase -> success, lightest -> light-300)
  • Fixes for some minor layout and color regressions

Key file sizes:

file prod https://github.com/edx/edx-platform/pull/27751 + https://github.com/edx/edx-themes/pull/737 This PR + https://github.com/edx/edx-themes/pull/737
lms-course.css 778kb 1.4mb 1.6mb
lms-discussion-bootstrap.css 189kb 210kb 350kb
lms-footer-edx.css 389kb 105kb 841kb
lms-main-v1.css 2.2mb 1.3mb 2.3mb
lms-main.css 1.3mb 371kb 549kb
studio-main-v1.css 1.1mb 2.1mb 2.5mb

Adam Butterworth added 18 commits May 28, 2021 10:21
Paragon core sass depends on the tilda import shortcut
studio-main increases in size by 130kb
studio-main-v1 increases in size by 400kb
lms-discussion-bootstrap.css increases in size by 140kb
lms-main.css increases in size by 180kb
lms-course.css is 200kb larger
lms-footer-edx.css is 700kb larger
lms-main-v1 is 1mb larger
lightest -> $light-300
gray-dark -> $gray-700;
purchase -> $success
its unneeded and caused weird layout
fill in inverse and pink colors immediately after any import of paragon sass. Helps to avoid needing to redefine color concepts in this PR. We assume $inverse is $white by default
@abutterworth abutterworth changed the base branch from master to abutterworth/update-bootstrap May 28, 2021 20:11
@abutterworth abutterworth changed the title wip - bootstrap paragon swap feat: swap bootstrap for paragon sass May 28, 2021
@abutterworth
Copy link
Contributor Author

jenkins run quality

1 similar comment
@abutterworth
Copy link
Contributor Author

jenkins run quality

@edx-status-bot
Copy link

Your PR has finished running tests. There were no failures.

@openedx-webhooks
Copy link

Thanks for the pull request, @abutterworth! Please note that it may take us up to several weeks or months to complete a review and merge your PR.

Feel free to add as much of the following information to the ticket as you can:

  • supporting documentation
  • Open edX discussion forum threads
  • timeline information ("this must be merged by XX date", and why that is)
  • partner information ("this is a course on edx.org")
  • any other information that can help Product understand the context for the PR

All technical communication about the code itself will be done via the GitHub pull request interface. As a reminder, our process documentation is here.

This is currently a draft pull request. When it is ready for our review and all tests are green, click "Ready for Review", or remove "WIP" from the title, as appropriate.

⚠️ We can't start reviewing your pull request until you've submitted a signed contributor agreement or indicated your institutional affiliation. Please see the CONTRIBUTING file for more information. If you've signed an agreement in the past, you may need to re-sign. See The New Home of the Open edX Codebase for details.

Once you've signed the CLA, please allow 1 business day for it to be processed. After this time, you can re-run the CLA check by editing the PR title. If the problem persists, you can tag the @openedx/cla-problems team in a comment on your PR for further assistance.

@kdmccormick
Copy link
Member

This work has stalled. See #31616.

@openedx-webhooks
Copy link

@abutterworth Even though your pull request wasn’t merged, please take a moment to answer a two question survey so we can improve your experience in the future.

@nedbat nedbat deleted the abutterworth/bootstrap-paragon-swap branch January 8, 2024 15:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
open-source-contribution PR author is not from Axim or 2U
Projects
Archived in project
Development

Successfully merging this pull request may close these issues.

4 participants