forked from CWAD/circlewithadot.net
First commit
This commit is contained in:
190
services/aprelay.html
Normal file
190
services/aprelay.html
Normal file
@@ -0,0 +1,190 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<title>ActivityPub Relay — circlewithadot.net</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<link href="../style.css?v=20250831" rel="stylesheet" />
|
||||
<style>
|
||||
/* Relay-only CSS */
|
||||
.relay-wrap {
|
||||
max-width: 860px;
|
||||
margin: 0 auto 60px;
|
||||
padding: 0 16px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.relay-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin: 16px 0 10px;
|
||||
}
|
||||
.relay-header h1 {
|
||||
font-size: 44px;
|
||||
margin: 0 0 4px;
|
||||
}
|
||||
.relay-sub {
|
||||
color: #9aa0a6;
|
||||
margin: 0 0 18px;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
/* logo next to header */
|
||||
.relay-logo {
|
||||
display: block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 12px;
|
||||
flex: 0 0 auto;
|
||||
}
|
||||
|
||||
.relay-card {
|
||||
background: #121214;
|
||||
border: 1px solid #1d1f21;
|
||||
border-radius: 14px;
|
||||
padding: 22px;
|
||||
box-shadow: 0 14px 40px rgba(0,0,0,.45);
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.copy-list {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
gap: 12px;
|
||||
margin: 10px 0 4px;
|
||||
}
|
||||
.copyable {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background: #0f0f10;
|
||||
border: 1px solid #26282a;
|
||||
border-radius: 12px;
|
||||
padding: 12px 14px;
|
||||
font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
|
||||
font-size: 15px;
|
||||
cursor: pointer;
|
||||
user-select: all;
|
||||
word-break: break-all;
|
||||
}
|
||||
.copyable:hover {
|
||||
border-color: #34373a;
|
||||
}
|
||||
.copyable:focus-visible {
|
||||
outline: 2px solid #e53935;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
.note {
|
||||
color: #9aa0a6;
|
||||
font-size: 14px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.stats {
|
||||
margin-top: 14px;
|
||||
color: #9aa0a6;
|
||||
font-size: 14px;
|
||||
}
|
||||
</style>
|
||||
<script src="aprelay.js" defer></script>
|
||||
</head>
|
||||
<body>
|
||||
<header class="site-header">
|
||||
<a class="brand" href="../index.html">
|
||||
<img class="brand-logo" src="../images/cwad_logo.png" alt="Circle With A Dot logo" />
|
||||
<span class="brand-name">CIRCLE WITH A DOT</span>
|
||||
</a>
|
||||
</header>
|
||||
<main class="relay-wrap">
|
||||
<header class="relay-header">
|
||||
<img class="relay-logo" src="../images/aprelay_logo.png" alt="ActivityPub Relay logo" width="80" height="80">
|
||||
<div>
|
||||
<h1>ActivityPub Relay</h1>
|
||||
<p class="relay-sub">Location: US East</p>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<section class="relay-card">
|
||||
<p><strong>Mastodon & Misskey users</strong></p>
|
||||
<div class="copy-list">
|
||||
<span
|
||||
class="copyable"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
data-copy="https://relay-us-east.circlewithadot.net/inbox"
|
||||
>
|
||||
https://relay-us-east.circlewithadot.net/inbox
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p style="margin-top:14px;"><strong>Pleroma users</strong></p>
|
||||
<div class="copy-list">
|
||||
<span
|
||||
class="copyable"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
data-copy="https://relay-us-east.circlewithadot.net/actor"
|
||||
>
|
||||
https://relay-us-east.circlewithadot.net/actor
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p class="note">Click any box to copy to your clipboard.</p>
|
||||
|
||||
<div id="relay-stats" class="stats" aria-live="polite">
|
||||
Connected instances: <span id="instances">–</span><br />
|
||||
Jobs (last five minutes): <span id="jobs">–</span><br />
|
||||
Last update: <span id="updated">–</span><br />
|
||||
<br />
|
||||
Built using <a href="https://github.com/yukimochi/Activity-Relay" target="blank">Activity-Relay</a><br />
|
||||
<br >
|
||||
Only the above mentioned services are *officially* supported. Friendica and other instances may or may not work.
|
||||
</div>
|
||||
|
||||
<noscript>
|
||||
<p class="stats">
|
||||
JavaScript is disabled. Copy the relay URLs above. Live stats require
|
||||
JavaScript.
|
||||
</p>
|
||||
</noscript>
|
||||
</section>
|
||||
|
||||
<footer class="site-footer" role="contentinfo">
|
||||
<div class="footer-inner">
|
||||
<div class="footer-left">
|
||||
<a
|
||||
href="https://creativecommons.org/licenses/by-nc-sa/4.0/"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
class="footer-text"
|
||||
>
|
||||
BY-NC-SA 4.0
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-center">
|
||||
<a
|
||||
href="https://en.wikipedia.org/wiki/Copyleft"
|
||||
target="_blank"
|
||||
rel="noopener"
|
||||
class="footer-icon"
|
||||
aria-label="Copyleft (learn more)"
|
||||
>
|
||||
<img src="../images/cl.png" alt="Copyleft" />
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="footer-right footer-links">
|
||||
<a href="../LICENSE">License</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</main>
|
||||
|
||||
<a rel="me" href="https://mastodon.circlewithadot.net/@incentive" hidden>
|
||||
Mastodon</a>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user