129 lines
3.3 KiB
HTML
129 lines
3.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<meta name="referrer" content="no-referrer">
|
|
<title>Instances</title>
|
|
<style>
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
html, body {
|
|
font-family: sans-serif;
|
|
background-color: #111;
|
|
color: #eee;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
body {
|
|
padding: 1rem;
|
|
margin: 0 auto;
|
|
max-width: 900px;
|
|
}
|
|
h1 {
|
|
padding: 2rem;
|
|
}
|
|
td {
|
|
max-width: 50vw;
|
|
overflow-wrap: break-word;
|
|
}
|
|
h1, td {
|
|
text-align: center;
|
|
}
|
|
main {
|
|
overflow-x: auto;
|
|
}
|
|
main, table {
|
|
width: 100%;
|
|
}
|
|
th,
|
|
td {
|
|
font-size: 1rem;
|
|
margin: 0.25rem 0.5rem;
|
|
padding: 0.5rem 0.75rem;
|
|
border-radius: 0.125rem;
|
|
background-color: #212121;
|
|
}
|
|
th {
|
|
font-weight: bolder;
|
|
}
|
|
a {
|
|
color: #eee;
|
|
}
|
|
footer {
|
|
text-align: center;
|
|
padding: 1rem;
|
|
}
|
|
footer a {
|
|
padding: 0 0.25rem;
|
|
text-decoration: none;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>Instances</h1>
|
|
<h2 id="to"></h2>
|
|
<main>
|
|
<table id="table">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>URL</th>
|
|
<th>Privacy Policy</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</main>
|
|
<footer>
|
|
<a target="_blank" href="https://codeberg.org/Hyperpipe/pages" title="add a new instance">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" height="16" width="16" stroke="#fff" stroke-width="2" fill="none">
|
|
<path d="M8 0 V16 M0 8 H16" />
|
|
</svg>
|
|
</a>
|
|
<a target="_blank" href="https://codeberg.org/Hyperpipe/Hyperpipe" title="hyperpipe's code">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" height="16" width="16" stroke="#fff" stroke-width="2" fill="none">
|
|
<path d="M1 1 h14 v14 h-14 v-15 m7 1 v14" />
|
|
</svg>
|
|
</a>
|
|
</footer>
|
|
<script>
|
|
try {
|
|
const tbody = document.getElementById('table').getElementsByTagName('tbody')[0],
|
|
el = document.createElement.bind(document);
|
|
|
|
document.getElementById('to').textContent = location.hash.replace('#','')
|
|
|
|
fetch('https://raw.codeberg.page/Hyperpipe/pages/api/frontend.json').then(res => {
|
|
res.json().then(json => {
|
|
for (let i of json) {
|
|
const row = el('tr'),
|
|
name = el('td'),
|
|
url = el('td'),
|
|
privacy = el('td'),
|
|
link = el('a'),
|
|
policy = el('a'),
|
|
nameNode = document.createTextNode(i.name);
|
|
|
|
link.href = i.url + location.hash.replace('#', '');
|
|
link.textContent = 'Visit'
|
|
|
|
policy.href = i.privacy;
|
|
policy.textContent = 'Visit'
|
|
|
|
name.append(nameNode);
|
|
url.append(link);
|
|
privacy.append(policy);
|
|
|
|
row.append(name);
|
|
row.append(url);
|
|
row.append(privacy)
|
|
|
|
tbody.append(row);
|
|
}
|
|
}).catch(err => alert(err))
|
|
}).catch(err => alert(err))
|
|
} catch (err) { alert(err) }
|
|
</script>
|
|
</body>
|
|
</html> |