Fix: make sidebar info chip styles consistent

safe-global / safe-wallet-web

Safe{Wallet} – smart contract wallet for Ethereum (ex-Gnosis Safe multisig)

https://app.safe.global

GNU General Public License v3.0

314 stars 372 forks source link

Fix: make sidebar info chip styles consistent #3805

Closed jmealy closed 1 month ago

jmealy commented 1 month ago

What it solves

Resolves :https://www.notion.so/safe-global/Align-chip-styles-7ab45b9ab8d34c5c909dd60e48cc301c?pvs=4

How this PR fixes it

gives both the pending txs chip and the 'new' chip a left/right padding of 8px.
gives them both the same font height and font weight.
changes the color of the pending txs chip to 'warning-light'

Screenshots

Checklist

[ ] I've tested the branch on mobile 📱
[ ] I've documented how it affects the analytics (if at all) 📊
[ ] I've written a unit/e2e test for it (if applicable) 🧑‍💻

github-actions[bot] commented 1 month ago

Branch preview

✅ Deploy successful!

Website: https://fix_chip_padding--walletweb.review.5afe.dev/home?safe=eth:0xA77DE01e157f9f57C7c4A326eeE9C4874D0598b6

Storybook: https://fix_chip_padding--walletweb.review.5afe.dev/storybook/

github-actions[bot] commented 1 month ago

ESLint Summary View Full Report

Annotations are provided inline on the Files Changed tab. You can also see all annotations that were generated on the annotations page.

Type	Occurrences	Fixable
Errors	0	0
Warnings	0	0
Ignored	0	N/A

Result: :white_check_mark: success
- Annotations: 0 total

^{Report generated by eslint-plus-action}

github-actions[bot] commented 1 month ago

📦 Next.js Bundle Analysis for safe-wallet-web

This analysis was generated by the Next.js Bundle Analysis action. 🤖

⚠️ Global Bundle Size Increased

Page	Size (compressed)
`global`	`950.45 KB` (🟡 +104 B)

Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

github-actions[bot] commented 1 month ago

Coverage report

St.^{:grey_question:}	Category	Percentage	Covered / Total
🟡	Statements	79.48%	11507/14477
🔴	Branches	58.57%	2767/4724
🟡	Functions	66.77%	1851/2772
🟢	Lines	80.83%	10379/12840

Test suite run success

1443 tests passing in 199 suites.

Report generated by 🧪jest coverage report action from 0d27bc157f8ced4334613e777f66265fa6b0cd5c

notion-workspace[bot] commented 1 month ago

Align chip styles

compojoom commented 1 month ago

@jmealy can you maybe build this PR on top of this one: https://github.com/safe-global/safe-wallet-web/pull/3771/files

Since now we are showing this "new" label on several places we've refactored our Chip component so your changes should go there.

jmealy commented 1 month ago

@jmealy can you maybe build this PR on top of this one: https://github.com/safe-global/safe-wallet-web/pull/3771/files

Since now we are showing this "new" label on several places we've refactored our Chip component so your changes should go there.

Made the changes on your branch, closing this