mirror of
https://github.com/aljazceru/pear-docs.git
synced 2025-12-17 14:34:19 +01:00
pulse
This commit is contained in:
dmc
131
.gitignore
vendored
Normal file
131
.gitignore
vendored
Normal file
@@ -0,0 +1,131 @@
|
|||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
lerna-debug.log*
|
||||||
|
.pnpm-debug.log*
|
||||||
|
|
||||||
|
# Diagnostic reports (https://nodejs.org/api/report.html)
|
||||||
|
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
||||||
|
|
||||||
|
# Runtime data
|
||||||
|
pids
|
||||||
|
*.pid
|
||||||
|
*.seed
|
||||||
|
*.pid.lock
|
||||||
|
|
||||||
|
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||||
|
lib-cov
|
||||||
|
|
||||||
|
# Coverage directory used by tools like istanbul
|
||||||
|
coverage
|
||||||
|
*.lcov
|
||||||
|
|
||||||
|
# nyc test coverage
|
||||||
|
.nyc_output
|
||||||
|
|
||||||
|
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
||||||
|
.grunt
|
||||||
|
|
||||||
|
# Bower dependency directory (https://bower.io/)
|
||||||
|
bower_components
|
||||||
|
|
||||||
|
# node-waf configuration
|
||||||
|
.lock-wscript
|
||||||
|
|
||||||
|
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
||||||
|
build/Release
|
||||||
|
|
||||||
|
# Dependency directories
|
||||||
|
node_modules/
|
||||||
|
jspm_packages/
|
||||||
|
|
||||||
|
# Snowpack dependency directory (https://snowpack.dev/)
|
||||||
|
web_modules/
|
||||||
|
|
||||||
|
# TypeScript cache
|
||||||
|
*.tsbuildinfo
|
||||||
|
|
||||||
|
# Optional npm cache directory
|
||||||
|
.npm
|
||||||
|
|
||||||
|
# Optional eslint cache
|
||||||
|
.eslintcache
|
||||||
|
|
||||||
|
# Optional stylelint cache
|
||||||
|
.stylelintcache
|
||||||
|
|
||||||
|
# Microbundle cache
|
||||||
|
.rpt2_cache/
|
||||||
|
.rts2_cache_cjs/
|
||||||
|
.rts2_cache_es/
|
||||||
|
.rts2_cache_umd/
|
||||||
|
|
||||||
|
# Optional REPL history
|
||||||
|
.node_repl_history
|
||||||
|
|
||||||
|
# Output of 'npm pack'
|
||||||
|
*.tgz
|
||||||
|
|
||||||
|
# Yarn Integrity file
|
||||||
|
.yarn-integrity
|
||||||
|
|
||||||
|
# dotenv environment variable files
|
||||||
|
.env
|
||||||
|
.env.development.local
|
||||||
|
.env.test.local
|
||||||
|
.env.production.local
|
||||||
|
.env.local
|
||||||
|
|
||||||
|
# parcel-bundler cache (https://parceljs.org/)
|
||||||
|
.cache
|
||||||
|
.parcel-cache
|
||||||
|
|
||||||
|
# Next.js build output
|
||||||
|
.next
|
||||||
|
out
|
||||||
|
|
||||||
|
# Nuxt.js build / generate output
|
||||||
|
.nuxt
|
||||||
|
dist
|
||||||
|
|
||||||
|
# Gatsby files
|
||||||
|
.cache/
|
||||||
|
# Comment in the public line in if your project uses Gatsby and not Next.js
|
||||||
|
# https://nextjs.org/blog/next-9-1#public-directory-support
|
||||||
|
# public
|
||||||
|
|
||||||
|
# vuepress build output
|
||||||
|
.vuepress/dist
|
||||||
|
|
||||||
|
# vuepress v2.x temp and cache directory
|
||||||
|
.temp
|
||||||
|
.cache
|
||||||
|
|
||||||
|
# Docusaurus cache and generated files
|
||||||
|
.docusaurus
|
||||||
|
|
||||||
|
# Serverless directories
|
||||||
|
.serverless/
|
||||||
|
|
||||||
|
# FuseBox cache
|
||||||
|
.fusebox/
|
||||||
|
|
||||||
|
# DynamoDB Local files
|
||||||
|
.dynamodb/
|
||||||
|
|
||||||
|
# TernJS port file
|
||||||
|
.tern-port
|
||||||
|
|
||||||
|
# Stores VSCode versions used for testing VSCode extensions
|
||||||
|
.vscode-test
|
||||||
|
|
||||||
|
# yarn v2
|
||||||
|
.yarn/cache
|
||||||
|
.yarn/unplugged
|
||||||
|
.yarn/build-state.yml
|
||||||
|
.yarn/install-state.gz
|
||||||
|
.pnp.*
|
||||||
|
package-lock.json
|
||||||
83
lib/docs-viewer.js
Normal file
83
lib/docs-viewer.js
Normal file
@@ -0,0 +1,83 @@
|
|||||||
|
/* eslint-env browser */
|
||||||
|
import { marked } from 'marked'
|
||||||
|
|
||||||
|
customElements.define('docs-viewer', class extends HTMLElement {
|
||||||
|
static get observedAttributes () { return ['data-load'] }
|
||||||
|
attributeChangedCallback (name, _, page) { if (name === 'data-load') this.load(page).catch((err) => this.#error(err)) }
|
||||||
|
constructor () {
|
||||||
|
super()
|
||||||
|
|
||||||
|
this.template = document.createElement('template')
|
||||||
|
this.template.innerHTML = `
|
||||||
|
<div>
|
||||||
|
<style>
|
||||||
|
ul { list-style-type: none; }
|
||||||
|
ul li::before { content: '❥ '; margin-right: 0.5em; }
|
||||||
|
a:visited, a:active, a { color: #B0D944; outline: none; text-decoration: 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; }
|
||||||
|
code { background: #333; color: #eee; padding: .25rem; }
|
||||||
|
pre > code { display: block; line-height: 1.025rem; padding-left: 1em; }
|
||||||
|
h1, h2, h3, h4, h5, h6 { font-weight: bold; }
|
||||||
|
h1 { font-size: 1.6rem; }
|
||||||
|
h2 { font-size: 1.4rem; }
|
||||||
|
h3 { font-size: 1.2rem; }
|
||||||
|
h4 { font-size: 1rem; }
|
||||||
|
h5 { font-size: .8rem; }
|
||||||
|
h6 { font-size: .7rem; }
|
||||||
|
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; }
|
||||||
|
img { display: block; max-width: 63em; margin: 0 auto; margin-block-start: 1.625rem; margin-block-end: 1.625rem; box-shadow: rgb(123 115 168 / 15%) 0px 13px 24px 0px; }
|
||||||
|
#panel { margin-top: 4px; }
|
||||||
|
</style>
|
||||||
|
<div id="panel"><slot></slot></div>
|
||||||
|
</div>
|
||||||
|
`
|
||||||
|
this.root = this.attachShadow({ mode: 'open' })
|
||||||
|
|
||||||
|
this.root.appendChild(this.template.content.cloneNode(true))
|
||||||
|
|
||||||
|
this.panel = this.root.querySelector('#panel')
|
||||||
|
this.header = this.root.querySelector('header')
|
||||||
|
|
||||||
|
this.panel.addEventListener('click', (evt) => {
|
||||||
|
if (evt.target?.tagName !== 'A') return
|
||||||
|
const href = evt.target.getAttribute('href')
|
||||||
|
const { origin } = new URL(location.href)
|
||||||
|
const url = new URL(href, location.href)
|
||||||
|
if (url.origin !== origin) return window.open(href)
|
||||||
|
evt.preventDefault()
|
||||||
|
document.documentElement.scrollTo(0, 0)
|
||||||
|
this.load(url.pathname).catch((err) => this.#error(err)).finally(() => {
|
||||||
|
this.header.querySelector('a').style.display = 'inline-block'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
window.addEventListener('popstate', (evt) => {
|
||||||
|
document.documentElement.scrollTo(0, 0)
|
||||||
|
if (evt.state?.page === 'readme.md') this.header.querySelector('a').style.display = 'none'
|
||||||
|
evt.preventDefault()
|
||||||
|
this.load(evt.state?.page || this.page, true).catch((err) => this.#error(err))
|
||||||
|
})
|
||||||
|
window.onbeforeunload = (e) => {
|
||||||
|
this.#load()
|
||||||
|
e.returnValue = false
|
||||||
|
}
|
||||||
|
this.page = this.dataset.load
|
||||||
|
this.load(this.page).catch((err) => this.#error(err))
|
||||||
|
}
|
||||||
|
|
||||||
|
#error (err) {
|
||||||
|
try { this.panel.querySelector('slot').innerHTML = err.stack } catch (e) { console.error(err, e) }
|
||||||
|
}
|
||||||
|
|
||||||
|
load (page = 'readme.md', replace) {
|
||||||
|
if (replace) history.replaceState({ page }, page, page)
|
||||||
|
else history.pushState({ page }, page, page)
|
||||||
|
this.page = page
|
||||||
|
return this.#load()
|
||||||
|
}
|
||||||
|
|
||||||
|
async #load () {
|
||||||
|
this.panel.querySelector('slot').innerHTML = marked.parse(await (await fetch(this.page)).text(), {headerIds: false, mangle: false})
|
||||||
|
}
|
||||||
|
})
|
||||||
16
package.json
Normal file
16
package.json
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
{
|
||||||
|
"name": "pear",
|
||||||
|
"main": "pulse.html",
|
||||||
|
"type": "module",
|
||||||
|
"pear": {
|
||||||
|
"gui": {
|
||||||
|
"backgroundColor": "#151517",
|
||||||
|
"height": 780,
|
||||||
|
"width": 1120
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"marked": "^5.1.0",
|
||||||
|
"overpass": "github:RedHatOfficial/Overpass#71f18db"
|
||||||
|
}
|
||||||
|
}
|
||||||
162
pulse.html
Normal file
162
pulse.html
Normal file
@@ -0,0 +1,162 @@
|
|||||||
|
<!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: #eee;
|
||||||
|
transition: background-color .4s, color .4s;
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body { overflow: scroll; }
|
||||||
|
|
||||||
|
html.light body {
|
||||||
|
background: hsl(0deg, 1.59%, 52.42%);
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
|
||||||
|
html.light header {
|
||||||
|
background: hsla(0deg, 1.59%, 52.42%, 0.9)
|
||||||
|
}
|
||||||
|
|
||||||
|
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; }
|
||||||
|
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;
|
||||||
|
top: -0.4rem;
|
||||||
|
cursor: pointer;
|
||||||
|
opacity: .65;
|
||||||
|
color: #B0D944;
|
||||||
|
}
|
||||||
|
#mode::after { content: "☀"; }
|
||||||
|
|
||||||
|
html.light #mode::after { content: "☾"; }
|
||||||
|
|
||||||
|
</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>
|
||||||
|
<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">
|
||||||
|
<h1>Pear by Holepunch</h1>
|
||||||
|
<blockquote><p>Welcome to the Internet of Peers</p></blockquote>
|
||||||
|
<p>Pear is ready to go.</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section id="documentation">
|
||||||
|
<div class="col">
|
||||||
|
<docs-viewer data-page="readme.md"></docs-viewer>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<script type='module' src='./lib/docs-viewer.js'></script>
|
||||||
|
</body>
|
||||||
Reference in New Issue
Block a user