tailwind
tailwind copied to clipboard
feat: support tw-shadow variable
Because the shadow is supported, the --tw-shadow
variable has to be supported as well.
I don't think we can use variables in shadow definitions right now - will need to test, and see if we can implement it in core. The default tailwind shadows wouldn't work though, they layer multiple shadows on top of each other, which is not possible in NS atm... When implementing shadows, I did consider that scenario (mainly because of tailwind), but due to platform limitations, it's not feasible.
The reason for this PR was that tailwind .shadow
classes throw such errors like:
JS: Error: Failed to apply property [box-shadow] with value [0 0 #0000, 0 0 #0000, unset] to CardView(271). Error: Invalid color: unset
JS: at new Color (file: src\webpack:\sc\node_modules\@nativescript\core\color\color-common.js:33:0)
JS: at new Color (file: src\webpack:\sc\node_modules\@nativescript\core\color\index.android.js:2:7)
JS: at parseCSSShadow (file: src\webpack:\sc\node_modules\@nativescript\core\ui\styling\css-shadow.js:56:0)
JS: at valueConverter (file: src\webpack:\sc\node_modules\@nativescript\core\ui\styling\style-properties.js:1133:29)
JS: at Style.setCssValue [as css:box-shadow] (file: src\webpack:\sc\node_modules\@nativescript\core\ui\core\properties\index.js:573:0)
JS: at CssState.setPropertyValues (file: src\webpack:\sc\node_modules\@nativescript\core\ui\styling\style-scope.js:540:47)
JS: at file: src\webpack:\sc\node_modules\@nativescript\core\ui\styling\style-scope.js:428:0
JS: at CardView._batchUpdate (file: src\webpack:\sc\node_modules\@nativescript\core\ui\core\view-base\index.js:286:0)
Because --tw-shadow
is unset
.
@lekhmanrus right, but I don't think it would work with this PR either - need to test a bit more... You can try as well - pack @nativescript/tailwind
locally and try it npm i && npm pack
after cloning should be all to produce a tgz
file you can install into your project.
@rigor789 I tried commenting tw-shadow
directly in node_modules\@nativescript\tailwind\src\removeUnsupported.js
. Sure, .shadow
class still does nothing, but at least we do not have that error in the terminal. Does it make sense to deny/strip '.shadow' classes then? at least for now?