add viewport to boilerplate, add fix for firefox flash on load
authorJustin Wind <justin.wind+git@gmail.com>
Sat, 26 Feb 2022 19:47:13 +0000 (11:47 -0800)
committerJustin Wind <justin.wind+git@gmail.com>
Sat, 26 Feb 2022 19:47:13 +0000 (11:47 -0800)
lib/template-helper.js

index af9547e22eed36293bdf6eadaa138658389c8dbc..c61958db9a31a67ae34b84dea72edfa6a4e125f0 100644 (file)
@@ -70,6 +70,7 @@ function htmlHead(pagePathLevel, ctx, options) {
   } = options;
   return `\t<head>
 \t\t<meta charset="utf-8">
+\t\t<meta name="viewport" content="width=device-width,initial-scale=1">
 \t\t<link rel="stylesheet" href="${rootPathPfx}static/theme.css">
 \t\t<link rel="stylesheet" href="${rootPathPfx}static/custom.css">
 ${headElements.map((e) => '\t\t' + e).join('\n')}
@@ -91,8 +92,9 @@ function htmlBody(pagePathLevel, ctx, options, main = []) {
   const {
     bodyAttributes = {},
   } = options;
+  const firefoxFix = '\n<script>0</script>'; // This fixes a layout rendering flash on load in Firefox; do not know why this works, but it does.
   return `
-\t<body${elementAttributes(bodyAttributes)}>
+\t<body${elementAttributes(bodyAttributes)}>${firefoxFix}
 ${htmlHeader(pagePathLevel, ctx, options)}
 ${htmlMessages(ctx, options)}
 \t\t<main>