-
Notifications
You must be signed in to change notification settings - Fork 437
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
Improve method source toggling #1176
base: master
Are you sure you want to change the base?
Conversation
Even if we decide to keep the source toggle on the method name, I'd love to get the URL on the method name so that at least we can right-click, copy link location and share that more easily. |
Does this look good to you? (ofc, I'm not going to make all method names green) Screen.Recording.2024-09-09.at.13.18.40.mov |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
These are great improvements, thank you!
That's a good point. I'll think about how to avoid the confusion.
Since it's been at the top for a long time, moving it to the bottom would require a huge change on users' behaviour. It's also not uncommon to see methods having very long description and examples in Ruby (e.g. |
8cf49cb
to
7ec0a4c
Compare
You should be able to change the background of the source with the following: .method-source-code pre {
background: #ebead5;
} Also SDoc uses it's own css and templates, so it shouldn't be affected. |
Currently, if a method description is long (e.g. `Array.new`), users need to click the method toggle button next to the method title, and then scroll down to the source code expanded below the description. This commit changes the behavior so that the source code is expanded immediately below the method title.
1. Display the method toggle button by default instead of displaying on hover 2. Only toggle the source code when clicking the method toggle button, not when clicking the entire method title section. This will allow us to display an anchor link next to the method title 3. Simplify the toggle source button's appearance
By moving the method controls out of the method header, we can display them to the right of the method name on desktop, and below the method name on mobile.
The label should help users distinguish example code blocks from other code blocks, such as method source code. It's only applied to Ruby code examples.
7ec0a4c
to
69fc9ce
Compare
Demos
Before
Screen.Recording.2024-09-08.at.23.41.03.mov
After
Desktop
Screen.Recording.2024-09-09.at.11.30.14.mov
Mobile
Screen.Recording.2024-09-09.at.11.28.56.mov