mikros/rust
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Rollup merge of #105155 - notriddle:notriddle/flexbox-help-settings-buttons, r=GuillaumeGomez

Browse Source 
rustdoc: clean up help and settings button CSS

The old version of this code specified a bunch of different numbers that had to line up just right to get the size it wanted. This version uses flexbox centering, specifies the font size, and lets the browser figure out the rest of the layout automatically.

Preview: http://notriddle.com/notriddle-rustdoc-demos/flexbox-help-settings-buttons/test_dingus/
This commit is contained in:
Matthias Krüger 2022-12-02 21:22:49 +01:00 committed by GitHub
commit de0d18a85e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
src/librustdoc/html/static/css/rustdoc.css
View File

@ -908,6 +908,7 @@ so that we can apply CSS-filters to change the arrow color in themes */
.popover {
position: absolute;
top: 100%;
right: 0;
z-index: 2;
display: block;
@ -1357,22 +1358,24 @@ a.test-arrow:hover {
}
#settings-menu, #help-button {
margin-left: 4px;
outline: none;
display: flex;
}
#settings-menu > a, #help-button > a, #copy-path {
width: 33px;
line-height: 1.5;
}
#settings-menu > a, #help-button > a {
padding: 5px;
height: 100%;
display: block;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--button-background-color);
border: 1px solid var(--border-color);
border-radius: 2px;
color: var(--settings-button-color);
/* Rare exception to specifying font sizes in rem. Since this is acting
as an icon, it's okay to specify their sizes in pixels. */
font-size: 20px;
}
#settings-menu > a:hover, #settings-menu > a:focus,
@ -1408,14 +1411,6 @@ a.test-arrow:hover {
animation: rotating 2s linear infinite;
}
#help-button > a {
text-align: center;
/* Rare exception to specifying font sizes in rem. Since this is acting
as an icon, it's okay to specify their sizes in pixels. */
font-size: 20px;
padding-top: 2px;
}
kbd {
display: inline-block;
padding: 3px 5px;
@ -1658,10 +1653,6 @@ in storage.js
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,
@ -1795,8 +1786,8 @@ in storage.js
border-bottom: 1px solid;
}
/* We don't display the help button on mobile devices. */
#help-button {
/* We don't display these buttons on mobile devices. */
#copy-path, #help-button {
display: none;
}