ministicraft/finistdev-configuration-as-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: move blue strip outside Reveal.js container

Browse Source 
Pseudo-elements on sections don't render reliably due to Reveal.js
transforms creating stacking contexts. Use a fixed div outside the
.reveal container instead (same pattern as the OVHcloud logo).

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
ministicraft
2026-04-14 01:10:11 +02:00
parent 27f40806b5
commit 1d750a4c9f
1 changed files with 6 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
index.html
View File

@@ -29,16 +29,16 @@
--strip-color: var(--ods-blue-500); --strip-color: var(--ods-blue-500);
} }
/* Blue accent strip — pseudo-element doesn't interfere with Reveal.js layout */ /* Blue accent strip — fixed outside Reveal.js, always visible */
.reveal .slides section::before { .top-strip {
content: ''; position: fixed;
position: absolute;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
height: 6px; height: 6px;
background: var(--strip-color); background: var(--strip-color);
z-index: 10; z-index: 50;
pointer-events: none;
} }
.reveal .slides section { .reveal .slides section {
@@ -96,6 +96,7 @@
</style> </style>
</head> </head>
<body> <body>
<div class="top-strip"></div>
<img src="vendor/ovhcloud-logo.svg" alt="OVHcloud" class="ovh-logo-global"> <img src="vendor/ovhcloud-logo.svg" alt="OVHcloud" class="ovh-logo-global">
<div class="reveal"> <div class="reveal">
<div class="slides"> <div class="slides">