From ce8865ec152cefd2b2ef55af4a4578920958e247 Mon Sep 17 00:00:00 2001 From: Elias Fleckenstein Date: Mon, 28 Jun 2021 11:11:46 +0200 Subject: [PATCH] Scale splash texts based on text length --- engine/mainmenu.js | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/engine/mainmenu.js b/engine/mainmenu.js index 5498ae3..0451588 100644 --- a/engine/mainmenu.js +++ b/engine/mainmenu.js @@ -33,7 +33,9 @@ logo.src = "textures/logo-mainmenu.png"; let splash = mainmenu.appendChild(document.createElement("div")); - splash.style.position = "absolute"; + splash.style.position = "fixed"; + splash.style.overflow = "hidden"; + splash.style.whiteSpace = "nowrap"; splash.style.transform = "rotate(-15deg)"; splash.style.color = "yellow"; splash.style.fontSize = "30px"; @@ -434,11 +436,13 @@ mainmenu.style.visibility = "visible"; splash.innerHTML = splashes[Math.floor(Math.random() * splashes.length)]; + let fontSize = Math.min(parseInt(10000 / splash.clientWidth), 30); + splash.style.fontSize = fontSize + "px"; updateSplash(); let counter = 0; setInterval(_ => { - splash.style.fontSize = Math.sin(counter++ / 100 * Math.PI) * 5 + 30 + "px"; + splash.style.fontSize = Math.sin(counter++ / 100 * Math.PI) * fontSize / 6 + fontSize + "px"; updateSplash(); }); -- 2.44.0