bes-r/teach
1
0
Fork 0
Code Issues Pull requests 5 Projects Releases Packages Wiki Activity Actions

fix: voorkom witte onderstrook op mobiel
All checks were successful
dev - build & deploy naar test / build-and-deploy (push) Successful in 53s
Details

Browse source
This commit is contained in:
Ramon 2026-07-23 17:34:47 +02:00
parent c33eb71640
commit ff6dbc5c2e
4 changed files with 24 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
VERSION
View file

@ -1 +1 @@
0.4.52-beta
0.4.53-beta

16
public/css/teach.css
View file

@ -43,8 +43,13 @@
*::-webkit-scrollbar-thumb{background:#c3cfde; border-radius:4px;}
body.dark ::-webkit-scrollbar-thumb{background:#3a4a70;}
*::-webkit-scrollbar-track{background:transparent;}
html,body{height:100%; margin:0; overflow:hidden;}
/* 100% is de terugval voor oudere browsers; dvh volgt op telefoons de
daadwerkelijk zichtbare hoogte wanneer de browserbalk in- of uitschuift.
Doordat body een containing block is, gebruiken ook de absoluut
gepositioneerde bord-, leerling- en ouderweergaven deze zichtbare hoogte. */
html,body{height:100%; height:100dvh; margin:0; overflow:hidden;}
body{
position:relative;
font-family:"Quicksand","Segoe UI Rounded","Arial Rounded MT Bold",ui-rounded,"Segoe UI",Verdana,sans-serif;
background:var(--bg); color:var(--ink); user-select:none;
}
@ -2043,7 +2048,14 @@ body.dark .world-fact{background:#1d3b2a;color:#a9e5b7}body.dark .world-fact .wo
in de leerlingweergave en ook wanneer een widget zelf smal is.
============================================================ */
@media(max-width:600px){
#pupilView{padding:8px;gap:12px}
/* De langere selector is nodig om de desktopregel
body.pupil-mode #pupilView werkelijk te overschrijven. De veilige
ondermarge houdt de laatste opdracht vrij van de mobiele browserbalk. */
body.pupil-mode #pupilView{
padding:8px 8px max(8px,env(safe-area-inset-bottom));
gap:12px;
overscroll-behavior:contain;
}
#pupilView .pupil-card{width:100%!important;max-width:100%;min-width:0!important}
.widget:not(.bare){max-width:calc(100% - 8px)}
.widget-head{gap:4px;padding:6px 8px}

2
public/js/core.js
View file

@ -2,7 +2,7 @@
"use strict";
/* version — shown until /api/version resolves (or if the fetch fails, e.g. offline).
Kept in sync by hand with the VERSION file at the repo root on every release. */
const VERSION = "0.4.52-beta";
const VERSION = "0.4.53-beta";
(function(){
const tag = document.getElementById("verTag");
tag.textContent = "v"+VERSION;

8
test/frontend.test.js
View file

@ -107,3 +107,11 @@ test('index.html: elk script heeft defer + cache-busting, font-preload blijft on
assert.ok(server.indexOf('fastifyCompress') < server.indexOf('registerFrontend(app'),
'compress hoort vóór de frontend-registratie');
});
test('mobiele leerlingweergave volgt de zichtbare viewport zonder witte onderstrook', async () => {
const css = await readFile(join(publicRoot, 'css', 'teach.css'), 'utf8');
assert.match(css, /html,body\{height:100%; height:100dvh;/);
assert.match(css, /body\{\s*position:relative;/);
const phone = css.slice(css.indexOf('Widgetinhoud op telefoonformaat'));
assert.match(phone, /body\.pupil-mode #pupilView\{[^}]*safe-area-inset-bottom[^}]*overscroll-behavior:contain;/);
});