Class names inconsistency
vikramrojo opened this issue · comments
Should margins, padding, border, transforms be changed from p- | m- | b- | t- => pad-t- | mar-t- | border-t- | trans-t-| for beginner readability. This would be a breaking change.
+1
Single letter classes will replaced in favor of full names or abbreviations where long, eg. pad- width- trans grad
Name style conflict between g-1 using pixels & gap as rem variables
So decided to map out all the utility classes prioritizing that vue would make classless components anyhow, and there will be some learning curve. Seemed actually the more intuitive practice, given Javascript affinities, is to write in PascalCase!
Rad1
BordL1
GradDarken
Blend
Color,BgColor,BordColor
Ht1,ViewHt1,Wid,ViewWid
B,L,R,T
Flex,Grow
GridGap1, GridSpace1
GridCols1, GridRow1
GridColSpan1, GridRowSpan1
Opa1
MarGap1,Mar1,MarT1
PadGap1,Pad1,PadT1
Shad
TransT1
Removed Gap classes in favor of isSpace variant