Primeng: Bootstrap theme missing scss

[uriah-ascend]

I'm submitting a ... (check one with "x")

[x ] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

It seems that only the css file is included for the bootstrap theme whereas the other themes have an scss file. It's possible this was intentional, but if it was an oversight, it would be very useful to be able to customize the css output for the theme to match our site styles etc.

Current behavior
after pulling the package, only a css file is included at node_modules\primeng\resources\themes\bootstrap\theme.css

Expected behavior
would like to see an scss file used to create that css file at
after pulling the package, only a css file is included at node_modules\primeng\resources\themes\bootstrap\theme.scss

What is the motivation / use case for changing the behavior?
Desire to build the css with variable and mixin overrides

Please tell us about your environment:
Windows, Visual Studio Code, npm

• Angular version: 4.3.0

• PrimeNG version: 4.1.2

• Browser: N/A

• Language: SASS

[cagataycivici]

That is on purpose, a more advanced SASS based one will be offered as a premium theme and current one will be deprecated.

https://www.primefaces.org/avalon/

[uriah-ascend]

Thanks for the info @cagataycivici

[cagataycivici]

Avalon-NG is full sass based

https://www.primefaces.org/avalon-ng

[mbrookson]

If the bootstrap css theme is already available in the free version, how come the scss is not also? Bootstrap itself is free after all. All I was looking for was a bootstrap theme where I can modify the default colours.

[uriah-ascend]

We ended up taking the bootstrap css version and forking it into our own scss file. that allowed us to do variable replacement etc where appropriate. It was a decent stop gap.

[mbrookson]

I've actually just run the css through a css to scss parser/generator to get all of the colour variables out but there are a large number of colours used so it's not as straight forward as I thought it would be. Is your scss fork public by any chance?

There's another thread about this here too...
https://github.com/primefaces/primeng/issues/1885

[uriah-ascend]

Unfortunately our scss fork is pretty specific to our solution, but I literally just copied the css file for the theme from node_modules and gave it the scss extension. Then you can start plugging in variables as needed once you has the sass compilation order setup.