search

leather-io / mono

Leather monorepo
https://leather.io
MIT License
10 stars 5 forks source link

Design system - Typography update #72

Open mica000 opened 7 months ago

mica000 commented 7 months ago

This ticket is to update the typography scale to cover @fbwoolf comment: "We used to have a Title component in stacks/ui, so when we did the refactor we did make one using label01 atm to make the refactor easier. We could remove it and just style each piece of text separately, or we could update that component to share across the wallet still. It seems it should be label02 though and checked where used. Also, currently our label02 doesn NOT have a fontWeight of 500, so that needs to be changed. My thought is that with a separate coordination issue typography overall should be revisited again llke we did for colors."

https://www.figma.com/file/2MLHeIeL6XPVi3Tc2DfFCr/%E2%9D%96-Leather-%E2%80%93-Design-System?type=design&node-id=1257-1463&mode=design

image

kyranjamie commented 7 months ago

Migrating to monorepo

kyranjamie commented 7 months ago

This is an important one for us to get done. Is it ready for development @mica000 ?

mica000 commented 7 months ago

@fabric-8 curious on your take in regards to Caption02 - it's not very crispy but I added it here to cover to the old typography system we had to avoid things breaking when launching the rebrand - it's not particularly in use by the new designs system, shall we remove it?

fabric-8 commented 7 months ago

Yes I think it's fine to remove 👍

mica000 commented 7 months ago

@fabric-8 @kyranjamie Also added the font we use for code in there.

mica000 commented 7 months ago

There is on more change we need to make which is to merge Body02 and Caption 01.

Context: The old designs system had these in the scale so I preserved them during rebranding to avoid breaking the layout however body02 and caption 01 were the same. This wasn't good so they are now merged. This means that now we have only 1 size for Body and 1 size for Caption. See design

On the design system in Figma I already replaced the old Body02 for caption 01 (now new Caption). Components Where it was replaced: • Call out • Input • Tooltip

On development, Kyran suggested: [x] Finalise the typography in Figma, removing the duplicate entry. First principals: what typography do we want? No legacy design system decisions should influence our new design system. [ ] Remove all fontWeight definitions across the whole product in one find replace. [ ] Dev and designer live pair together going through all UI flows, fixing what's broken on the spot

Here is the new scale image

cc @kyranjamie @fabric-8

fbwoolf commented 7 months ago

@edgarkhanzadian you are working on this, correct?

edgarkhanzadian commented 7 months ago

@fbwoolf oh right this should be closed, i merged it with this pr: https://github.com/leather-wallet/mono/pull/75

kyranjamie commented 7 months ago

@edgarkhanzadian there were new updates from @mica000 since then

edgarkhanzadian commented 7 months ago

Oh didn't notice it, thank you! Will address those next

markmhendrickson commented 4 months ago

@edgarkhanzadian should this be moved back to the backlog if it's not being worked on actively?