From 25144881f03a44fa0ba72a75ddc06cb6cc151af3 Mon Sep 17 00:00:00 2001 From: Eric Date: Thu, 15 Jun 2023 16:41:19 -0500 Subject: [PATCH] Website: Fix overlapping edit button on documentation pages (#12363) Closes: #12354 Changes: - Added right margin to the first h1 in documentation pages to prevent headings from overflowing onto the edit page button. - Added a minimum height to the subtopics of documentation pages on mobile screens to prevent the edit page button from being positioned over the page's content. --- website/assets/styles/pages/docs/basic-documentation.less | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/website/assets/styles/pages/docs/basic-documentation.less b/website/assets/styles/pages/docs/basic-documentation.less index 7147a59880..6e763fef8f 100644 --- a/website/assets/styles/pages/docs/basic-documentation.less +++ b/website/assets/styles/pages/docs/basic-documentation.less @@ -528,6 +528,10 @@ padding: 0px; display: none; } + h1:first-of-type { + // Note: We're adding right margin to the first h1 to make sure it won't overlap the edit page button. + margin-right: 100px; + } h1 { padding-bottom: 16px; } @@ -858,6 +862,9 @@ [purpose='right-sidebar'] { width: 100%; + // Note: we're specifying a minimum height for this element to be the height of the edit page button. + // Even if there are no subtopics on a documentation page, we can be sure that the edit page button will not overlap the pages content. + min-height: 30px; [purpose='subtopics'] { color: @core-fleet-black;