Make text actually fit viewport

This commit is contained in:
Simon Bruder 2020-04-29 16:26:14 +02:00
parent 3b5d1a932c
commit d8e67ab7f2
No known key found for this signature in database
GPG key ID: 6F03E0000CC5B62F
2 changed files with 5 additions and 6 deletions

View file

@ -23,21 +23,20 @@
<div id="name">Kein Name</div> <div id="name">Kein Name</div>
</div> </div>
<script> <script>
function setSize() { function setName(name) {
el = document.getElementById('name') el = document.getElementById('name')
elSize = { el.innerText = name
const elSize = {
width: el.offsetWidth, width: el.offsetWidth,
height: el.offsetHeight height: el.offsetHeight
} }
browserSize = { const browserSize = {
width: 180, width: 180,
height: 60 height: 60
} }
factor = Math.min(browserSize.height / elSize.height, browserSize.width / elSize.width) factor = Math.min(browserSize.height / elSize.height, browserSize.width / elSize.width)
el.style.transform = `scale(${factor})` el.style.transform = `scale(${factor})`
} }
document.addEventListener('DOMContentLoaded', () => setSize())
window.addEventListener('resize', () => setSize())
</script> </script>
</body> </body>
</html> </html>

View file

@ -17,7 +17,7 @@ async def gen_pdf(name):
browser = await launch(args=["--no-sandbox"]) browser = await launch(args=["--no-sandbox"])
page = await browser.newPage() page = await browser.newPage()
await page.goto("file://" + os.path.join(os.getcwd(), "namensschild.html")) await page.goto("file://" + os.path.join(os.getcwd(), "namensschild.html"))
await page.evaluate(f"document.querySelector('#name').innerText = '{name}'") await page.evaluate(f"setName('{name}')")
await page.pdf(path=f"static/{name}.pdf", width="180px", height="60px") await page.pdf(path=f"static/{name}.pdf", width="180px", height="60px")
await browser.close() await browser.close()