With react-dates v12 we had the great opportunity to style the date-picker through SCSS.
In v16 SCSS has been replaced by standard CSS. Theming shall be done with react-with-styles, but this does not work well if we have our color variables in SCSS.
Why has this been changed? How can we get SCSS support back?
+1
Hi @raphaelbeckmann @developer239, sorry for not responding to this issue. A lot of this happened with the move to the react-with-styles system and the fact that we had built out a CSS interface and had not yet built out one for Sass. Can you explain what feature you were using of scss that was necessary? Maybe we can get that back.
I also would like to see scss included with this module. Currently for my project, I am building an electron app that uses gulp (and potentially webpack), which uses purely sass and seamlessly integrates scss from external modules, which then is piped through my task runner, and compiled into a single css, without the need to merge from external sources. Sass also has an advantage with its flexibility and features as a pre-processor in general over css.
@cellsheet I think you could probably set up your gulp/webpack config to pull in css files as well as scss files. A lot of the flexibility and features that scss has over css are mainly in writing the styles, which consumers can still do and use our default outputted css and which we notably don't do in a stylesheet.
You should be able to style the datepicker with scss no problem. I have a scss file for styling overrides that imports the default outputted css via an import at the top of my file, e.g.
scss
@import "node_modules/react-dates/lib/css/_datepicker";
This solves that issue without needing to do anything additionally in gulp or webpack.
Most helpful comment
You should be able to style the datepicker with scss no problem. I have a scss file for styling overrides that imports the default outputted css via an import at the top of my file, e.g.
scss @import "node_modules/react-dates/lib/css/_datepicker";This solves that issue without needing to do anything additionally in gulp or webpack.