]> git.lizzy.rs Git - rust.git/commitdiff
rustdoc: remove unnecessary wrapper around sidebar and mobile logos
authorMichael Howell <michael@notriddle.com>
Wed, 4 Jan 2023 20:04:30 +0000 (13:04 -0700)
committerMichael Howell <michael@notriddle.com>
Wed, 4 Jan 2023 20:32:27 +0000 (13:32 -0700)
This commit changes `.sidebar a:hover:not(.logo-container)` to add the `:not()` pseudo-class, retaining the old appearance of the logo when mousing over it.

This didn't used to be necessary because the `a.sidebar-logo` was `display:inline`, and was what got the `background` changed on hover, while the `div.logo-container` inside it was `display:block`. This resulted in the hover rule not having any effect, because the logo-container box was not actually nested inside the sidebar-logo box:

https://www.w3.org/TR/CSS2/visuren.html#anonymous-block-level

> When an inline box contains an in-flow block-level box, the inline box (and its inline ancestors within the same line box) are broken around the block-level box (and any block-level siblings that are consecutive or separated only by collapsible whitespace and/or out-of-flow elements), splitting the inline box into two boxes (even if either side is empty), one on each side of the block-level box(es). The line boxes before the break and after the break are enclosed in anonymous block boxes, and the block-level box becomes a sibling of those anonymous boxes. When such an inline box is affected by relative positioning, any resulting translation also affects the block-level box contained in the inline box.

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

index afc369bc3fda6fb8d4765af5b8177964ad13124d..cdc077e26bf22907a26e98805ed7a0f1a91b92d1 100644 (file)
@@ -352,6 +352,7 @@ img {
 .sub-logo-container, .logo-container {
        /* zero text boxes so that computed line height = image height exactly */
        line-height: 0;
+       display: block;
 }
 
 .sub-logo-container {
@@ -495,7 +496,7 @@ ul.block, .block li {
        color: var(--sidebar-link-color);
 }
 .sidebar .current,
-.sidebar a:hover {
+.sidebar a:hover:not(.logo-container) {
        background-color: var(--sidebar-current-link-background-color);
 }
 
@@ -1570,7 +1571,7 @@ in storage.js
 
        /* Hide the logo and item name from the sidebar. Those are displayed
           in the mobile-topbar instead. */
-       .sidebar .sidebar-logo,
+       .sidebar .logo-container,
        .sidebar .location {
                display: none;
        }
index bcaff957af2f60aa2ed651a9b464bb8374eca9d1..fddda293b9a86d98cf300cb1ebc672ae80fe1df3 100644 (file)
     {%- if page.css_class != "source" -%}
     <nav class="mobile-topbar"> {#- -#}
         <button class="sidebar-menu-toggle">&#9776;</button> {#- -#}
-        <a class="sidebar-logo" href="{{page.root_path|safe}}{{krate_with_trailing_slash|safe}}index.html"> {#- -#}
-            <div class="logo-container"> {#- -#}
-            {%- if !layout.logo.is_empty() -%}
-                <img src="{{layout.logo}}" alt="logo"> {#- -#}
-            {%- else -%}
-                <img class="rust-logo" src="{{static_root_path|safe}}{{files.rust_logo_svg}}" alt="logo"> {#- -#}
-            {%- endif -%}
-            </div> {#- -#}
+        <a class="logo-container" href="{{page.root_path|safe}}{{krate_with_trailing_slash|safe}}index.html"> {#- -#}
+        {%- if !layout.logo.is_empty() -%}
+            <img src="{{layout.logo}}" alt="logo"> {#- -#}
+        {%- else -%}
+            <img class="rust-logo" src="{{static_root_path|safe}}{{files.rust_logo_svg}}" alt="logo"> {#- -#}
+        {%- endif -%}
         </a> {#- -#}
         <h2></h2> {#- -#}
     </nav> {#- -#}
     {%- endif -%}
     <nav class="sidebar"> {#- -#}
         {%- if page.css_class != "source" -%}
-        <a class="sidebar-logo" href="{{page.root_path|safe}}{{krate_with_trailing_slash|safe}}index.html"> {#- -#}
-            <div class="logo-container"> {#- -#}
-                {%- if !layout.logo.is_empty()  %}
-                    <img src="{{layout.logo}}" alt="logo"> {#- -#}
-                {%- else -%}
-                    <img class="rust-logo" src="{{static_root_path|safe}}{{files.rust_logo_svg}}" alt="logo"> {#- -#}
-                {%- endif -%}
-            </div> {#- -#}
+        <a class="logo-container" href="{{page.root_path|safe}}{{krate_with_trailing_slash|safe}}index.html"> {#- -#}
+            {%- if !layout.logo.is_empty()  %}
+                <img src="{{layout.logo}}" alt="logo"> {#- -#}
+            {%- else -%}
+                <img class="rust-logo" src="{{static_root_path|safe}}{{files.rust_logo_svg}}" alt="logo"> {#- -#}
+            {%- endif -%}
         </a> {#- -#}
         {%- endif -%}
         {{- sidebar|safe -}}