doc: css: fix mobile layout and increase browser compatibility

kartben · carlescufi · commit cbaabc25598a · 2024-09-12T14:49:06.000+02:00
added a missing dvh causing footer to be footer to be displayed outside
of the viewport on mobile when browsing "Desktop site" version, and also
added fallback "vh" rules for slightly better browser compatibility.

Signed-off-by: Benjamin Cabé &lt;benjamin@zephyrproject.org&gt;
diff --git a/doc/_static/css/custom.css b/doc/_static/css/custom.css
@@ -172,6 +172,7 @@ a.icon-home:visited {
 .wy-nav-content {
     background-color: var(--content-background-color);
     min-height: 100vh;
+    min-height: 100dvh;
     display: flex;
 }
 
@@ -760,6 +761,7 @@ kbd, .kbd,
         max-height: initial;
     }
     .wy-nav-content {
+        min-height: calc(100vh - 64px);
         min-height: calc(100dvh - 64px);
     }
 }

Original file line number	Diff line number	Diff line change
`@@ -172,6 +172,7 @@ a.icon-home:visited {`
`172`	`172`	`.wy-nav-content {`
`173`	`173`	`background-color: var(--content-background-color);`
`174`	`174`	`min-height: 100vh;`
	`175`	`+ min-height: 100dvh;`
`175`	`176`	`display: flex;`
`176`	`177`	`}`
`177`	`178`
`@@ -760,6 +761,7 @@ kbd, .kbd,`
`760`	`761`	`max-height: initial;`
`761`	`762`	`}`
`762`	`763`	`.wy-nav-content {`
	`764`	`+ min-height: calc(100vh - 64px);`
`763`	`765`	`min-height: calc(100dvh - 64px);`
`764`	`766`	`}`
`765`	`767`	`}`