rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-01-17 09:52:29 +01:00
Code Issues Actions Packages Releases Activity

Added examples to the existing docs change for more clarity

Browse Source
This commit is contained in:
Moris Zen Pasic 2017-09-21 16:57:36 +02:00 committed by Johann-S
parent d66f47d099
commit bc2db58b73
1 changed files with 7 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
docs/4.0/getting-started/options.md
View File

@ -8,13 +8,15 @@ toc: true
## Customizing variables
Every Sass variable in Bootstrap 4 includes the `!default` flag, meaning you can override that default value in your own Sass. Copy and paste variables as needed, modify the values, remove the !default flag, and recompile. If a variable has already been assigned, then it won't be re-assigned by the default values in Bootstrap. This means that your modified Sass variables should be called before you import Bootstrap Sass files.
For example, to change out the `background-color` and `color` for the `<body>`, you'd do the following:
Every Sass variable in Bootstrap 4 includes the `!default` flag, meaning you can override that default value in your own Sass. Copy and paste variables as needed, modify the values and remove the !default flag. If a variable has already been assigned, then it won't be re-assigned by the default values in Bootstrap. This means that your modified Sass variables should be called before you import Bootstrap Sass files. For example, to change out the `background-color` and `color` for the `<body>`, you'd do the following::
{% highlight scss %}
$body-bg: $gray-900;
$body-color: $gray-600;
// Your variable overwrite first or a Sass file containing the modifications
$body-bg: #000000;
$body-color: #ffffff;
// Then import Bootstrap
@import "node_modules/bootstrap/scss/bootstrap";
{% endhighlight %}
Do the same for any variable you need to override, including the global options listed below.