search

rogden / tailwind-config-viewer

A local UI tool for visualizing your Tailwind CSS configuration file.
1.98k stars 110 forks source link

Fix numerical `fontWeight` breaking execution #68

Closed hacknug closed 2 years ago

hacknug commented 2 years ago

This PR fixes an issue that was breaking execution when trying to check if a value uses rem units or not.

https://github.com/rogden/tailwind-config-viewer/blob/433c0e0a4e2d74592dffdf0c9904b73201c1d9f1/src/utils/index.js#L13

Due to the value prop in the CanvasBlockLabel component being constrained to only String values, the fix implemented in this PR works around it by casting it to a string type on the FontWeight component.

A possibly better fix would be to also allow Number values and cast to String inside appendPxToRems(). It think this still has the potential to break when using a string that contains rem (eg. using a custom property that includes increment).

Might be better to change to using a regex to ensure the string matches a specific pattern (positive or negative numerical value followed rem). Guessing a calc() containing mixed units (one of them being rem) would also go through this and end up showing an incorrect value?

I can make changes to this PR to implement the alternative fix or address those potential issues if y'all want me to. Just let me know 👍

Closes #67.

rogden commented 2 years ago

@hacknug Thanks for the PR! Will take a look tonight. I appreciate your contributions.