aboutsummaryrefslogtreecommitdiff
path: root/docs
diff options
context:
space:
mode:
authorMoris Zen Pasic <[email protected]>2017-09-21 16:57:36 +0200
committerJohann-S <[email protected]>2017-09-27 09:36:42 +0200
commitbc2db58b7309c654a2169d1340c34035d146bbe2 (patch)
treec9e55532f7b1e66534221330d81dd10e2cf47645 /docs
parentd66f47d0991346d00b83643c0cfed8bfaef19e04 (diff)
downloadbootstrap-bc2db58b7309c654a2169d1340c34035d146bbe2.tar.xz
bootstrap-bc2db58b7309c654a2169d1340c34035d146bbe2.zip
Added examples to the existing docs change for more clarity
Diffstat (limited to 'docs')
-rw-r--r--docs/4.0/getting-started/options.md12
1 files changed, 7 insertions, 5 deletions
diff --git a/docs/4.0/getting-started/options.md b/docs/4.0/getting-started/options.md
index c9b1d7d9f..a830d81af 100644
--- a/docs/4.0/getting-started/options.md
+++ b/docs/4.0/getting-started/options.md
@@ -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.