user0/rust
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

rustdoc: bundle sidebar button icon into CSS

Browse source 
This removes an HTTP request from the loading pipeline,
and allows it to be changed with a media query.
This commit is contained in:
Michael Howell 2023-10-07 09:41:38 -07:00
parent 273a302ac8
commit 9aabfd5892
3 changed files with 23 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/librustdoc/html/static/css/rustdoc.css
View file

@ -1597,6 +1597,16 @@ a.tooltip:hover::after {
border-color: var(--settings-button-border-focus);
}
#sidebar-button > a:before {
content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 22" \
fill="none" stroke="black">\
<rect x="1" y="1" width="20" height="20" ry="1.5" stroke-width="1.5"/>\
<circle cx="4.375" cy="4.375" r="1" stroke-width=".75"/>\
<path d="m7.6121 3v16 M5.375 7.625h-2 m2 3h-2 m2 3h-2" stroke-width="1.25"/></svg>');
width: 22px;
height: 22px;
}
#copy-path {
color: var(--copy-path-button-color);
background: var(--main-background-color);
@ -1983,6 +1993,17 @@ in src-script.js and main.js
display: none;
}
/* sidebar button becomes topbar button */
#sidebar-button > a:before {
content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" \
viewBox="0 0 22 22" fill="none" stroke="black">\
<rect x="1" y="1" width="20" height="20" ry="1.5" stroke-width="1.5"/>\
<circle cx="4.375" cy="4.375" r="1" stroke-width=".75"/>\
<path d="m3 7.375h16m0-3h-4" stroke-width="1.25"/></svg>');
width: 22px;
height: 22px;
}
/* Display an alternating layout on tablets and phones */
.item-table, .item-row, .item-table > li, .item-table > li > div,
.search-results > a, .search-results > a > div {
@ -2690,7 +2711,7 @@ Original by Dempfi (https://github.com/dempfi/ayu)
}
:root[data-theme="ayu"] #settings-menu > a img,
:root[data-theme="ayu"] #sidebar-button > a img {
:root[data-theme="ayu"] #sidebar-button > a:before {
filter: invert(100);
}
/* End theme: ayu */

15
src/librustdoc/html/static/images/sidebar.svg
View file

@ -1,15 +0,0 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="22" height="22" version="1.1" viewBox="0 0 22 22" xmlns="http://www.w3.org/2000/svg">
<g fill="none" stroke="#000">
<rect x="1" y="1" width="20" height="20" ry="1.5" stroke-width="1.5"/>
<path d="m7.6121 3v16" stroke-width="1.2241"/>
<g>
<g stroke-width="1.25">
<path d="m5.375 7.625h-2"/>
<path d="m5.375 10.625h-2"/>
<path d="m5.375 13.625h-2"/>
</g>
<circle cx="4.375" cy="4.375" r="1" stroke-width=".75"/>
</g>
</g>
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 509 B

5
src/librustdoc/html/templates/page.html
View file

@ -132,10 +132,7 @@
<span></span> {# This empty span is a hacky fix for Safari - See #93184 #}
{% if page.css_class != "src" %}
<div id="sidebar-button" tabindex="-1"> {# #}
<a href="{{page.root_path|safe}}{{layout.krate|safe}}/all.html" title="show sidebar"> {# #}
<img width="22" height="22" alt="Show sidebar" {#+ #}
src="{{static_root_path|safe}}{{files.sidebar_svg}}"> {# #}
</a> {# #}
<a href="{{page.root_path|safe}}{{layout.krate|safe}}/all.html" title="show sidebar"></a> {# #}
</div> {# #}
{% endif %}
<input {#+ #}