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

[BD-46] feat: added support Paragon design tokens #303

Draft
wants to merge 6 commits into
base: master
Choose a base branch
from

Conversation

PKulkoRaccoonGang
Copy link
Contributor

@PKulkoRaccoonGang PKulkoRaccoonGang commented Jun 15, 2023

@openedx-webhooks openedx-webhooks added the blended PR is managed through 2U's blended developmnt program label Jun 15, 2023
@openedx-webhooks
Copy link

openedx-webhooks commented Jun 15, 2023

Thanks for the pull request, @PKulkoRaccoonGang!

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.

package.json Outdated Show resolved Hide resolved
@PKulkoRaccoonGang PKulkoRaccoonGang marked this pull request as ready for review August 9, 2023 13:11
@PKulkoRaccoonGang PKulkoRaccoonGang force-pushed the Peter_Kulko/support-design-tokens branch from 854fb53 to 9edae71 Compare August 9, 2023 13:57
@PKulkoRaccoonGang PKulkoRaccoonGang force-pushed the Peter_Kulko/support-design-tokens branch from 9edae71 to 1b0fa1f Compare August 18, 2023 10:55
ghassanmas added a commit to ghassanmas/frontend-app-learning that referenced this pull request Oct 6, 2023
  This PR purpose is to test/demo parago design tokens simliar
  to this one for the profile openedx/frontend-app-profile/pull/764

  it override the following depns as seen in package.json

  - paragon alpha
  - openedx/frontend-build/pull/365
  - openedx/frontend-platform/pull/440
  - openedx/frontend-component-header/pull/351
  - openedx/frontend-component-footer/pull/303

 Conclousion so far:

 - There is an extra library that learning depends on which
  needs to support paragon; `frontend-lib-learning-assistant`
  and also `frontend-lib-special-exams`

 - It would be great to have a gudie or a document to look at,
 while doing the conversion that would **map variable from
 who it was used/named before to the name in design tokens**

 - I was stuck in the end with compliation error, that
 wepack couldn't find `Modal` exported from paragon.
@Mashal-m
Copy link
Contributor

Hey @PKulkoRaccoonGang, What is the current status of this PR, is it ready to review and merge?
Could you please resolve conflicts?

1 similar comment
@Mashal-m
Copy link
Contributor

Hey @PKulkoRaccoonGang, What is the current status of this PR, is it ready to review and merge?
Could you please resolve conflicts?

@abdullahwaheed
Copy link
Contributor

hi @PKulkoRaccoonGang is this PR still active or should we close it?

@PKulkoRaccoonGang
Copy link
Contributor Author

@Mashal-m @abdullahwaheed Hello! At the moment, all pull requests opened in the edx and openex repositories are awaiting further action on the use of Paragon design tokens in the MFE. Don't pay any attention to them for now.

Full list of pull requests that should just be open for now:

@dcoa
Copy link

dcoa commented Jun 5, 2024

Hi @PKulkoRaccoonGang, thanks for this. I checked these changes and it is still relevant, the only thing left to do is rebase to master, and once the new packages are created update frontend-platform and paragon.

Also with the changes in frontend-build the webpack.dev.config.js needs a change for the example app, the change is only in the entry key:

  entry: {
    app: path.resolve(__dirname, 'example'),
  },

@import "@edx/brand/paragon/variables";
@import "@edx/paragon/scss/core/core";
@import "@edx/brand/paragon/overrides";

@import "@edx/frontend-component-footer/footer";
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
@import "@edx/frontend-component-footer/footer";
@use "@openedx/paragon/dist/core.min.css" as paragonCore;
@use "@openedx/paragon/dist/light.min.css" as paragonLight;
@import "@edx/frontend-component-footer/footer";

For the example app, I think we can use the Paragon installed versions, in this way, it's not necessary to add a js config file, and the styles are applied only for the example app.

@dcoa dcoa force-pushed the Peter_Kulko/support-design-tokens branch from 1b0fa1f to 63c4dca Compare June 5, 2024 11:20
@dcoa dcoa force-pushed the Peter_Kulko/support-design-tokens branch from 63c4dca to e97fb66 Compare June 26, 2024 01:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
blended PR is managed through 2U's blended developmnt program
Projects
No open projects
Status: No status
Development

Successfully merging this pull request may close these issues.

7 participants