root
/
bootstrap
mirror of https://github.com/twbs/bootstrap.git
1
0
Fork 0
Code Issues Actions 14 Packages Projects Releases Wiki Activity

Progress page: remove toggle animation button (#34787) 

We don't use the same approach with a button on the Placeholders page.
This commit is contained in:
XhmikosR 2021-08-21 06:54:53 +03:00 committed by GitHub
parent 91295c2187
commit 9e1d81a851
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 2 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
site/assets/js/application.js
View File

@ -117,17 +117,6 @@
})
}
// Activate animated progress bar
var btnToggleAnimatedProgress = document.getElementById('btnToggleAnimatedProgress')
if (btnToggleAnimatedProgress) {
btnToggleAnimatedProgress.addEventListener('click', function () {
btnToggleAnimatedProgress.parentNode
.querySelector('.progress-bar-striped')
.classList
.toggle('progress-bar-animated')
})
}
// Insert copy to clipboard button before .highlight
var btnHtml = '<div class="bd-clipboard"><button type="button" class="btn-clipboard" title="Copy to clipboard">Copy</button></div>'
document.querySelectorAll('div.highlight')

13
site/content/docs/5.1/components/progress.md
View File

@ -123,20 +123,11 @@ Add `.progress-bar-striped` to any `.progress-bar` to apply a stripe via CSS gra
The striped gradient can also be animated. Add `.progress-bar-animated` to `.progress-bar` to animate the stripes right to left via CSS3 animations.
<div class="bd-example">
<div class="progress">
<div class="progress-bar progress-bar-striped" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 75%"></div>
</div>
<button type="button" class="btn btn-secondary mt-3" data-bs-toggle="button" id="btnToggleAnimatedProgress" aria-pressed="false" autocomplete="off">
Toggle animation
</button>
</div>
```html
{{< example >}}
<div class="progress">
<div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 75%"></div>
</div>
```
{{< /example >}}
## Sass