Scaladoc: New UI design

[pikinier20]

Big thanks to all people involved in this initiative. Especially, I would like to thank @fanixus96 for implementing majority of these changes

[sjrd]

Where can we see the result?

[pikinier20]

Where can we see the result?

https://scala3doc.virtuslab.com/pr-new-ui/scala3/index.html

[julienrf]

Anchor links don’t seem to work well: https://scala3doc.virtuslab.com/pr-new-ui/scala3/api/scala.html#List-0 (I had to scroll up to see the definition of type List[A].

[julienrf]

I am not sure about the spacing here. I find that there is too much space in between the members, and too much padding within each member. The text “Attributes” looks too big to me. There is an overlapping issue in the “Throws” section. Last, I don’t think we should use a monospace font for descriptions.

Also, case class fields are not shown in the members' list.

For comparison, this is how it looks like before the PR:

And, with Scaladoc of Scala 2:

[pikinier20]

@julienrf We already had a conversation about space between members and we decided to implement some switch with "concise" view

[julienrf]

On mobile, when you open the burger menu there is no way to close it.

[mbovel]

Minor: h1 cut:

Due to:

#content>div:first-child {
  overflow: hidden;
}

And the line-height being set in .body-medium with an absolute px value that is too small for h1.

[sjrd]

Also about this: please don't use a monospace font for normal text. Reserve that for code.

[sjrd]

Somewhat on the same topic: compare Awaitable.ready (with link) to ExecutionContext (without link): They look pretty different, although both are inline code snippets. Consider making them look more similar to each other (while still keeping a distinction for the clickable one) and more different from the normal text.

[sjrd]

Anchor bug: go to https://scala3doc.virtuslab.com/pr-new-ui/scala3/api/scala/concurrent/Future.html, then click on the name andThen (the very fist member) -> the whole section disappears. (If you then reload, with the updated URL, you get the expected result.) Reproducible on Firefox and Chrome.

[bishabosha]

I am looking at scala.quoted.Quotes and it suggests there are quite a few "deprecated extension methods", including matches, but In the source only valueOrError is deprecated - not sure of the cause here, perhaps annotations are copied between extensions?

[sjrd]

IMO we should not use a font with ligatures in documentation. When you read it there, you have no idea how to type it in your editor. (and copy-pasting is often more annoying than necessary because it's also a link)

[pikinier20]

I am looking at scala.quoted.Quotes and it suggests there are quite a few "deprecated extension methods", including matches, but In the source only valueOrError is deprecated - not sure of the cause here, perhaps annotations are copied between extensions?

This bug is not related to the new UI - https://dotty.epfl.ch/api/scala/quoted/Quotes.html#

[smarter]

In https://scala3doc.virtuslab.com/pr-new-ui/scala3/api/scala/collection/immutable/List.html the code samples are not fully visible without horizontal scrolling: Compared with https://www.scala-lang.org/api/2.13.8/scala/collection/immutable/List.html and http://dotty.epfl.ch/api/scala/collection/immutable/List.html, the font size is bigger and the width of the main content of the page is smaller in the new design. I don't mind a fixed width but I think a bigger one would work better here. Compare also with https://doc.rust-lang.org/std/macro.matches.html

[arturopala]

"Run" buttons need to add package import first, but it still might not be enough to compile the more complex examples:

vs

[pikinier20]

I've got the horizontal scroll but it might be related to some browser's compatibility with used CSSes. I've used Chrome + Safari

[pikinier20]

"Run" buttons need to add package import first, but it still might not be enough to compile the more complex examples:

vs

There's some work to do in terms of retrieving nested objects and importing them correctly. I think we can do it after merging the new UI.

[TheElectronWill]

In https://scala3doc.virtuslab.com/pr-new-ui/scala3/api/scala/collection/immutable/List.html the code samples are not fully visible without horizontal scrolling: [...] I don't mind a fixed width but I think a bigger one would work better here. Compare also with https://doc.rust-lang.org/std/macro.matches.html

Related to this, I've noticed that when the window is small, the width of the #content > div:first-child is bigger (this width is acceptable):

and when I maximize the window it gets smaller (too small):

I presume that this is because of:

@media (max-width: 1436px)
#content > div:first-child {
  width: auto;
}
@media (max-width: 1920px)
#content > div:first-child {
  width: calc(90 * var(--base-spacing)); /* this should be larger */
}

I've tested

@media (max-width: 1920px)
#content > div:first-child {
  width: 980px; /* on Firefox it's almost the perfect value, YMMV */
}

and it seemed quite good at avoiding the sudden shrinking of the central div :)

[smarter]

Are all the issues which were raised in this PR planned to be addressed? Should we open new issues to track them?

[pikinier20]

Are all the issues which were raised in this PR planned to be addressed? Should we open new issues to track them?

I think that if some bug wasn't addressed and is still present then we should have a separate issue for it.