Rollup merge of #101812 - notriddle:notriddle/titles-button, r=GuillaumeGomez

rustdoc: clean up CSS `#titles` using flexbox

This commit allows it to stop manually specifying pixel heights for the tabs on search result pages. There's less messing with manual breakpoints and less complex CSS selectors.

# Before

![image](https://user-images.githubusercontent.com/1593513/190215034-253c0f58-07c6-41c9-8848-0442c0522070.png)

# After

![image](https://user-images.githubusercontent.com/1593513/190215065-d2453dca-edf0-4353-8fc8-3a3b31f03892.png)
This commit is contained in:
Matthias Krüger
2022-09-15 08:00:17 +02:00
committed by GitHub
+6 -23
View File
@@ -1365,27 +1365,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 {
@@ -1882,12 +1874,7 @@ in storage.js plus the media query with (min-width: 701px)
}
#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
@@ -2018,10 +2005,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;
}