mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Update docs to include mention of the custom variables file
This commit is contained in:
parent
567a0e9cee
commit
dd4062f213
2 changed files with 24 additions and 6 deletions
|
@ -4,11 +4,29 @@ title: Customization options
|
||||||
group: getting-started
|
group: getting-started
|
||||||
---
|
---
|
||||||
|
|
||||||
With Bootstrap 4, we've added a handful of global options for easily customizing all the components in your project. These options are handled by Sass variables. Simply change a variable's value and recompile with the included Gruntfile.
|
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.
|
||||||
|
|
||||||
## Available variables
|
## Customizing variables
|
||||||
|
|
||||||
You can find and customize these variables in our `_variables.scss` file.
|
Bootstrap 4 ships with a `_custom.scss` file for easy variable overrides. Copy and paste relevant lines from `_variables.scss` into the custom file and recompile your Sass to change our default values. **Be sure to remove the `!default` flag from override values.**
|
||||||
|
|
||||||
|
For example, to change out the `background-color` and `color` for the `<body>`, you'd do the following:
|
||||||
|
|
||||||
|
{% highlight scss %}
|
||||||
|
// Bootstrap overrides
|
||||||
|
//
|
||||||
|
// Copy variables from `_variables.scss` to this file to override default values
|
||||||
|
// without modifying source files.
|
||||||
|
|
||||||
|
$body-bg: $gray-dark;
|
||||||
|
$body-color: $gray-light;
|
||||||
|
{% endhighlight %}
|
||||||
|
|
||||||
|
Do the same for any variable you need to override, including the global options listed below.
|
||||||
|
|
||||||
|
## Global options
|
||||||
|
|
||||||
|
You can find and customize these variables for key global options in our `_variables.scss` file.
|
||||||
|
|
||||||
| Variable | Values | Description |
|
| Variable | Values | Description |
|
||||||
| --------------------------- | ---------------------------------- | ----------------------------------------------------------------------- |
|
| --------------------------- | ---------------------------------- | ----------------------------------------------------------------------- |
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
// Custom Overrides
|
// Bootstrap overrides
|
||||||
//
|
//
|
||||||
// Copy settings from `_variables.scss` to this file to override
|
// Copy variables from `_variables.scss` to this file to override default values
|
||||||
// the Bootstrap defaults without modifying key, versioned files.
|
// without modifying source files.
|
||||||
|
|
Loading…
Add table
Reference in a new issue