argyleink / open-props

CSS custom properties to help accelerate adaptive and consistent design.
https://open-props.style
MIT License
4.52k stars 184 forks source link

Sizes Counters Wrong #481

Closed Crisfole closed 3 months ago

Crisfole commented 3 months ago
image

Looks like you need a different strategy for the sizes counter than from-one since you want that value to be 000 00 0 and then so on.

argyleink commented 3 months ago

good call. thanks for loggin. might be able to trick the counter system but not having the first 2 contribute to increment, and then concat an extra 0 on them?

Crisfole commented 3 months ago

Yeah, alternatively explicitly set the triple and double zero contents, then do an explicit counter reset on the single zero?

I’d have fixed it but no one else was gonna feed the family ;)

Crisfole commented 3 months ago

Might need a way to demo the negative sizing too…unclear how that might be best shown… negative margin lacks visibility, but can be made clear

Brian-Pob commented 3 months ago

Just realized the counters go from 0-14 when it should be from 1-15 since size-0 doesn't exist.

For the negative size demo, I was also thinking that negative margin could be used. I whipped up a quick codepen to show it.

https://codepen.io/brian-pob/pen/vYMxewe

Screenshot of codepen showing negative size demo

Crisfole commented 3 months ago

Uh, sizes 000, 00, and 0 exist…am I missing something?

Brian-Pob commented 3 months ago

I believe 0 does not exist. I'm basing this off the list of sizes. CleanShot 2024-03-20 at 21 11 24

And when you look at the properties there is no size-0 CleanShot 2024-03-20 at 21 12 20

argyleink commented 3 months ago

since 000, 00 are negative values, there's no reason to show them! have the size visualization start at 1 .from-one like you did with gradients and its done?

Class should be added to

Crisfole commented 3 months ago

Ahh, missed the single 0 being missing, good catch