Skip to content

[rustdoc] Make the buttons remain when code example is clicked - #128339

Merged
bors merged 2 commits into
rust-lang:masterfrom
GuillaumeGomez:click-code-example
Jul 30, 2024
Merged

[rustdoc] Make the buttons remain when code example is clicked#128339
bors merged 2 commits into
rust-lang:masterfrom
GuillaumeGomez:click-code-example

Conversation

@GuillaumeGomez

Copy link
Copy Markdown
Member

Follow-up of #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.

r? @notriddle

@rustbotrustbot added S-waiting-on-review Status: Awaiting review from the assignee but also interested parties. T-rustdoc Relevant to the rustdoc team, which will review and decide on the PR/issue. labels Jul 29, 2024
@rustbot

Copy link
Copy Markdown
Collaborator

Some changes occurred in HTML/CSS/JS.

cc @GuillaumeGomez, @jsha

@GuillaumeGomezGuillaumeGomez changed the title Click code example[rustdoc] Make the buttons remain when code example is clickedJul 29, 2024
@rust-log-analyzer

This comment has been minimized.

@GuillaumeGomez
GuillaumeGomezforce-pushed the click-code-example branch 2 times, most recently from 2f53a3e to e890807CompareJuly 29, 2024 12:38
@rustbotrustbot added the A-run-make Area: port run-make Makefiles to rmake.rs label Jul 29, 2024
@rust-langrust-lang deleted a comment from rustbotJul 29, 2024
@jieyouxujieyouxu removed the A-run-make Area: port run-make Makefiles to rmake.rs label Jul 29, 2024
@notriddle

Copy link
Copy Markdown
Contributor

This works swimmingly on Android, but on iPadOS it's kind of a mess.

Screen.Recording.2024-07-29.at.09.30.16.mov

According to css-tricks.com, the magic spell is to use a hover media query:

@media (hover: hover) {
.example-wrap:hover> .test-arrow, .example-wrap:hover> .button-holder {
visibility: visible;
}
}

@GuillaumeGomez

Copy link
Copy Markdown
MemberAuthor

Just one issue with this media query: it doesn't work in headless mode. ^^'

@GuillaumeGomez

Copy link
Copy Markdown
MemberAuthor

Can you test with this approach please?

@notriddle

Copy link
Copy Markdown
Contributor

Seems to work fine.

For the sake of anyone else who wants to try it, can you upload this new version to crud.net also?

@GuillaumeGomez

Copy link
Copy Markdown
MemberAuthor

Done!

@notriddle

Copy link
Copy Markdown
Contributor

@bors r+ rollup

@bors

bors commented Jul 29, 2024

Copy link
Copy Markdown
Collaborator

📌 Commit 99906dc has been approved by notriddle

It is now in the queue for this repository.

@borsbors added S-waiting-on-bors Status: Waiting on bors to run and complete tests. Bors will change the label on completion. and removed S-waiting-on-review Status: Awaiting review from the assignee but also interested parties. labels Jul 29, 2024
@notriddlenotriddle added T-rustdoc-frontend Relevant to the rustdoc-frontend team, which will review and decide on the web UI/UX output. and removed T-rustdoc Relevant to the rustdoc team, which will review and decide on the PR/issue. labels Jul 29, 2024
bors added a commit to rust-lang-ci/rust that referenced this pull request Jul 30, 2024
…iaskrgr
Rollup of 4 pull requests
Successful merges:
- rust-lang#127574 (elaborate unknowable goals)
- rust-lang#128141 (Set branch protection function attributes)
- rust-lang#128315 (Fix vita build of std and forbid unsafe in unsafe in the os/vita module)
- rust-lang#128339 ([rustdoc] Make the buttons remain when code example is clicked)
r? `@ghost`
`@rustbot` modify labels: rollup
bors added a commit to rust-lang-ci/rust that referenced this pull request Jul 30, 2024
…iaskrgr
Rollup of 4 pull requests
Successful merges:
- rust-lang#127574 (elaborate unknowable goals)
- rust-lang#128141 (Set branch protection function attributes)
- rust-lang#128315 (Fix vita build of std and forbid unsafe in unsafe in the os/vita module)
- rust-lang#128339 ([rustdoc] Make the buttons remain when code example is clicked)
r? `@ghost`
`@rustbot` modify labels: rollup
@bors
bors merged commit c2b085b into rust-lang:masterJul 30, 2024
rust-timer added a commit to rust-lang-ci/rust that referenced this pull request Jul 30, 2024
Rollup merge of rust-lang#128339 - GuillaumeGomez:click-code-example, r=notriddle
[rustdoc] Make the buttons remain when code example is clicked
Follow-up of rust-lang#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`
@rustbotrustbot added this to the 1.82.0 milestone Jul 30, 2024
@GuillaumeGomez
GuillaumeGomez deleted the click-code-example branch July 30, 2024 08:29
GuillaumeGomez added a commit to GuillaumeGomez/rust that referenced this pull request Aug 12, 2024
…tdoc
Unify run button display with "copy code" button and with mdbook buttons
Follow-up of rust-lang#128339.
It looks like this (coherency++, yeay!):
![Screenshot from 2024-07-30 15-16-31](https://github.com/user-attachments/assets/5e262e5b-f338-4085-94ca-e223033a43db)
Can be tested [here](https://rustdoc.crud.net/imperio/run-button/foo/struct.Bar.html).
r? `@notriddle`
GuillaumeGomez added a commit to GuillaumeGomez/rust that referenced this pull request Aug 12, 2024
…tdoc
Unify run button display with "copy code" button and with mdbook buttons
Follow-up of rust-lang#128339.
It looks like this (coherency++, yeay!):
![Screenshot from 2024-07-30 15-16-31](https://github.com/user-attachments/assets/5e262e5b-f338-4085-94ca-e223033a43db)
Can be tested [here](https://rustdoc.crud.net/imperio/run-button/foo/struct.Bar.html).
r? `@notriddle`
rust-timer added a commit to rust-lang-ci/rust that referenced this pull request Aug 12, 2024
Rollup merge of rust-lang#128394 - GuillaumeGomez:run-button, r=t-rustdoc
Unify run button display with "copy code" button and with mdbook buttons
Follow-up of rust-lang#128339.
It looks like this (coherency++, yeay!):
![Screenshot from 2024-07-30 15-16-31](https://github.com/user-attachments/assets/5e262e5b-f338-4085-94ca-e223033a43db)
Can be tested [here](https://rustdoc.crud.net/imperio/run-button/foo/struct.Bar.html).
r? `@notriddle`
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

S-waiting-on-borsStatus: Waiting on bors to run and complete tests. Bors will change the label on completion.T-rustdoc-frontendRelevant to the rustdoc-frontend team, which will review and decide on the web UI/UX output.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants

@GuillaumeGomez@rustbot@rust-log-analyzer@notriddle@bors@jieyouxu