diff options
| author | Chris Rebert <[email protected]> | 2015-12-23 22:22:21 -0700 |
|---|---|---|
| committer | Chris Rebert <[email protected]> | 2015-12-23 22:22:21 -0700 |
| commit | 68061027b6b525929d918f3ef28d5335fafb3195 (patch) | |
| tree | 9b812446dac19c61787c8941c886f78d85dfa48b /docs | |
| parent | 5173cb1defa360b5ebd15f4f5455e4cbdc40ad66 (diff) | |
| parent | 76a4c303eed00a1f30b7a6d2d1d04fdf2f935e62 (diff) | |
| download | bootstrap-68061027b6b525929d918f3ef28d5335fafb3195.tar.xz bootstrap-68061027b6b525929d918f3ef28d5335fafb3195.zip | |
Merge pull request #18474 from twbs/breadcrumbs-2.0
Refactor Breadcrumbs component
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/components/breadcrumb.md | 23 | ||||
| -rw-r--r-- | docs/migration.md | 4 |
2 files changed, 20 insertions, 7 deletions
diff --git a/docs/components/breadcrumb.md b/docs/components/breadcrumb.md index bfd7ef1b6..204a60c81 100644 --- a/docs/components/breadcrumb.md +++ b/docs/components/breadcrumb.md @@ -8,17 +8,26 @@ Indicate the current page's location within a navigational hierarchy. Separators are automatically added in CSS through [`::before`](https://developer.mozilla.org/en-US/docs/Web/CSS/::before) and [`content`](https://developer.mozilla.org/en-US/docs/Web/CSS/content). +Works fine with or without the usage of list markup. + {% example html %} <ol class="breadcrumb"> - <li class="active">Home</li> + <li class="breadcrumb-item active">Home</li> </ol> <ol class="breadcrumb"> - <li><a href="#">Home</a></li> - <li class="active">Library</li> + <li class="breadcrumb-item"><a href="#">Home</a></li> + <li class="breadcrumb-item active">Library</li> </ol> -<ol class="breadcrumb" style="margin-bottom: 5px;"> - <li><a href="#">Home</a></li> - <li><a href="#">Library</a></li> - <li class="active">Data</li> +<ol class="breadcrumb"> + <li class="breadcrumb-item"><a href="#">Home</a></li> + <li class="breadcrumb-item"><a href="#">Library</a></li> + <li class="breadcrumb-item active">Data</li> </ol> +<!-- Or use a div instead of a list --> +<div class="breadcrumb"> + <a class="breadcrumb-item" href="#">Home</a> + <a class="breadcrumb-item" href="#">Library</a> + <a class="breadcrumb-item" href="#">Data</a> + <span class="breadcrumb-item active">Bootstrap</span> +</div> {% endexample %} diff --git a/docs/migration.md b/docs/migration.md index b586a41c3..d710d1768 100644 --- a/docs/migration.md +++ b/docs/migration.md @@ -114,6 +114,10 @@ New to Bootstrap 4 is the Reboot, a new stylesheet that builds on Normalize with - Explicit classes (`.page-item`, `.page-link`) are now required on the descendants of `.pagination`s +### Breadcrumbs + +- An explicit class, `.breadcrumb-item`, is now required on the descendants of `.breadcrumb`s + ### Badges - Dropped the badge component. Use the `.label-pill` modifier together with the label component instead. |