mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-17 19:21:23 +03:00
Code Activity

Simplify disabled styles (#29296)

Browse Source 
* Simplify disabled styles

* Mention pointer-events usage
This commit is contained in:
Martijn Cuppens
2019-12-27 17:40:06 +01:00
committed by XhmikosR
parent 167a93a0f3
commit 4387038421
8 changed files with 50 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
site/content/docs/4.3/components/buttons.md
+1 -1
View File
@@ -86,7 +86,7 @@ Buttons will appear pressed (with a darker background, darker border, and inset
## Disabled state
Make buttons look inactive by adding the `disabled` boolean attribute to any `<button>` element.
Make buttons look inactive by adding the `disabled` boolean attribute to any `<button>` element. Disabled buttons have `pointer-events: none` applied to, preventing hover and active states from triggering.
{{< example >}}
<button type="button" class="btn btn-lg btn-primary" disabled>Primary button</button>
site/content/docs/4.3/components/close-button.md
+5 -1
View File
@@ -5,10 +5,14 @@ description: A generic close button for dismissing content like modals and alert
group: components
---
**Be sure to include text for screen readers**, as we've done with `aria-label`.
**Be sure to include text for screen readers**, as we've done with `aria-label`. Disabled close buttons have `pointer-events: none` applied to, preventing hover and active states from triggering.
{{< example >}}
<button type="button" class="close" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
<button type="button" class="close" disabled aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
{{< /example >}}