6

I am following this link: Docs

Specifically: Customize Bootstrap 4 with our built-in custom variables file and easily toggle global CSS preferences with new $enable-* Sass variables. Override a variable’s value and recompile with the included Gruntfile as needed.

I have never used Gruntfile before. Can I use other tools to compile scss into css? Also, what the outcome of such compilation is going to be? A _custom.css that must be placed in the same folder where original bootstrap.css is?

Thanks for help.

Mark
  • 4,000
  • 6
  • 32
  • 65
  • You can use Gulp as an alternative to Grunt, but be aware that Bootstrap4 is still in the alpha stage. It would be recommended to use Bootstrap 3 until the final build is released. – paddyfields Feb 21 '17 at 18:42
  • I agree with you, but I still need to learn how to do it. – Mark Feb 21 '17 at 19:34
  • 1
    Here is a [Bootstrap SASS to CSS customizer tool](http://upgrade-bootstrap.bootply.com/bootstrap-4-customizer) that lets you set the variables. – Zim Aug 24 '17 at 10:39
  • 1
    Oh, this is just great! Thanks – Mark Aug 24 '17 at 15:11
  • @Mark - will you please accept an answer for this question so others know it's resolved? – Zim May 16 '19 at 09:58

2 Answers2

4

While there is not an "official" Bootstrap 4 customizer like there was in 3.x, there are several tools that can do this. These all convert from SASS to CSS, and some provide a UI if you're not familiar with SASS.

Themestr.app Customizer

Bootply Customizer

Also see this answer for details on how to customize with CSS overrides or SASS.

Zim
  • 329,487
  • 83
  • 671
  • 600
1

You actually do not need to know too much about Grunt. Bootstrap 4 provides doc on how to setup build tools which can be found at,

https://v4-alpha.getbootstrap.com/getting-started/build-tools/#tooling-setup

Run grunt (or a specific set of Grunt tasks) to rebuild distributed CSS and JavaScript files, as well as our docs assets.

My suggestion is to clone the Bootstrap Beta 4 from Github change the variable and rebuild using the reconfigure gruntfile.

https://github.com/twbs/bootstrap#running-documentation-locally

X.Creates
  • 19,654
  • 9
  • 68
  • 116