Files
pear-docs/pulse.html
2024-01-12 18:33:31 +01:00

193 lines
6.1 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<body onload="location.hash = location.hash || '#status'">
<script> addEventListener('hashchange', () => { document.documentElement.scrollTop = 0 }) </script>
<style>
@font-face {
font-family: 'overpass-mono';
src: url('~overpass/webfonts/overpass-mono-webfont/overpass-mono-regular.woff2') format('woff2');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'overpass-mono';
src: url('~overpass/webfonts/overpass-mono-webfont/overpass-mono-bold.woff2') format('woff2');
font-weight: 600;
font-style: normal;
}
body {
background: #151517;
box-sizing: border-box;
border-radius: 8px;
font-family:'overpass-mono';
-webkit-font-smoothing: antialiased;
color: #efeaea;
transition: background-color .4s, color .4s;
}
html, body { overflow: scroll; }
html.light body {
background: #efeaea;
color: #151517;
}
a:visited, a:active, a { color: #B0D944; outline: none; text-decoration: none; }
#logo {
float: left;
margin-right: 2rem;
margin-left: 0.65rem;
margin-top: -0.45rem;
}
nav {
height: 146px;
float: left;
padding-left: 2em;
padding-top: 2em;
margin-right: 30rem;
}
nav > a {
display: block;
}
section {
display: none;
}
section:target {
display: block;
padding-top: 156px;
}
pre {
background: none;
color: #B0D944;
font-family: overpass-mono;
border: none;
height: 146px;
user-select: none;
}
header {
top: 0;
left:0;
height: 170px;
z-index:10;
background: rgba(21, 21, 23, 0.9);
width: 100%;
transition: background-color .4s, color .4s;
position: fixed;
}
#headin {
transform: scale(0.92);
width: 72rem;
margin: 0 auto;
user-select: none;
}
h1 { padding: .5rem; border-right: 1px solid #B0D944; border-bottom: 1px solid #B0D944; display: inline-block; padding-right: 0.75em; padding-left: 0.5em; font-weight: bold; font-size: 1.6rem; margin-block-start: 0.67em; margin-block-end: 0.67em; }
blockquote { outline: 1px solid #323532; margin-inline-start: 0; margin-inline-end: 0; display: block; margin-block-start: 1rem; margin-block-end: 0; padding: 1px; font-size: .825rem }
blockquote::before { content: ""; float: left; font-size: 1.625rem; margin-left: 1rem; margin-right: 0.625rem; }
.col { max-width: 63rem; margin: 0 auto; }
#mode {
position: absolute;
font-size: 2rem;
right: 0.4rem;
bottom: 0rem;
cursor: pointer;
opacity: .65;
color: #B0D944;
user-select: none;
}
#mode::after { content: "☀"; }
html.light #mode::after { content: "☾"; }
#back {
position: absolute;
right: 0.4rem;
top: -1.9rem;
cursor: pointer;
opacity: .65;
color: #B0D944;
font-weight: bold;
font-size: 2.4rem;
user-select: none;
}
#home {
transform: scale(2.2, 2);
position: absolute;
right: .75rem;
bottom: -3.5rem;
cursor: pointer;
display: none;
}
html.light #home {
color: #7c9735;
font-weight: bold;
}
header:has(~ #documentation:target) > #headin > #home {
display: inline;
}
</style>
<header>
<div id="headin">
<svg id="logo" width="102" height="146" viewBox="0 0 102 146" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_8912_10861)">
<path d="M47.4056 0.838379H54.5943V15.0361H47.4056V0.838379Z" fill="#B0D944"/>
<path d="M43.8113 19.5305V22.406H36.6226V26.0004H65.3774V22.406H58.1887V16.8347H51V19.5305H43.8113Z" fill="#B0D944"/>
<path d="M72.5662 27.7974H51V30.4931H29.4339V36.963H72.5662V27.7974Z" fill="#B0D944"/>
<path d="M79.7548 38.7593H51V41.455H22.2451V47.9249H79.7548V38.7593Z" fill="#B0D944"/>
<path d="M79.7548 49.7219H51V52.4177H22.2451V58.8875H79.7548V49.7219Z" fill="#B0D944"/>
<path d="M86.9436 60.6846H51V63.3803H15.0565V69.8502H86.9436V60.6846Z" fill="#B0D944"/>
<path d="M86.9436 71.6481H51V74.3438H15.0565V80.8137H86.9436V71.6481Z" fill="#B0D944"/>
<path d="M94.1323 82.61H51V85.3058H7.86774V91.7756H94.1323V82.61Z" fill="#B0D944"/>
<path d="M101.321 93.5726H51V96.2684H0.679016V102.738H101.321V93.5726Z" fill="#B0D944"/>
<path d="M101.321 104.536H51V107.232H0.679016V113.702H101.321V104.536Z" fill="#B0D944"/>
<path d="M101.321 115.499H51V118.195H0.679016V124.664H101.321V115.499Z" fill="#B0D944"/>
<path d="M86.9436 126.461H51V129.156H15.0565V135.626H86.9436V126.461Z" fill="#B0D944"/>
<path d="M72.5662 137.424H51V140.12H29.4339V144.613H72.5662V137.424Z" fill="#B0D944"/>
</g>
<defs>
<clipPath id="clip0_8912_10861">
<rect width="100.642" height="145.571" fill="white" transform="translate(0.679016 0.214233)"/>
</clipPath>
</defs>
</svg>
<span id="mode" onclick="document.documentElement.classList[document.documentElement.classList.contains('light') ? 'remove' : 'add']('light');"></span>
<span id="home"><a onclick="document.querySelector('docs-viewer').load('/readme.md')"></a></span>
<span id="back" onclick="history.back()">˿</span>
<nav>
<a href="#status" style="text-indent: -1rem">System Status</a>
<a href="#documentation">Documentation</a>
</nav>
<pre>
__ \ _ \ _` | __|
| | __/ ( | |
.__/ \___| \__,_| _|
_|
</pre>
</div>
</header>
<section id="status">
<div class="col">
<system-status></system-status>
</div>
</section>
<script type='module' src='./lib/system-status.js'></script>
<section id="documentation">
<div class="col">
<docs-viewer></docs-viewer>
</div>
</section>
<script type='module' src='./lib/docs-viewer.js'></script>
</body>