change how debug layout works

This commit is contained in:
hazycora 2023-12-21 06:47:27 -06:00
parent 15cf5a13c8
commit 6956faad46
No known key found for this signature in database
GPG key ID: 215AF1F81F86940E
2 changed files with 24 additions and 25 deletions

View file

@ -1,4 +1,4 @@
import html2png from '@besties/html2png'
import html2png, { renderHTML as inline } from '@besties/html2png'
import fs from 'node:fs'
const style = fs.readFileSync('./assets/style.css', 'utf8')
@ -9,5 +9,27 @@ export default async function (html, options = {}) {
export async function renderHtml(html) {
const styleNow = await fs.promises.readFile('./assets/style.css', 'utf8')
return `<style>${styleNow}</style>${html}`
return (
`<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
:root {
height: 100%;
font-family: 'DM Sans', Arial, Helvetica, sans-serif;
}
* {
font-family: inherit;
}
body {
margin: 0;
background-color: black;
display: grid;
place-items: center;
height: 100%;
}
</style>
<title>OpenGraph Debug Preview</title>
</head>` + (await inline(`<style>${styleNow}</style>${html}`))
)
}

View file

@ -1,26 +1,3 @@
<% if (it.debug) { %>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
:root {
height: 100%;
font-family: 'DM Sans', Arial, Helvetica, sans-serif;
}
* {
font-family: inherit;
}
body {
margin: 0;
background-color: black;
display: grid;
place-items: center;
height: 100%;
}
</style>
<title>OpenGraph Debug Preview</title>
</head>
<% } %>
<div class="wrapper <% if (it.languages) { %>has-languages<% } %> <% if (it.debug) { %>is-debug<% } %>">
<%~ it.body %>
<% if (it.languages) { %>