'How to customize / theme Bootstrap 4 in playframework?
I want to use and customize bootstrap 4 (currently in beta) in a play framework 2.6 application (scala).
By customizing I mean creating my own css classes or changing existing variables like container width, colors of default buttons, ...
How would I go about this? My assumption is that the proper way to do this would be to somehow integrate the sass compilation into my play framework application so that relevant changes to core bootstrap variables are picked up in all necessary places?
What I have done so far is:
In build.sbt, added "org.webjars" % "bootstrap" % "4.0.0-beta" to the libraryDependencies.
In plugins.sbt, added addSbtPlugin("org.irundaia.sbt" % "sbt-sassify" % "1.4.4")
In my app\assets\css\main.scss, added @import "lib/bootstrap/css/bootstrap";.
The bootstrap css is now correctly bundled with my custom css.
How do I now change bootstrap variables? In the customization documentation ( https://getbootstrap.com/docs/4.0/getting-started/options/#customizing-variables ) doc it says that there is a file called _variables.scss where this can be done. This file does not exist in /lib/bootstrap/css where the webjar content was extracted to.
Solution 1:[1]
SASS integration
You can find it in the play documentation: https://www.playframework.com/documentation/2.6.x/AssetsSass
Particularly you need to add the sbt-sassify plugin:
addSbtPlugin("org.irundaia.sbt" % "sbt-sassify" % "1.4.4")
This plugin documentation: https://github.com/irundaia/sbt-sassify
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | nemoo |