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

♻️ Replace Grommet Button components #2453

Merged
merged 5 commits into from
Oct 24, 2023

Conversation

AntoLC
Copy link
Contributor

@AntoLC AntoLC commented Oct 5, 2023

Purpose

Replace Grommet Button components

Proposal

  • replace Grommet Button components

@AntoLC AntoLC self-assigned this Oct 5, 2023
@AntoLC AntoLC force-pushed the refacto/anthony/replace-grommet-button branch 2 times, most recently from 5fb1fde to 9e8067d Compare October 10, 2023 10:05
@AntoLC AntoLC force-pushed the refacto/anthony/replace-grommet-button branch 6 times, most recently from 3298c83 to 352bf11 Compare October 19, 2023 10:01
@AntoLC AntoLC marked this pull request as ready for review October 19, 2023 10:07
@AntoLC AntoLC force-pushed the refacto/anthony/replace-grommet-button branch from 352bf11 to 5f6e07c Compare October 19, 2023 13:34
Comment on lines +1 to +4
export const tokens = {
themes: {
default: {
theme: {
Copy link
Member

Choose a reason for hiding this comment

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

How is this file generated ?
Can we get a flatter structure by removing tokens, themes and default ?
This way we can only use color={theme.colors['success-500']} for example
On maybe just export a specific key ?
WDYT ?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yes you'r right.

It is generated here:

"build-theme": "cunningham -g css,ts -o src/cunningham --utility-classes"


We don't have the hand on the generated file but we can add some exports:

const themeTokens = tokens.themes.default.theme;
const colorsTokens = tokens.themes.default.theme.colors;
const componentTokens = tokens.themes.default.components;
export { tokens, themeTokens, componentTokens, colorsTokens };


Easier now:

background-color: ${colorsTokens['primary-500']};

@kernicPanel
Copy link
Member

@AntoLC AntoLC force-pushed the refacto/anthony/replace-grommet-button branch from 5f6e07c to d2db4aa Compare October 20, 2023 08:03
In some cases we just want to have an icon clickable, this
refacto make it possible with our component SVGIcons.
In order to do the transition to the cunningham design system,
we replace the grommet Button component with the cunningham
Button components.
We replace this buttons components by the cunningham Button component.
This components are not used anymore.
The cunningham 2.0.0 must have some updates in the config file.
We can generate a ts cunningham-tokens file, we can access more easily
some tokens in our code with the completion.
@AntoLC AntoLC force-pushed the refacto/anthony/replace-grommet-button branch from d2db4aa to 4a7b8cf Compare October 24, 2023 10:50
@AntoLC AntoLC enabled auto-merge (rebase) October 24, 2023 10:53
@AntoLC AntoLC merged commit 1a975ff into master Oct 24, 2023
33 of 34 checks passed
@AntoLC AntoLC deleted the refacto/anthony/replace-grommet-button branch October 24, 2023 11:07
lunika added a commit that referenced this pull request Nov 29, 2023
Added

- Meta description and meta title on the website from the API (#2516)
- Retrieve BBB learning analytics and send them through API
- Classroom attendance analytics (#2499)
- Add a language picker for the invite link on the website (#2504)

Changed

- Replace grommet DropButton component (#2513)
- On live, can now share resource when one is already shared (#2512)
- Remove persistency on token from invite link (#2505)
- Replace grommet Cards / Footer/ Anchor / Tip / Nav (#2503)
- Refacto widgets SharedLiveMedia (#2504)
- Replace grommet Button (#2453)
- Replace grommet Box (#2484)
- Replace grommet TextArea (#2500)
- Update psycopg to version 3
- Update node to version 20
- Replace pylti with oauthlib for LTI request validation
- Replace faker with @faker-js/faker (frontend)

Fixed

- Blocking error when shared document is deleted (#2504)
- Improve render sharing picture in live (#2508)
lunika added a commit that referenced this pull request Nov 29, 2023
Added

- Meta description and meta title on the website from the API (#2516)
- Retrieve BBB learning analytics and send them through API
- Classroom attendance analytics (#2499)
- Add a language picker for the invite link on the website (#2504)

Changed

- Replace grommet DropButton component (#2513)
- On live, can now share resource when one is already shared (#2512)
- Remove persistency on token from invite link (#2505)
- Replace grommet Cards / Footer/ Anchor / Tip / Nav (#2503)
- Refacto widgets SharedLiveMedia (#2504)
- Replace grommet Button (#2453)
- Replace grommet Box (#2484)
- Replace grommet TextArea (#2500)
- Update psycopg to version 3
- Update node to version 20
- Replace pylti with oauthlib for LTI request validation
- Replace faker with @faker-js/faker (frontend)

Fixed

- Blocking error when shared document is deleted (#2504)
- Improve render sharing picture in live (#2508)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants