Rollup merge of #101494 - jsha:notable-traits-right, r=GuillaumeGomez

[rust.git] / 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 dae2ff4e226370646d391d90ad0de9dee72ec4ed..0e48b1009d8aacc0e3a714ec9c416bcbb3f7c58b 100644 (file)
--- a/src/librustdoc/html/static/css/rustdoc.css
+++ b/src/librustdoc/html/static/css/rustdoc.css
@@ -206,7 +206,6 @@ a.source,
 .item-left > a,
 .out-of-band,
 span.since,
-#source-sidebar, #sidebar-toggle,
 details.rustdoc-toggle > summary::before,
 .content ul.crate a.crate,
 a.srclink,
@@ -223,7 +222,6 @@ details.rustdoc-toggle.non-exhaustive > summary::before,
        font-family: "Fira Sans", Arial, NanumBarunGothic, sans-serif;
 }
 
-h1, h2, h3, h4,
 a#toggle-all-docs,
 a.anchor,
 .small-section-header a,
@@ -610,16 +608,12 @@ h2.location a {
 .docblock-short {
        overflow-wrap: break-word;
        overflow-wrap: anywhere;
-}
-.docblock-short p {
-       display: inline;
        overflow: hidden;
        text-overflow: ellipsis;
-       margin: 0;
 }
 /* Wrap non-pre code blocks (`text`) but not (```text```). */
 .docblock > :not(pre) > code,
-.docblock-short > :not(pre) > code {
+.docblock-short > code {
        white-space: pre-wrap;
 }
 
@@ -687,15 +681,6 @@ pre, .rustdoc.source .example-wrap {
        position: relative;
 }
 
-.content table {
-       border-spacing: 0 5px;
-}
-.content td { vertical-align: top; }
-.content td:first-child { padding-right: 20px; }
-.content td p:first-child { margin-top: 0; }
-.content td h1, .content td h2 { margin-left: 0; font-size: 1.125rem; }
-.content tr:first-child td { border-top: 0; }
-
 .docblock table {
        margin: .5em 0;
        width: calc(100% - 2px);
@@ -706,6 +691,7 @@ pre, .rustdoc.source .example-wrap {
 .docblock table td {
        padding: .5em;
        border: 1px dashed var(--border-color);
+       vertical-align: top;
 }
 
 .docblock table th {
@@ -767,7 +753,6 @@ nav.sub form { display: inline; }
 
 a {
        text-decoration: none;
-       background: transparent;
 }
 
 .small-section-header {
@@ -987,12 +972,6 @@ so that we can apply CSS-filters to change the arrow color in themes */
        padding-right: 1em;
 }
 
-.search-results .result-name > span {
-       display: inline-block;
-       margin: 0;
-       font-weight: normal;
-}
-
 .popover {
        font-size: 1rem;
        position: absolute;
@@ -1151,42 +1130,100 @@ pre.rust .question-mark {
        font-weight: bold;
 }
 
-pre.compile_fail,
-pre.should_panic {
+.example-wrap.compile_fail,
+.example-wrap.should_panic {
        border-left: 2px solid var(--codeblock-error-color);
 }
 
-pre.ignore {
+.ignore.example-wrap {
        border-left: 2px solid var(--codeblock-ignore-color);
 }
 
-.example-wrap:hover pre.compile_fail,
-.example-wrap:hover pre.should_panic {
+.example-wrap.compile_fail:hover,
+.example-wrap.should_panic:hover {
        border-left: 2px solid var(--codeblock-error-hover-color);
 }
 
-.example-wrap:hover pre.ignore {
+.example-wrap.ignore:hover {
        border-left: 2px solid var(--codeblock-ignore-hover-color);
 }
 
-.tooltip.compile_fail,
-.tooltip.should_panic {
+.example-wrap.compile_fail .tooltip,
+.example-wrap.should_panic .tooltip {
        color: var(--codeblock-error-color);
 }
 
-.tooltip.ignore {
+.example-wrap.ignore .tooltip {
        color:  var(--codeblock-ignore-color);
 }
 
-.example-wrap:hover .tooltip.compile_fail,
-.example-wrap:hover .tooltip.should_panic {
+.example-wrap.compile_fail:hover .tooltip,
+.example-wrap.should_panic:hover .tooltip {
        color: var(--codeblock-error-hover-color);
 }
 
-.example-wrap:hover .tooltip.ignore {
+.example-wrap.ignore:hover .tooltip {
        color: var(--codeblock-ignore-hover-color);
 }
 
+.example-wrap .tooltip {
+       position: absolute;
+       display: block;
+       cursor: pointer;
+       left: -25px;
+       top: 5px;
+}
+
+.example-wrap .tooltip::after {
+       display: none;
+       text-align: center;
+       padding: 5px 3px 3px 3px;
+       border-radius: 6px;
+       margin-left: 5px;
+       font-size: 1rem;
+       border: 1px solid var(--border-color);
+       position: absolute;
+       width: max-content;
+       top: -2px;
+       z-index: 1;
+}
+
+.example-wrap .tooltip::before {
+       content: " ";
+       position: absolute;
+       top: 50%;
+       left: 16px;
+       margin-top: -5px;
+       border-width: 5px;
+       border-style: solid;
+       display: none;
+       z-index: 1;
+}
+
+.example-wrap.ignore .tooltip::after {
+       content: "This example is not tested";
+}
+.example-wrap.compile_fail .tooltip::after {
+       content: "This example deliberately fails to compile";
+}
+.example-wrap.should_panic .tooltip::after {
+       content: "This example panics";
+}
+.example-wrap.edition .tooltip::after {
+       content: "This code runs with edition " attr(data-edition);
+}
+
+.example-wrap .tooltip:hover::before, .example-wrap .tooltip:hover::after {
+       display: inline;
+}
+
+.example-wrap.compile_fail .tooltip,
+.example-wrap.should_panic .tooltip,
+.example-wrap.ignore .tooltip {
+       font-weight: bold;
+       font-size: 1.25rem;
+}
+
 a.test-arrow {
        display: inline-block;
        visibility: hidden;
@@ -1216,7 +1253,6 @@ a.test-arrow:hover {
 }
 
 .out-of-band > span.since {
-       position: initial;
        font-size: 1.25rem;
 }
 
@@ -1252,62 +1288,6 @@ h3.variant {
        padding-right: 3px;
 }
 
-.information {
-       position: absolute;
-       left: -25px;
-       margin-top: 7px;
-       z-index: 1;
-}
-
-.tooltip {
-       position: relative;
-       display: inline-block;
-       cursor: pointer;
-}
-
-.tooltip::after {
-       display: none;
-       text-align: center;
-       padding: 5px 3px 3px 3px;
-       border-radius: 6px;
-       margin-left: 5px;
-       font-size: 1rem;
-       border: 1px solid var(--border-color);
-}
-
-.tooltip.ignore::after {
-       content: "This example is not tested";
-}
-.tooltip.compile_fail::after {
-       content: "This example deliberately fails to compile";
-}
-.tooltip.should_panic::after {
-       content: "This example panics";
-}
-.tooltip.edition::after {
-       content: "This code runs with edition " attr(data-edition);
-}
-
-.tooltip::before {
-       content: " ";
-       position: absolute;
-       top: 50%;
-       left: 16px;
-       margin-top: -5px;
-       border-width: 5px;
-       border-style: solid;
-       display: none;
-}
-
-.tooltip:hover::before, .tooltip:hover::after {
-       display: inline;
-}
-
-.tooltip.compile_fail, .tooltip.should_panic, .tooltip.ignore {
-       font-weight: bold;
-       font-size: 1.25rem;
-}
-
 .notable-traits-tooltip {
        display: inline-block;
        cursor: pointer;
@@ -1349,7 +1329,7 @@ h3.variant {
        display: block;
 }
 
-.notable-traits .docblock code.content{
+.notable-traits .docblock code.content {
        margin: 0;
        padding: 0;
        font-size: 1.25rem;
@@ -1383,27 +1363,19 @@ pre.rust {
 }
 
 #titles {
-       height: 35px;
+       display: flex;
+       flex-direction: row;
+       gap: 1px;
+       margin-bottom: 4px;
 }
 
 #titles > button {
-       float: left;
-       width: 33.3%;
        text-align: center;
        font-size: 1.125rem;
        cursor: pointer;
        border: 0;
        border-top: 2px solid;
-}
-
-#titles > button:first-child:last-child {
-       margin-right: 1px;
-       width: calc(100% - 1px);
-}
-
-#titles > button:not(:last-child) {
-       margin-right: 1px;
-       width: calc(33.3% - 1px);
+       flex: 1;
 }
 
 #titles > button > div.count {
@@ -1718,7 +1690,7 @@ in storage.js plus the media query with (max-width: 700px)
        to prevent an overlay between the "collapse toggle" and the information tooltip.
        However, it's not needed with smaller screen width because the doc/code block is always put
        "one line" below. */
-       .docblock > .example-wrap:first-child > .information > .tooltip {
+       .docblock > .example-wrap:first-child .tooltip {
                margin-top: 16px;
        }
 
@@ -1889,28 +1861,12 @@ in storage.js plus the media query with (min-width: 701px)
                margin-top: 10px;
        }
 
-       #search {
-               margin-left: 0;
-               padding: 0;
-       }
-
        .anchor {
                display: none !important;
        }
 
-       .notable-traits {
-               position: absolute;
-               left: -22px;
-               top: 24px;
-       }
-
        #titles > button > div.count {
-               float: left;
-               width: 100%;
-       }
-
-       #titles {
-               height: 50px;
+               display: block;
        }
 
        /* Because of ios, we need to actually have a full height sidebar title so the
@@ -2041,10 +1997,6 @@ in storage.js plus the media query with (min-width: 701px)
 }
 
 @media (max-width: 464px) {
-       #titles, #titles > button {
-               height: 73px;
-       }
-
        #crate-search {
                border-radius: 4px;
        }