flagpole
Version:
Simple and fast DOM integration, headless or headful browser, and REST API testing framework.
66 lines • 2.94 kB
HTML
<html>
<head>
<title>Flagpole Test Results</title>
<style>
body { font: 14px 'Helvetica'; margin: 0; padding: 0; }
header { padding: 8px; background: rgb(100, 150, 200); }
header img.logo { width: 100%; max-width: 200px; }
nav { background: rgb(50, 80, 150); color: rgb(200, 200, 200); padding: 4px; }
nav a { color: rgb(255, 255, 255); text-decoration: none; padding-left: 8px; padding-right: 16px; display: inline-block; }
main { width: 100%; max-width: 620px; margin-left: auto; margin-right: auto; padding: 8px; }
aside { margin-top: 8px; margin-bottom: 16px; }
article aside, article section { margin-left: 16px; }
h2, h3 { margin-bottom: 8; }
ul { padding: 0; margin: 0; list-style: none }
aside li { color: rgb(100, 100, 100); }
section li { border-left: solid 16px rgb(200, 200, 200); padding-left: 8px; }
li.Fail { color: rgb(120, 0, 0); border-left-color: rgb(120, 0, 0); }
li.Pass { color: rgb(0, 120, 0); border-left-color: rgb(0, 120, 0); }
li.Comment { color: rgb(100, 100, 100);; border-left-color: rgb(100, 100, 100); font-style: italic; }
form { margin: 0; display: inline-block; padding-right: 16px; }
form:only-child { padding-right: 0; padding-left: 0; }
form input[readonly] { background: rgb(230, 230, 230); color: rgb(80, 80, 80); }
fieldset {
margin-top: 12px;
margin-bottom: 12px;
}
table { border: solid 1px rgb(0, 0, 0); width: 100%; max-width: 600px; }
table thead { background: rgb(120, 180, 220); }
table td { vertical-align: middle; padding-right: 8px; }
table tbody tr:nth-child(even) { background: rgb(230, 230, 230); }
table td, table th {
text-align: center;
}
table td:nth-child(1), table th:nth-child(1) {
text-align: left;
}
div.field {
padding-top: 8px;
padding-bottom: 8px;
vertical-align: middle;
}
div.field label {
display: inline-block;
padding-right: 16px;
min-width: 120px;
}
div.field select, div.field input[type="text"] {
min-width: 200px;
}
</style>
</head>
<body>
<header>
<a href="/">
<img src="https://flocasts.github.io/flagpole/images/logo@2x.png" class="logo" alt="Flagpole" />
</a>
</header>
<nav>
${nav}
<a href="https://flocasts.github.io/flagpole" target="_new">Documentation</a>
</nav>
<main>
${output}
</main>
</body>
</html>