-
Notifications
You must be signed in to change notification settings - Fork 12.7k
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
Add a bit more padding in search box #93382
Conversation
Some changes occurred in HTML/CSS/JS. |
This comment has been minimized.
This comment has been minimized.
Weird failure... |
Hmm, this looks almost the same as before. The issue is more the vertical padding, not the horizontal, which I think might be hard to fix without creating inconsistencies with the buttons. Perhaps if we made the buttons a bit larger, we could further increase the vertical padding of the search box? |
We can but then maybe they'll become bigger again compared to the title. What do you think @jsha? |
I looked around for some examples to compare. eBay has 9px/9px top/bottom margins. Amazon has 7px/10px. I couldn't figure out Google's due to weird CSS. Readthedocs has 6px/6px, but also has font-size: 80%, so in relative terms to a 16px font size, that's more like 7.5px compared to the others. pkg.go.dev has 6.5px/6.5 px, but with the default 16px font size. In rustdoc we currently have 5px/5px, with a font-size of 17px (1.0625rem). So our padding-to-text ratio is indeed a bit lower than those other sites. On stable our margins were 10px/10px, slightly on the high end of the compared sites. I think we should definitely reduce the font size to 16px (1rem) for consistency with the rest of the page. If we do that, the margins will be larger in relative terms. We should then try 7px/7px margins, or even 8px/8px. That would give us a total height of 30px or 32px, both smaller than our Also worth pointing out that when #59840 mentioned search was "visually larger than the main heaing," that included the line under the search bar plus the padding to reach that line. We've since removed that, which improves the situation. |
7px padding, 1rem font size: 5px padding, 1.0625rem font size: 8px padding, 1rem font-size: Note: It's a little hard to compare these directly because GitHub scales them. But I like the 7px version and I think it does a decent job alleviating the cramped feeling. Note: You have to adjust the height constraint on search-container to allow the padding to actually expand the Thanks for working on this! |
By "margin", I assume you mean "padding"? |
9c042e8
to
0ed5565
Compare
Hmm, I guess that's better. My only concern is that searching is really common, so making the font too small could make it more difficult. |
The change in font size is quite small, not sure if anyone will notice the difference unless they look at the CSS. |
1 similar comment
The change in font size is quite small, not sure if anyone will notice the difference unless they look at the CSS. |
I think this looks good. And yeah, the change in font size is not "make it small," it's "make it the same size as the body text." It doesn't seem like there's a good reason for it to be just slightly bigger than body text. |
Is there anything else for me to do in here? |
☔ The latest upstream changes (presumably #93795) made this pull request unmergeable. Please resolve the merge conflicts. |
0ed5565
to
b12d926
Compare
Rebased! |
ping @jsha :) |
@bors r+ rollup |
📌 Commit b12d926 has been approved by |
…askrgr Rollup of 10 pull requests Successful merges: - rust-lang#92366 (Resolve concern of `derive_default_enum`) - rust-lang#93382 (Add a bit more padding in search box) - rust-lang#93962 (Make [u8]::cmp implementation branchless) - rust-lang#94015 (rustdoc --check option documentation) - rust-lang#94017 (Clarify confusing UB statement in MIR) - rust-lang#94020 (Support pretty printing of invalid constants) - rust-lang#94027 (Update browser UI test version) - rust-lang#94037 (Fix inconsistent symbol mangling with -Zverbose) - rust-lang#94045 (Update books) - rust-lang#94054 (:arrow_up: rust-analyzer) Failed merges: r? `@ghost` `@rustbot` modify labels: rollup
As asked in #93113 (comment), here is a bit more padding.
You can check it here.
r? @camelid