Make text actually fit viewport

master
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>
<script>
function setSize() {
function setName(name) {
el = document.getElementById('name')
elSize = {
el.innerText = name
const elSize = {
width: el.offsetWidth,
height: el.offsetHeight
}
browserSize = {
const browserSize = {
width: 180,
height: 60
}
factor = Math.min(browserSize.height / elSize.height, browserSize.width / elSize.width)
el.style.transform = `scale(${factor})`
}
document.addEventListener('DOMContentLoaded', () => setSize())
window.addEventListener('resize', () => setSize())
</script>
</body>
</html>

View File

@ -17,7 +17,7 @@ async def gen_pdf(name):
browser = await launch(args=["--no-sandbox"])
page = await browser.newPage()
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 browser.close()