From 152e8889052adaaa6c12652486292be34059713c Mon Sep 17 00:00:00 2001 From: Jacob Hoffman-Andrews Date: Thu, 13 Jan 2022 09:54:44 -0800 Subject: Rustdoc mobile: put out-of-band on its own line Before this, the item name and the stability, source link, and "collapse all docs" would compete for room on a single line, resulting in awkward wrapping behavior on mobile. This gives a separate line for that out-of-band information. It also removes the "copy path" icon on mobile to make a little more room. Also, switch to flex-wrap: wrap, so anytime there's not enough room for `source`, it gets bumped to the next line. --- src/librustdoc/html/static/css/rustdoc.css | 29 ++++++++++++++++++++--------- 1 file changed, 20 insertions(+), 9 deletions(-) (limited to 'src/librustdoc/html/static/css/rustdoc.css') diff --git a/src/librustdoc/html/static/css/rustdoc.css b/src/librustdoc/html/static/css/rustdoc.css index 44a9a571fa1..d0244351b59 100644 --- a/src/librustdoc/html/static/css/rustdoc.css +++ b/src/librustdoc/html/static/css/rustdoc.css @@ -148,11 +148,11 @@ h1.fqn { } .main-heading { display: flex; + flex-wrap: wrap; + justify-content: space-between; + 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; } .main-heading a:hover { text-decoration: underline; @@ -623,11 +623,7 @@ nav.sub { .content .out-of-band { flex-grow: 0; - text-align: right; - margin-left: auto; - margin-right: 0; font-size: 1.15rem; - padding: 0 0 0 12px; font-weight: normal; float: right; } @@ -1748,10 +1744,25 @@ details.rustdoc-toggle[open] > summary.hideme::after { padding-top: 0px; } - .rustdoc { + .rustdoc, + .main-heading { flex-direction: column; } + .content .out-of-band { + text-align: left; + margin-left: initial; + padding: initial; + } + + .content .out-of-band .since::before { + content: "Since "; + } + + #copy-path { + display: none; + } + /* Hide the logo and item name from the sidebar. Those are displayed in the mobile-topbar instead. */ .sidebar .sidebar-logo, -- cgit 1.4.1-3-g733a5