Rollup merge of rust-lang#92602 - jsha:source-link-2, r=GuillaumeGomez

Make source links look cleaner

Change from syntaxy-looking [src] to the plain word "source".

Change the syntaxy-looking `[-]` at the top of the page to say "collapse".

Reduce opacity of rightside content.

Part of rust-lang#59851

r? `@GuillaumeGomez`

Demo: https://rustdoc.crud.net/jsha/source-link-2/std/string/struct.String.html

[Discussed on Zulip](https://rust-lang.zulipchat.com/#narrow/stream/266220-rustdoc/topic/display.20of.20source.20link).

Author: matthiaskrgr

library/std/src/lib.rs

@@ -35,8 +35,8 @@
 //! development you may want to press the `[-]` button near the top of the
 //! page to collapse it into a more skimmable view.
 //!
-//! While you are looking at that `[-]` button also notice the `[src]`
-//! button. Rust's API documentation comes with the source code and you are
+//! While you are looking at that `[-]` button also notice the `source`
+//! link. Rust's API documentation comes with the source code and you are
 //! encouraged to read it. The standard library source is generally high
 //! quality and a peek behind the curtains is often enlightening.
 //!

src/librustdoc/html/render/context.rs

@@ -65,7 +65,7 @@ crate struct Context<'tcx> {
     ///
     /// [#82381]: https://github.com/rust-lang/rust/issues/82381
     crate shared: Rc<SharedContext<'tcx>>,
-    /// This flag indicates whether `[src]` links should be generated or not. If
+    /// This flag indicates whether source links should be generated or not. If
     /// the source files are present in the html rendering, then this will be
     /// `true`.
     crate include_sources: bool,

src/librustdoc/html/render/mod.rs

@@ -182,7 +182,7 @@ impl StylePath {
 
 fn write_srclink(cx: &Context<'_>, item: &clean::Item, buf: &mut Buffer) {
     if let Some(l) = cx.src_href(item) {
-        write!(buf, "<a class=\"srclink\" href=\"{}\" title=\"goto source code\">[src]</a>", l)
+        write!(buf, "<a class=\"srclink\" href=\"{}\" title=\"goto source code\">source</a>", l)
     }
 }
 
@@ -799,7 +799,7 @@ fn render_stability_since_raw(
     const_stability: Option<ConstStability>,
     containing_ver: Option<Symbol>,
     containing_const_ver: Option<Symbol>,
-) {
+) -> bool {
     let ver = ver.filter(|inner| !inner.is_empty());
 
     match (ver, const_stability) {
@@ -842,8 +842,9 @@ fn render_stability_since_raw(
                 v
             );
         }
-        _ => {}
+        _ => return false,
     }
+    true
 }
 
 fn render_assoc_item(
@@ -1632,7 +1633,7 @@ fn render_impl(
 }
 
 // Render the items that appear on the right side of methods, impls, and
-// associated types. For example "1.0.0 (const: 1.39.0) [src]".
+// associated types. For example "1.0.0 (const: 1.39.0) · source".
 fn render_rightside(
     w: &mut Buffer,
     cx: &Context<'_>,
@@ -1650,13 +1651,16 @@ fn render_rightside(
     };
 
     write!(w, "<div class=\"rightside\">");
-    render_stability_since_raw(
+    let has_stability = render_stability_since_raw(
         w,
         item.stable_since(tcx),
         const_stability,
         containing_item.stable_since(tcx),
         const_stable_since,
     );
+    if has_stability {
+        w.write_str(" · ");
+    }
 
     write_srclink(cx, item, w);
     w.write_str("</div>");

src/librustdoc/html/render/print_item.rs

@@ -108,10 +108,10 @@ pub(super) fn print_item(
     );
     let stability_since_raw: String = stability_since_raw.into_inner();
 
-    // Write `src` tag
+    // Write source tag
     //
     // When this item is part of a `crate use` in a downstream crate, the
-    // [src] link in the downstream documentation will actually come back to
+    // source link in the downstream documentation will actually come back to
     // this page, and this link will be auto-clicked. The `id` attribute is
     // used to find the link to auto-click.
     let src_href =
@@ -1467,7 +1467,7 @@ fn render_stability_since(
         item.const_stability(tcx),
         containing_item.stable_since(tcx),
         containing_item.const_stable_since(tcx),
-    )
+    );
 }
 
 fn compare_impl<'a, 'b>(lhs: &'a &&Impl, rhs: &'b &&Impl, cx: &Context<'_>) -> Ordering {

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

@@ -137,17 +137,25 @@ h1, h2, h3, h4 {
 	margin: 15px 0 5px 0;
 }
 h1.fqn {
+	margin: 0;
+	padding: 0;
+}
+.main-heading {
 	display: flex;
-	border-bottom: 1px dashed;
-	margin-top: 0;
+	border-bottom: 1px dashed #DDDDDD;
+	padding-bottom: 6px;
+	margin-bottom: 15px;
 
 	/* workaround to keep flex from breaking below 700 px width due to the float: right on the nav
 	   above the h1 */
 	padding-left: 1px;
 }
-h1.fqn > .in-band > a:hover {
+.main-heading a:hover {
 	text-decoration: underline;
 }
+#toggle-all-docs {
+	text-decoration: none;
+}
 /* The only headings that get underlines are:
 	 Markdown-generated headings within the top-doc
 	 Rustdoc-generated h2 section headings (e.g. "Implementations", "Required Methods", etc)
@@ -195,11 +203,13 @@ h1, h2, h3, h4, h5, h6,
 .sidebar, a.source, .search-input, .search-results .result-name,
 .content table td:first-child > a,
 .item-left > a,
-div.item-list .out-of-band, span.since,
+.out-of-band,
+span.since,
 #source-sidebar, #sidebar-toggle,
 details.rustdoc-toggle > summary::before,
 div.impl-items > div:not(.docblock):not(.item-info),
-.content ul.crate a.crate, a.srclink,
+.content ul.crate a.crate,
+a.srclink,
 /* This selector is for the items listed in the "all items" page. */
 #main-content > ul.docblock > li > a {
 	font-family: "Fira Sans", Arial, NanumBarunGothic, sans-serif;
@@ -609,10 +619,12 @@ nav.sub {
 .content .out-of-band {
 	flex-grow: 0;
 	text-align: right;
-	font-size: 1.4375rem;
-	margin: 0px;
+	margin-left: auto;
+	margin-right: 0;
+	font-size: 1.15rem;
 	padding: 0 0 0 12px;
 	font-weight: normal;
+	float: right;
 }
 
 .method > .code-header, .trait-impl > .code-header, .invisible > .code-header {
@@ -1082,7 +1094,7 @@ body.blur > :not(#help) {
 	font-size: initial;
 }
 
-.impl-items .since, .impl .since, .methods .since {
+.rightside {
 	padding-left: 12px;
 	padding-right: 2px;
 	position: initial;
@@ -1160,10 +1172,6 @@ a.test-arrow:hover{
 	font-weight: 300;
 }
 
-.since + .srclink {
-	padding-left: 10px;
-}
-
 .item-spacer {
 	width: 100%;
 	height: 12px;

src/librustdoc/html/static/css/themes/ayu.css

@@ -222,7 +222,7 @@ nav.main .separator {
 a {
 	color: #39AFD7;
 }
-a.srclink,
+
 a#toggle-all-docs,
 a.anchor,
 .small-section-header a,

src/librustdoc/html/static/css/themes/dark.css

@@ -180,7 +180,7 @@ nav.main .separator {
 a {
 	color: #D2991D;
 }
-a.srclink,
+
 a#toggle-all-docs,
 a.anchor,
 .small-section-header a,

src/librustdoc/html/static/css/themes/light.css

@@ -177,7 +177,7 @@ nav.main .separator {
 a {
 	color: #3873AD;
 }
-a.srclink,
+
 a#toggle-all-docs,
 a.anchor,
 .small-section-header a,
@@ -243,10 +243,6 @@ details.undocumented > summary::before {
 	border-color: #bfbfbf;
 }
 
-.since {
-	color: grey;
-}
-
 .result-name .primitive > i, .result-name .keyword > i {
 	color: black;
 }

src/librustdoc/html/templates/print_item.html

@@ -1,26 +1,28 @@
-<h1 class="fqn"> {#- -#}
-    <span class="in-band"> {#- -#}
-        {{-typ-}}
-        {#- The breadcrumbs of the item path, like std::string -#}
-        {%- for component in path_components -%}
-        <a href="{{component.path | safe}}index.html">{{component.name}}</a>::<wbr>
-        {%- endfor -%}
-        <a class="{{item_type}}" href="#">{{name}}</a> {#- -#}
-        <button id="copy-path" onclick="copy_path(this)" title="Copy item path to clipboard"> {#- -#}
-            <img src="{{static_root_path | safe}}clipboard{{page.resource_suffix}}.svg" {# -#}
-                width="19" height="18" {# -#}
-                alt="Copy item path"> {#- -#}
-        </button> {#- -#}
-    </span> {#- -#}
-    <span class="out-of-band"> {#- -#}
-        {{- stability_since_raw | safe -}}
-        <span id="render-detail"> {#- -#}
-            <a id="toggle-all-docs" href="javascript:void(0)" title="collapse all docs"> {#- -#}
-                [<span class="inner">&#x2212;</span>] {#- -#}
-            </a> {#- -#}
+<div class="main-heading">
+    <h1 class="fqn"> {#- -#}
+        <span class="in-band"> {#- -#}
+            {{-typ-}}
+            {#- The breadcrumbs of the item path, like std::string -#}
+            {%- for component in path_components -%}
+            <a href="{{component.path | safe}}index.html">{{component.name}}</a>::<wbr>
+            {%- endfor -%}
+            <a class="{{item_type}}" href="#">{{name}}</a> {#- -#}
+            <button id="copy-path" onclick="copy_path(this)" title="Copy item path to clipboard"> {#- -#}
+                <img src="{{static_root_path | safe}}clipboard{{page.resource_suffix}}.svg" {# -#}
+                    width="19" height="18" {# -#}
+                    alt="Copy item path"> {#- -#}
+            </button> {#- -#}
         </span> {#- -#}
-        {%- if src_href -%}
-        <a class="srclink" href="{{src_href | safe}}" title="goto source code">[src]</a>
-        {%- endif -%}
+    </h1> {#- -#}
+    <span class="out-of-band"> {#- -#}
+        {% if stability_since_raw %}
+        {{- stability_since_raw | safe -}} · 
+        {% endif %}
+        {%- if src_href %}
+        <a class="srclink" href="{{src_href | safe}}" title="goto source code">source</a> ·
+        {% endif -%}
+        <a id="toggle-all-docs" href="javascript:void(0)" title="collapse all docs"> {#- -#}
+            [<span class="inner">&#x2212;</span>] {#- -#}
+        </a> {#- -#}
     </span> {#- -#}
-</h1> {#- -#}
+</div>

src/test/rustdoc-gui/anchors.goml

@@ -13,8 +13,10 @@ reload:
 assert-css: ("#toggle-all-docs", {"color": "rgb(0, 0, 0)"})
 assert-css: (".fqn .in-band a:nth-of-type(1)", {"color": "rgb(0, 0, 0)"})
 assert-css: (".fqn .in-band a:nth-of-type(2)", {"color": "rgb(173, 55, 138)"})
-assert-css: (".srclink", {"color": "rgb(0, 0, 0)"})
-assert-css: (".srclink", {"color": "rgb(0, 0, 0)"})
+assert-css: (".srclink", {"color": "rgb(56, 115, 173)"})
+
+move-cursor-to: ".main-heading .srclink"
+assert-css: (".srclink", {"text-decoration": "underline solid rgb(56, 115, 173)"})
 
 assert-css: ("#top-doc-prose-title", {"color": "rgb(0, 0, 0)"})