Skip to content

Instantly share code, notes, and snippets.

@zeropaper

zeropaper/e2e.documentation-template.js

Created October 29, 2019 10:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save zeropaper/8a5fa907f5074fdc7c559e621f82d2ee to your computer and use it in GitHub Desktop.
Save zeropaper/8a5fa907f5074fdc7c559e621f82d2ee to your computer and use it in GitHub Desktop.
Download ZIP
Raw
e2e.documentation-template.js
const renderScreenshot = ({
title = '',
slug = '',
pageIndex = 0,
screenshotPath = '',
description = '',
}) => `<figure id="${slug}-${pageIndex}">
<img src="${screenshotPath}" title="${title}" />
<figcaption>${description}</figcaption>
</figure>`;
const renderSection = ({
title = '',
slug = '',
screenshots = [],
}) => `<section id="${slug}">
<header>
<h1>${title}</h1>
</header>
<div class="content">
<div class="screenshots">
${screenshots.map(renderScreenshot).join('\n')}
</div>
<div class="description">
</div>
</div>
</div>
</section>`;
module.exports = async ({
title = 'Documentation',
info = {},
} = {}) => `<html>
<head>
<title>${title}</title>
<style>
section .content {
display: flex;
}
section .screenshots,
section .description {
flex-grow: 1;
width: 50%;
}
section figure,
section img {
max-width: 100%;
}
</style>
</head>
<body>
<header>
<h1>${title}</h1>
</header>
${info.map(renderSection).join('\n')}
</body>
</html>`;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment