doc: custom.css: fix "View Page Source" align with newer sphinx_rtd_t…

…heme

sphinx_rtd_theme PR #1073, which went into 1.2.0, removed the
vertical-align attribute for the "View Page Source" link, which does not
have a big impact on the vanilla sphinx_rtd_theme. However our custom
theme hacks add buttons left and right of the breadcrumbs which are
higher than the line height, and therefore our custom.css already
includes a "vertical-align: middle" to align the text of the chapter
marks with the surrounding buttons. However, this doesn't work for the
.wy-breadcrumbs-aside elements, which get floated right; therefore they
get rendered as "display: block" instead of "display: inline-block", and
according to the CSS specification, the "vertical-align" has no effect
on "display: block" elements. This has the effect that the "View Source"
link is now no longer aligned vertically, but instead is shifted upwards
relative to the baseline of the chapter marks.

The right way to have left-aligned chapter marks and right-aligned "View
Source" link would probably be a flex layout, but that would need
another layer of <div>s to group the left and right elements of the
navigation header, which we cannot do here as we only have control over
the CSS and not the page structure. Instead, re-apply the display and
padding that were removed in PR #1073 (and increase the padding to 7px
to account for or higher buttons), which does approximately the right
thing, and re-aligns the "View Source" link with the baseline of the
chapter marks again.

This has no effect on sphinx_rtd_theme < 1.2.0 since the a element and
the surrounding .wy-breadcrumbs-aside will be of the same height.

Link: readthedocs/sphinx_rtd_theme#1073
Signed-off-by: Roland Hieber <rhi@pengutronix.de>
Message-Id: <20230506202223.263380-3-rhi@pengutronix.de>
Signed-off-by: Michael Olbrich <m.olbrich@pengutronix.de>

doc/_static/css/custom.css

@@ -12,6 +12,11 @@
     vertical-align: middle;
 }
 
+/* "View Page Source" link */
+.wy-breadcrumbs .wy-breadcrumbs-aside > a {
+    display: inline-block;
+    padding: 7px;
+}
 
 /* links */
 .wy-menu-vertical a:active {