Files
pear-docs/index.html

279 lines
7.4 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>
<style>
@font-face {
font-family: 'overpass-mono';
src: url('~redhat-overpass-font/webfonts/overpass-mono-webfont/overpass-mono-regular.woff2') format('woff2');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'overpass-mono';
src: url('~redhat-overpass-font/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;
}
::-webkit-scrollbar {
width: 7px;
height: 7px;
}
::-webkit-scrollbar-track {
background: #151517;
}
::-webkit-scrollbar-thumb {
background: #727272;
}
html.light body {
background: #efeaea;
color: #151517;
}
#logo {
float: left;
margin-right: 2rem;
margin-left: 0.65rem;
margin-top: -0.1rem;
}
nav {
height: 146px;
float: left;
padding-left: .75rem;
padding-top: 2em;
}
nav>a {
display: block;
}
section {
display: block;
}
pre {
background: none;
color: #B0D944;
font-family: overpass-mono;
border: none;
height: 146px;
user-select: none;
position: relative;
right: 5em;
top: 0.33em;
float: right;
}
header {
top: 0;
left: 0;
height: 170px;
z-index: 10;
background: rgba(21, 21, 23, 0.9);
padding-top: 20px;
width: 100%;
transition: background-color .4s, color .4s;
position: fixed;
}
#headin {
transform: scale(0.92);
width: 72rem;
margin: 0 auto;
margin-top: .75rem;
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;
margin-top: 1rem;
}
#back,
#mode {
width: 32px;
height: 32px;
position: absolute;
right: 0.4rem;
cursor: pointer;
user-select: none;
opacity: .65;
}
#back {
top: 10px;
}
#mode {
top: 60px;
}
#bar {
backdrop-filter: blur(64px);
-webkit-app-region: drag;
padding: 0;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
color: #B0D944;
white-space: nowrap;
box-sizing: border-box;
position: fixed;
z-index: 100;
width: 100%;
left: 0;
top: 0;
}
#bar:hover {
outline: #B0D944;
}
pear-ctrl {
margin-top: 9px;
margin-left: 9px;
}
pear-ctrl[data-platform="dawrin"] {
float: left;
margin-top: 4px;
}
system-status,
docs-viewer,
developer-tooling {
position: relative;
top: 156px
}
a:visited,
a:active,
a {
color: #B0D944;
outline: none;
text-decoration: none;
}
app-router a:visited,
app-router a:active,
app-router a {
color: #B0D944;
}
app-router[data-load="system-status"] a[href='/'],
app-router[data-load="system-status"] a:active[href='/'],
app-router[data-load="system-status"] a:visited[href='/'],
app-router[data-load="docs-viewer"] a[href='/documentation'],
app-router[data-load="docs-viewer"] a:active[href='/documentation'],
app-router[data-load="docs-viewer"] a:visited[href='/documentation'],
app-router[data-load="developer-tooling"] a[href='/devtools'],
app-router[data-load="developer-tooling"] a:active[href='/devtools'],
app-router[data-load="developer-tooling"] a:visited[href='/devtools'] {
color: rgb(78, 250, 92);
}
</style>
<div id="bar"><pear-ctrl></pear-ctrl></div>
<app-router docs-viewer="/documentation" developer-tooling="/devtools" system-status="/" data-load="system-status">
<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>
<img id="mode" src="/assets/light.svg" onclick="document.documentElement.classList.toggle('light');">
<img id="back" src="/assets/arrow.svg" onclick="history.back()">
<nav>
<a href="/">System Status</a>
<a href="/documentation">Documentation</a>
<a href="/devtools">Developer Tooling</a>
</nav>
<pre>
__ \ _ \ _` | __|
| | __/ ( | |
.__/ \___| \__,_| _|
_|
</pre>
</div>
</header>
<section>
<div class="col"><system-status></system-status></div>
</section>
<script type='module' src='./lib/system-status.js'></script>
<section>
<div class="col"><docs-viewer></docs-viewer></div>
</section>
<script type='module' src='./lib/docs-viewer.js'></script>
<section>
<div class="col"><developer-tooling></devtools></div>
</section>
<script type='module' src='./lib/devtools.js'></script>
</app-router>
<script type='module' src='./lib/app-router.js'></script>
</body>