Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Merged
merged 2 commits into from
Jul 30, 2024

Conversation

GuillaumeGomez
Copy link
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

@rustbot rustbot 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
Collaborator

rustbot commented Jul 29, 2024

Some changes occurred in HTML/CSS/JS.

cc @GuillaumeGomez, @jsha

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

This comment has been minimized.

@GuillaumeGomez GuillaumeGomez force-pushed the click-code-example branch 2 times, most recently from 2f53a3e to e890807 Compare July 29, 2024 12:38
@rustbot rustbot added the A-run-make Area: port run-make Makefiles to rmake.rs label Jul 29, 2024
@rust-lang rust-lang deleted a comment from rustbot Jul 29, 2024
@jieyouxu jieyouxu removed the A-run-make Area: port run-make Makefiles to rmake.rs label Jul 29, 2024
@notriddle
Copy link
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
Member Author

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

@GuillaumeGomez
Copy link
Member Author

Can you test with this approach please?

@notriddle
Copy link
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
Member Author

Done!

@notriddle
Copy link
Contributor

@bors r+ rollup

@bors
Copy link
Contributor

bors commented Jul 29, 2024

📌 Commit 99906dc has been approved by notriddle

It is now in the queue for this repository.

@bors bors 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
@notriddle notriddle 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:master Jul 30, 2024
6 checks passed
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`
@rustbot rustbot 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 free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
S-waiting-on-bors Status: Waiting on bors to run and complete tests. Bors will change the label on completion. T-rustdoc-frontend Relevant 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