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

Set `cursor:pointer` for `<summary>`

This commit is contained in:
Andres Galante 2017-12-27 23:08:10 -03:00 committed by Patrick H. Lauke
parent 1a4a94bfd9
commit a5232abefc
2 changed files with 17 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
docs/4.0/content/reboot.md
View File

@ -333,6 +333,22 @@ The `<abbr>` element receives basic styling to make it stand out amongst paragra
Nulla <abbr title="attribute">attr</abbr> vitae elit libero, a pharetra augue. Nulla <abbr title="attribute">attr</abbr> vitae elit libero, a pharetra augue.
</div> </div>
### Summary
The default `cursor` on summary is `text`, so we reset that to `pointer` to convey that the element can be interacted with by clicking on it.
<div class="bd-example">
<details>
<summary>Some details</summary>
<p>More info about the details.</p>
</details>
<details open>
<summary>Even more details</summary>
<p>Here are even more details about the details.</p>
</details>
</div>
## HTML5 `[hidden]` attribute ## HTML5 `[hidden]` attribute
HTML5 adds [a new global attribute named `[hidden]`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden), which is styled as `display: none` by default. Borrowing an idea from [PureCSS](https://purecss.io/), we improve upon this default by making `[hidden] { display: none !important; }` to help prevent its `display` from getting accidentally overridden. While `[hidden]` isn't natively supported by IE10, the explicit declaration in our CSS gets around that problem. HTML5 adds [a new global attribute named `[hidden]`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden), which is styled as `display: none` by default. Borrowing an idea from [PureCSS](https://purecss.io/), we improve upon this default by making `[hidden] { display: none !important; }` to help prevent its `display` from getting accidentally overridden. While `[hidden]` isn't natively supported by IE10, the explicit declaration in our CSS gets around that problem.

1
scss/_reboot.scss
View File

@ -491,6 +491,7 @@ output {
summary { summary {
display: list-item; // Add the correct display in all browsers display: list-item; // Add the correct display in all browsers
cursor: pointer;
} }
template { template {