Voeg 28 herkenbare kleurplaten en creatieve niveaus toe (v0.4.66-beta) #4

Open
bes-r wants to merge 207 commits from bes-r/kleurplaten-v0-4-66 into main AGit
3 changed files with 28 additions and 11 deletions
Showing only changes of commit 43c7892eb7 - Show all commits

View file

@ -37,7 +37,7 @@
.logo .l4{color:var(--blue); transform:rotate(5deg) translateY(-1px);}
.logo .l5{color:var(--purple); transform:rotate(-4deg);}
.logo .crayon{font-size:24px; margin-left:6px; transform:rotate(10deg);}
#verTag{font-size:10.5px; font-weight:700; color:var(--muted); align-self:flex-end; margin-left:4px; transform:none;}
#verTag{font-size:10.5px; font-weight:700; color:var(--muted);}
#verTag.beta{color:#fff; background:var(--orange); padding:1px 7px; border-radius:8px;}
.logo:hover span:not(.crayon){animation:bounce .5s;}
.logo .l2{animation-delay:.05s;} .logo .l3{animation-delay:.1s;}
@ -431,6 +431,11 @@
#settingsModal .am-h3:first-of-type{margin-top:0;}
#settingsModal .am-reset .lrow{margin:0;}
#settingsModal .am-reset .guestnote{margin-top:2px;}
.st-footer{
display:flex; justify-content:space-between; align-items:center; gap:8px;
margin-top:16px; padding-top:12px; border-top:1.5px solid #e3eaf3;
font-size:11px; color:var(--muted);
}
#settingsModal .am-name{font-size:16px;}
/* =========================================================
Letter game widget
@ -812,7 +817,7 @@
body.hc .lg-ed-form input[type=text],body.hc .ed-pictorow input{border-color:#000; color:#000;}
body.hc .np-result{background:#0047ab;}
body.hc .np-row label,body.hc .thint,body.hc .guestnote,body.hc .ed-credit,
body.hc .bp-hint,body.hc .gcard .gd{color:#222;}
body.hc .bp-hint,body.hc .gcard .gd,body.hc .st-footer{color:#222;}
body.hc .gcard{border-color:#000; background:#fff;}
body.hc .gcat-title{color:#000;}
body.hc .tbtn.ghost{background:#fff; border:2px solid #000; color:#000;}
@ -1059,7 +1064,6 @@ body.hc .am-reset,body.hc .am-reset-row{border:1.5px solid #000; background:#fff
#toolbar{padding:0 8px; gap:6px;}
.logo{font-size:22px;}
.logo .crayon{font-size:18px; margin-left:4px;}
#verTag{font-size:9px; margin-left:2px;}
.tbtn{padding:8px 10px; font-size:13px;}
#boardsPanel{top:60px; max-height:min(66vh,480px);}

View file

@ -13,7 +13,6 @@
<div class="logo" title="teach">
<span class="l1">t</span><span class="l2">e</span><span class="l3">a</span><span class="l4">c</span><span class="l5">h</span>
<span class="crayon">🖍️</span>
<span id="verTag"></span>
</div>
<button class="tbtn ghost" id="btnMute">🔊</button>
<button class="tbtn ghost" id="btnHC">👁</button>
@ -23,8 +22,7 @@
<div class="spacer"></div>
<button class="tbtn ghost" id="btnFolders">📁</button>
<button class="tbtn ghost" id="btnSave">💾 <span data-i18n="saveBoard"></span></button>
<button class="tbtn ghost" id="btnUser">👤 <span id="userLbl"></span></button>
<button class="tbtn ghost" id="btnAdmin" style="display:none;">👥</button>
<button class="tbtn ghost" id="btnUser">⚙️ <span id="userLbl"></span></button>
<div id="langToggle">
<button data-lang="nl">NL</button>
<button data-lang="en">EN</button>
@ -124,6 +122,13 @@
</div>
</div>
<div class="am-h3" id="stAdminLbl" data-i18n="beheer" style="display:none;"></div>
<div class="am-reset" id="adminBlock" style="display:none;">
<div class="lrow">
<button class="tbtn ghost" id="btnAdmin">👥 <span data-i18n="openAdmin"></span></button>
</div>
</div>
<div class="am-h3" data-i18n="stSession"></div>
<div class="am-reset">
<div class="lrow">
@ -131,6 +136,11 @@
</div>
<div class="guestnote" data-i18n="storedNote"></div>
</div>
<div class="st-footer">
<span id="verTag"></span>
<span id="copyright"></span>
</div>
</div>
</div>
<div class="modalwrap" id="adminWrap">

View file

@ -20,6 +20,7 @@ const VERSION = "0.2.10";
})
.catch(()=>{});
})();
document.getElementById("copyright").textContent = "© "+new Date().getFullYear()+" Ramon Besselink";
/* =========================================================
i18n
==========================================================*/
@ -112,7 +113,7 @@ const I18N = {
tmHint:"Sleep aan de rode schijf om de tijd in te stellen.",
login:"Inloggen", loginBtn:"Inloggen", registerBtn:"Account maken", logout:"Uitloggen",
settingsTitle:"Instellingen", tabLogin:"Inloggen", tabLinkCode:"Koppelcode", busy:"Bezig…",
stAccount:"Account", stPassword:"Wachtwoord", stSession:"Sessie",
stAccount:"Account", stPassword:"Wachtwoord", stSession:"Sessie", openAdmin:"Beheerpaneel",
pwChanged:"Wachtwoord gewijzigd ✓",
namePh:"naam", passPh:"wachtwoord",
guestNote:"Zonder inloggen wordt niets bewaard. Log in met je schoolaccount om alles op de server te bewaren.",
@ -238,7 +239,7 @@ const I18N = {
tmHint:"Drag the red disc to set the time.",
login:"Log in", loginBtn:"Log in", registerBtn:"Create account", logout:"Log out",
settingsTitle:"Settings", tabLogin:"Log in", tabLinkCode:"Link code", busy:"Please wait…",
stAccount:"Account", stPassword:"Password", stSession:"Session",
stAccount:"Account", stPassword:"Password", stSession:"Session", openAdmin:"Admin panel",
pwChanged:"Password changed ✓",
namePh:"name", passPh:"password",
guestNote:"Without logging in nothing is saved. Log in with your school account to keep everything on the server.",
@ -375,9 +376,9 @@ const roleKey = r => r==="super" ? "roleSuper" : r==="admin" ? "roleAdmin" : r==
function updateUserUI(){
document.getElementById("userLbl").textContent = currentUser ? currentUser.displayName : T("login");
document.getElementById("btnUser").classList.toggle("on", !!currentUser);
const adminBtn = document.getElementById("btnAdmin");
adminBtn.style.display = can("admin.access") ? "" : "none";
adminBtn.title = T("beheer");
const showAdmin = can("admin.access");
document.getElementById("stAdminLbl").style.display = showAdmin ? "" : "none";
document.getElementById("adminBlock").style.display = showAdmin ? "flex" : "none";
if(currentUser){
document.getElementById("helloName").textContent = currentUser.displayName;
document.getElementById("helloRole").textContent = T(roleKey(currentUser.role));
@ -413,6 +414,8 @@ document.getElementById("btnUser").addEventListener("click", ()=>{
loginWrap.classList.add("open");
});
document.getElementById("btnSettingsClose").addEventListener("click", ()=>settingsWrap.classList.remove("open"));
/* Beheer wordt vanuit Instellingen geopend: dat scherm zelf dicht zodat er geen twee modals over elkaar staan */
document.getElementById("btnAdmin").addEventListener("click", ()=>settingsWrap.classList.remove("open"));
loginWrap.addEventListener("click", e=>{ if(e.target===loginWrap) loginWrap.classList.remove("open"); });
settingsWrap.addEventListener("click", e=>{ if(e.target===settingsWrap) settingsWrap.classList.remove("open"); });