diff options
| author | Matthias Krüger <matthias.krueger@famsik.de> | 2024-07-30 04:31:55 +0200 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2024-07-30 04:31:55 +0200 |
| commit | c2b085b4d498f44e65bf8d7d25daeefcc8dba90d (patch) | |
| tree | 47b208e86fa7c566281394a0a35a56c83a17ef5a /src/librustdoc/html/static/css/rustdoc.css | |
| parent | f396a42ed6cad32dc6f5860b49f85f0d9a10a997 (diff) | |
| parent | 99906dc89c241d29c6e63d10f719d36d81a9a049 (diff) | |
| download | rust-c2b085b4d498f44e65bf8d7d25daeefcc8dba90d.tar.gz rust-c2b085b4d498f44e65bf8d7d25daeefcc8dba90d.zip | |
Rollup merge of #128339 - GuillaumeGomez:click-code-example, r=notriddle
[rustdoc] Make the buttons remain when code example is clicked Follow-up of https://github.com/rust-lang/rust/pull/125779. One current issue we have with "run" button and the newly added copy code button is that if you're on mobile devices, you can't use them. I took a look at how `mdbook` is handling it and when you click on a code example, they show the buttons. I think it's a really good idea as if you want to copy the code on your mobile device, you will click on it, showing the buttons. Feature can be tested [here](https://rustdoc.crud.net/imperio/click-code-example/foo/struct.Bar.html). r? `@notriddle`
Diffstat (limited to 'src/librustdoc/html/static/css/rustdoc.css')
| -rw-r--r-- | src/librustdoc/html/static/css/rustdoc.css | 15 |
1 files changed, 14 insertions, 1 deletions
diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index cafe5fe4c87..f4e231327a8 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -1477,7 +1477,20 @@ a.test-arrow:hover { .example-wrap:hover > .test-arrow { padding: 2px 7px; } -.example-wrap:hover > .test-arrow, .example-wrap:hover > .button-holder { +/* +On iPad, the ":hover" state sticks around, making things work not greatly. Do work around +it, we move it into this media query. More information can be found at: +https://css-tricks.com/solving-sticky-hover-states-with-media-hover-hover/ + +However, using `@media (hover: hover)` makes this rule never to be applied in GUI tests, so +instead, we check that it's not a "finger" cursor. +*/ +@media not (pointer: coarse) { + .example-wrap:hover > .test-arrow, .example-wrap:hover > .button-holder { + visibility: visible; + } +} +.example-wrap .button-holder.keep-visible { visibility: visible; } .example-wrap .button-holder .copy-button { |