fix: follow Reveal.js best practices for slide layout
- Remove position:relative from sections (was overriding Reveal.js's position:absolute, breaking slide stacking) - Replace border-top with box-shadow (doesn't affect box model/layout) - Add padding-top:24px for content clearance below the strip - Switch center:false → center:true for proper vertical centering - Use px for global logo positioning (immune to Reveal.js scaling) Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
18
index.html
18
index.html
@@ -29,16 +29,14 @@
|
||||
--strip-color: var(--ods-blue-500);
|
||||
}
|
||||
|
||||
/* Blue accent strip via box-shadow so it doesn't affect layout */
|
||||
.reveal .slides section {
|
||||
text-align: left;
|
||||
border-top: 6px solid var(--strip-color);
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.reveal h1, .reveal h2 {
|
||||
text-align: left;
|
||||
box-shadow: inset 0 6px 0 0 var(--strip-color);
|
||||
padding-top: 24px;
|
||||
}
|
||||
|
||||
.reveal h1, .reveal h2 { text-align: left; }
|
||||
.reveal h1 { font-size: 1.8em; }
|
||||
.reveal h2 { font-size: 1.4em; line-height: 1.2; }
|
||||
.reveal p, .reveal li { font-size: 0.85em; }
|
||||
@@ -62,6 +60,7 @@
|
||||
margin-bottom: 0.2em;
|
||||
}
|
||||
|
||||
/* Tool logos — positioned within Reveal's slide coordinate system */
|
||||
.slide-logo {
|
||||
position: absolute;
|
||||
bottom: 12px;
|
||||
@@ -80,10 +79,11 @@
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* Persistent logo — outside Reveal container, fixed to viewport */
|
||||
.ovh-logo-global {
|
||||
position: fixed;
|
||||
bottom: 1em;
|
||||
left: 1em;
|
||||
bottom: 16px;
|
||||
left: 16px;
|
||||
height: 28px;
|
||||
width: auto;
|
||||
opacity: 0.7;
|
||||
@@ -443,7 +443,7 @@ class webserver {
|
||||
backgroundTransition: 'fade',
|
||||
controls: true,
|
||||
progress: true,
|
||||
center: false,
|
||||
center: true,
|
||||
plugins: [ RevealNotes, RevealHighlight ]
|
||||
});
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user