mirror of
https://github.com/aljazceru/pear-docs.git
synced 2025-12-17 14:34:19 +01:00
280 lines
7.5 KiB
HTML
280 lines
7.5 KiB
HTML
<!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: 2em;
|
||
padding-top: 2em;
|
||
margin-right: 30rem;
|
||
}
|
||
|
||
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,
|
||
devtools-inspector {
|
||
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="devtools-inspector"] a[href='/devtools-insepctor'],
|
||
app-router[data-load="devtools-inspector"] a:active[href='/devtools-inspector'],
|
||
app-router[data-load="devtools-inspector"] a:visited[href='/devtools-inspector'] {
|
||
color: rgb(78, 250, 92);
|
||
}
|
||
</style>
|
||
<div id="bar"><pear-ctrl></pear-ctrl></div>
|
||
<app-router docs-viewer="/documentation" devtools-inspector="/devtools-inspector" 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="/" style="text-indent: -1rem">System Status</a>
|
||
<a href="/documentation">Documentation</a>
|
||
<a href="/devtools-inspector">Inspector</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>
|
||
<section id="inspector">
|
||
<div class="col"><devtools-inspector></devtools-inspector></div>
|
||
</section>
|
||
<script type='module' src='./lib/devtools-inspector.js'></script>
|
||
</app-router>
|
||
<script type='module' src='./lib/app-router.js'></script>
|
||
</body>
|