Skip to content

theme: use 16px font for alert descriptions #13953

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

Merged
merged 1 commit into from
Sep 27, 2024
Merged

theme: use 16px font for alert descriptions #13953

merged 1 commit into from
Sep 27, 2024

Conversation

wackerow
Copy link
Member

@wackerow wackerow commented Sep 24, 2024

Description

Proposal: Use 16px font size as default for ui/alert component

Example screenshot

image

Preview link

https://deploy-preview-13953--ethereumorg.netlify.app/en/get-eth
https://ethereum.org/en/get-eth

Copy link

netlify bot commented Sep 24, 2024

Deploy Preview for ethereumorg ready!

Name Link
🔨 Latest commit 5b7a318
🔍 Latest deploy log https://app.netlify.com/sites/ethereumorg/deploys/66f31a803ae5b600085b81ab
😎 Deploy Preview https://deploy-preview-13953--ethereumorg.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
7 paths audited
Performance: 44 (🔴 down 2 from production)
Accessibility: 93 (no change from production)
Best Practices: 89 (🔴 down 9 from production)
SEO: 92 (no change from production)
PWA: -
View the detailed breakdown and full score reports

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

@pettinarip pettinarip added the needs design approval 🧑‍🎨 Approval from a designer is needed before merging label Sep 25, 2024
Copy link
Member

@pettinarip pettinarip left a comment

Choose a reason for hiding this comment

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

Approving but this needs Design approval as well.

cc @nloureiro @konopkja

Here is the Storybook where you can see the new Alerts with the font size change
https://63b7ea99632763723c7f4d6b-aaqognawns.chromatic.com/?path=/story/molecules-action-feedback-alerts--variants

Now both, the Title and Description, have 16px. I think I would prefer to keep the Title a bit bigger in size, maybe 18px?

image

@nloureiro
Copy link
Contributor

Approving but this needs Design approval as well.

cc @nloureiro @konopkja

Here is the Storybook where you can see the new Alerts with the font size change https://63b7ea99632763723c7f4d6b-aaqognawns.chromatic.com/?path=/story/molecules-action-feedback-alerts--variants

Now both, the Title and Description, have 16px. I think I would prefer to keep the Title a bit bigger in size, maybe 18px?

image

This is what I have on the DS > The only difference is that the yellow one uses the default (body) text color on all the text. For contrast purposes.

Screen Shot 2024-09-25 11 54 25 AM

@nloureiro
Copy link
Contributor

@wackerow one more thing based on your feedback on figma > bump the text to 16px

@wackerow
Copy link
Member Author

Okay. That is the only change in this PR (16px font); was not meant to address anything color related. If that looks good to you @nloureiro do me a favor and slap an approval on here 😄

@wackerow
Copy link
Member Author

(For the content of our ui/alert component)

@pettinarip pettinarip merged commit c254562 into dev Sep 27, 2024
8 of 10 checks passed
@pettinarip pettinarip deleted the alert-font-size branch September 27, 2024 07:40
This was referenced Oct 2, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
needs design approval 🧑‍🎨 Approval from a designer is needed before merging
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants