search

kristerkari / react-native-sass-transformer

Use Sass to style your React Native apps.
MIT License
219 stars 19 forks source link

Shorthand is not working .sass extension #13

Closed wesleyr6 closed 5 years ago

wesleyr6 commented 5 years ago

Hi @kristerkari

I got 2 problems when using .sass (I did not try using .scss)

1 - Failed build using shorthand properties margin: 0 2 14 20 padding: 0 2 14 20 border: 1 solid $color

2 - Failed build when using properties without specifying unit type after the value margin: 0 2

I tried it using margin, padding, border and text-shadow

kristerkari commented 5 years ago

Thanks @wesleyamaro

Please always use units (px or rem) with the values. The CSS parser that is used does not support numeric values without units.

wesleyr6 commented 5 years ago

@kristerkari

"All dimensions in React Native are unitless, and represent density-independent pixels."

That´s the reason we can not use units type in react native. You can see more details below: https://facebook.github.io/react-native/docs/height-and-width

kristerkari commented 5 years ago

That's when you use Javascript to do styling (which is the default way in React Native).

My libraries are using the same CSS parser as styled-components, and the idea is to provide a way to do styling that works the same way as in CSS and without using Javascript.