rustdoc: Align search results horizontally for easy scanning #112937

camelid · 2023-06-22T19:21:25Z

The recent PR #110688 added info about an item's kind before its name in
search results. However, because the kind and name are inline with no
alignment, it's now hard to visually scan downward through the search
results, looking at item names. This PR fixes that by horizontally
aligning search results such that there are now two columns of
information.

r? @GuillaumeGomez

The recent PR rust-lang#110688 added info about an item's kind before its name in search results. However, because the kind and name are inline with no alignment, it's now hard to visually scan downward through the search results, looking at item names. This PR fixes that by horizontally aligning search results such that there are now two columns of information.

compiler-errors · 2023-06-22T19:26:41Z

Do you have a rendering of what the new results look like?

Also, quite in favor of this change 👍

camelid · 2023-06-22T19:28:29Z

EDIT: This version is out-of-date. Please see #112937 (comment) for the final version.

Note: I'm having an issue getting Rust to build on my computer right now, so the "after" screenshot was generated by applying the changes in Firefox dev tools.

Before

After

camelid · 2023-06-22T19:31:48Z

src/librustdoc/html/static/css/rustdoc.css

 	color: var(--search-results-grey-color);
 	font-size: 0.875rem;
+	width: 6rem;


I picked this number arbitrarily. Two issues:

It would be nice if it weren't based on eyeballing the layout.

This isn't actually wide enough for "associated constant". If I increase this to 9em, it fits, but then all the other rows have excessive spacing. I see two solutions: one is to shorten the typename to just "constant", the other is to make the spacing somehow adaptive to what the longest typename is. But I'm not sure how to implement that.

What happens when it overflows? Does it wrap and just become a taller row? I think that honestly wouldn't be terrible if that's what happens.

It's not terrible, but still looks bad IMO:

:/ true -- i wonder if vertically center-aligning those rows would help.

I think we really need to just keep rows a constant height. Variable height rows almost always look a bit off.

Something that could at least make them look better is to make sure both the path/name and short description are aligned the same, to the top or the middle as Michael suggested.

I was able to avoid the wrapping by adding a tiny bit extra space.

GuillaumeGomez · 2023-06-22T21:37:22Z

The longest type name is associated constant. So calc(0.875rem * 20) should do the trick. But it's quite wide, hence why we finally decided to go without it. UI is tricky. ^^'

camelid · 2023-06-23T16:15:10Z

@GuillaumeGomez could we shorten "associated constant" to just "constant"? I'm not sure if it really matters to users whether a constant is associated or free, and even aside from this change, it's quite a long word that distracts from the actual name of the item.

compiler-errors · 2023-06-23T16:16:23Z

could we shorten "associated constant" to just "constant"?

I'd honestly rather shorten it to assoc const or something. At least on the compiler side, we try to be consistent with calling things "associated".

camelid · 2023-06-23T16:35:53Z

Abbreviation would be fine with me 👍

GuillaumeGomez · 2023-06-23T16:51:51Z

But associated const is already super long (especially if no type kind this long is displayed), and also it would become the second longest after existential type. ~~But we can already try to see how it looks with assoc const already?~~

EDIT: It's actually pretty useless to do since existential type is much longer and I don't think we can shorten it.

camelid · 2023-06-23T16:53:15Z

I abbreviated associated type too (not visible here):

GuillaumeGomez · 2023-06-23T16:53:57Z

It looks nice like that. But remains the problem of existential type.

camelid · 2023-06-23T17:05:38Z

Existential types have not been implemented yet I thought? Or I thought they're at least an experimental feature.

camelid · 2023-06-23T17:07:19Z

"Existential type" is still shorter than "associated constant". We could shorten "existential type" to just "existential"?

What is an existential type in this context actually? Is it type Foo = impl Trait?

compiler-errors · 2023-06-23T17:07:27Z

@camelid: type alias impl trait ("existential type" in rustdoc i guess) is implemented, and we probably should account for them too

camelid · 2023-06-23T17:11:40Z

We'd actually only need 7 rem (rather the current 6) to support "existential type" as it is.

GuillaumeGomez · 2023-06-23T17:18:30Z

Why 7rem? "existential type" is 17 characters. So 17 * 0.875 = 14.875rem, not 7. Did I miss something?

camelid · 2023-06-23T17:20:16Z

In non-monospace fonts, the letters are variable width, so you can't just multiply the font size by the number of characters. In addition, I believe the "em" in "rem" is referring to a value that is (approximately, sigh...) the width of an uppercase "M", which should be wider than the letters we're using.

EDIT: Here's a demo of two strings with the same length but different characters (16 M's, which I believe is the correct length of "existential type"):

Note: In case anyone's confused by "u8" being an existential type: I'm using browser dev tools to create this image ;)

camelid · 2023-06-23T17:22:36Z

New screenshots. Let me know if there are any other types of items that you'd like to see rendered.

GuillaumeGomez · 2023-06-23T17:26:25Z

Can you just check what it gives with "existential type" please? (Just update the text, no need for a real one 😸 )

Also please show screenshots of a mobile view (just reduce the width).

camelid · 2023-06-23T17:29:25Z

By the way, I added a demo to my "rem" explanation above in case you're interested :)

"existential type":

mobile view:

GuillaumeGomez · 2023-06-23T17:30:37Z

Let's maybe reduce a bit the margin after the type name? But otherwise looks good to me. 👍

rustbot · 2023-06-23T17:30:56Z

Some changes occurred in HTML/CSS/JS.

cc @GuillaumeGomez, @Folyd, @jsha

camelid · 2023-06-23T17:33:52Z

Some options:

6.25 rem

IMO the "existential type" is too close to the name.

6.5 rem

6.75 rem

7 rem

compiler-errors · 2023-06-24T15:55:16Z

👍

camelid · 2023-06-24T17:39:19Z

@bors r=GuillaumeGomez

bors · 2023-06-24T17:39:21Z

📌 Commit 5f433f3 has been approved by GuillaumeGomez

It is now in the queue for this repository.

camelid · 2023-06-24T17:39:26Z

@bors rollup

…meGomez rustdoc: Align search results horizontally for easy scanning The recent PR rust-lang#110688 added info about an item's kind before its name in search results. However, because the kind and name are inline with no alignment, it's now hard to visually scan downward through the search results, looking at item names. This PR fixes that by horizontally aligning search results such that there are now two columns of information. r? `@GuillaumeGomez`

GuillaumeGomez · 2023-06-24T18:26:09Z

Failed in #113004 (comment). You forgot to update a GUI test. ;)

@bors r-

rustbot · 2023-06-24T21:31:27Z

Some changes occurred in GUI tests.

cc @GuillaumeGomez

GuillaumeGomez · 2023-06-24T21:32:51Z

Thanks!

@bors r=notriddle,GuillaumeGomez rollup

bors · 2023-06-24T21:32:53Z

📌 Commit 9b97ae1 has been approved by notriddle,GuillaumeGomez

It is now in the queue for this repository.

notriddle · 2023-06-24T21:54:12Z

@bors r=notriddle,GuillaumeGomez rollup

bors · 2023-06-24T21:54:14Z

💡 This pull request was already approved, no need to approve it again.

There's another pull request that is currently being tested, blocking this pull request: Rollup of 8 pull requests #113006

bors · 2023-06-24T21:54:15Z

📌 Commit 9b97ae1 has been approved by notriddle,GuillaumeGomez

It is now in the queue for this repository.

…iaskrgr Rollup of 5 pull requests Successful merges: - rust-lang#112937 (rustdoc: Align search results horizontally for easy scanning) - rust-lang#112950 (DirEntry::file_name: improve explanation) - rust-lang#112956 (Expose `compiler-builtins-weak-intrinsics` feature for `-Zbuild-std`) - rust-lang#113008 (Move some docs from the README to the dev-guide) - rust-lang#113009 (Remove unnecessary `path` attribute) r? `@ghost` `@rustbot` modify labels: rollup

rustbot assigned GuillaumeGomez Jun 22, 2023

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 Jun 22, 2023

camelid commented Jun 22, 2023

View reviewed changes

camelid changed the title ~~Align search results horizontally for easy scanning~~ rustdoc: Align search results horizontally for easy scanning Jun 22, 2023

Abbreviate long typenames so they don't get wrapped in results

c4fca72

Make typenames a bit wider to support "existential type"

12de5b7

camelid marked this pull request as ready for review June 23, 2023 17:30

notriddle approved these changes Jun 24, 2023

View reviewed changes

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 Jun 24, 2023

GuillaumeGomez mentioned this pull request Jun 24, 2023

Rollup of 8 pull requests #113004

Closed

bors added S-waiting-on-author Status: This is awaiting some action (such as code changes or more information) from the author. and removed S-waiting-on-bors Status: Waiting on bors to run and complete tests. Bors will change the label on completion. labels Jun 24, 2023

rustdoc: Update GUI test

9b97ae1

GuillaumeGomez approved these changes Jun 24, 2023

View reviewed changes

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-author Status: This is awaiting some action (such as code changes or more information) from the author. labels Jun 24, 2023

matthiaskrgr mentioned this pull request Jun 25, 2023

Rollup of 5 pull requests #113014

Merged

bors merged commit 8816f9e into rust-lang:master Jun 25, 2023

rustbot added this to the 1.72.0 milestone Jun 25, 2023

camelid deleted the align-typenames branch June 25, 2023 16:04

GuillaumeGomez mentioned this pull request Jun 26, 2023

Display of search results isn't great #113060

Closed

rustdoc: Align search results horizontally for easy scanning #112937

rustdoc: Align search results horizontally for easy scanning #112937

Conversation

camelid commented Jun 22, 2023

compiler-errors commented Jun 22, 2023

camelid commented Jun 22, 2023 • edited Loading

Before

After

camelid Jun 22, 2023

Choose a reason for hiding this comment

compiler-errors Jun 22, 2023

Choose a reason for hiding this comment

camelid Jun 23, 2023

Choose a reason for hiding this comment

compiler-errors Jun 23, 2023

Choose a reason for hiding this comment

camelid Jun 23, 2023

Choose a reason for hiding this comment

albertlarsan68 Jun 23, 2023

Choose a reason for hiding this comment

camelid Jun 23, 2023

Choose a reason for hiding this comment

GuillaumeGomez commented Jun 22, 2023

camelid commented Jun 23, 2023

compiler-errors commented Jun 23, 2023

camelid commented Jun 23, 2023

GuillaumeGomez commented Jun 23, 2023 • edited Loading

camelid commented Jun 23, 2023

GuillaumeGomez commented Jun 23, 2023

camelid commented Jun 23, 2023 • edited Loading

camelid commented Jun 23, 2023

compiler-errors commented Jun 23, 2023

camelid commented Jun 23, 2023

GuillaumeGomez commented Jun 23, 2023

camelid commented Jun 23, 2023 • edited Loading

camelid commented Jun 23, 2023 • edited Loading

GuillaumeGomez commented Jun 23, 2023

camelid commented Jun 23, 2023

GuillaumeGomez commented Jun 23, 2023

rustbot commented Jun 23, 2023

camelid commented Jun 23, 2023

6.25 rem

6.5 rem

6.75 rem

7 rem

compiler-errors commented Jun 24, 2023

camelid commented Jun 24, 2023

bors commented Jun 24, 2023

camelid commented Jun 24, 2023

GuillaumeGomez commented Jun 24, 2023

rustbot commented Jun 24, 2023

GuillaumeGomez commented Jun 24, 2023

bors commented Jun 24, 2023

notriddle commented Jun 24, 2023

bors commented Jun 24, 2023

bors commented Jun 24, 2023

camelid commented Jun 22, 2023 •

edited

Loading

GuillaumeGomez commented Jun 23, 2023 •

edited

Loading

camelid commented Jun 23, 2023 •

edited

Loading

camelid commented Jun 23, 2023 •

edited

Loading

camelid commented Jun 23, 2023 •

edited

Loading