bart/package-repo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add modern landing page with setup instructions

Browse Source
This commit is contained in:
bart
2026-10-20 21:37:56 +02:00
parent 283c95edf7
commit 50659a67f3
1 changed files with 533 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
binaries/index.html
+533 -2
View File
@@ -1,6 +1,537 @@
<!DOCTYPE html>
<html lang="nl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Eendoe Private APT Repository</title>
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>📦</text></svg>">
<style>
:root {
--bg-color: #0b111e;
--surface-color: #162032;
--surface-border: #23334d;
--surface-hover: #1f2c42;
--text-primary: #f1f5f9;
--text-secondary: #94a3b8;
--accent-primary: #38bdf8;
--accent-glow: rgba(56, 189, 248, 0.15);
--accent-secondary: #10b981;
--code-bg: #070d17;
--code-border: #1e293b;
--warning-border: #f59e0b;
}
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
<a href="/pool/main/e/eendoe-repository/eendoe-repository-1.0_all.deb">Download</a>
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
background-color: var(--bg-color);
color: var(--text-primary);
line-height: 1.6;
min-height: 100vh;
padding: 2.5rem 1rem;
}
.container {
max-width: 900px;
margin: 0 auto;
}
wget https://repository.eendoe.nl/pool/main/e/eendoe-repository/eendoe-repository-1.0_all.deb && sudo dpkg -i eendoe-repository-1.0_all.deb
header {
text-align: center;
margin-bottom: 3rem;
}
.badge {
display: inline-flex;
align-items: center;
gap: 0.4rem;
background: rgba(56, 189, 248, 0.1);
color: var(--accent-primary);
border: 1px solid rgba(56, 189, 248, 0.3);
padding: 0.35rem 0.85rem;
border-radius: 9999px;
font-size: 0.85rem;
font-weight: 600;
margin-bottom: 1rem;
}
.badge-dot {
width: 8px;
height: 8px;
background-color: var(--accent-secondary);
border-radius: 50%;
display: inline-block;
box-shadow: 0 0 8px var(--accent-secondary);
}
h1 {
font-size: 2.5rem;
font-weight: 800;
letter-spacing: -0.025em;
margin-bottom: 0.75rem;
background: linear-gradient(135deg, #ffffff 0%, #cbd5e1 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
p.subtitle {
color: var(--text-secondary);
font-size: 1.15rem;
max-width: 650px;
margin: 0 auto;
}
.card {
background-color: var(--surface-color);
border: 1px solid var(--surface-border);
border-radius: 1rem;
padding: 1.75rem;
margin-bottom: 2rem;
box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3);
transition: border-color 0.2s ease;
}
.card:hover {
border-color: #3b82f6;
}
.card-header {
display: flex;
align-items: center;
gap: 0.75rem;
margin-bottom: 1.25rem;
}
.card-icon {
font-size: 1.5rem;
background: var(--surface-hover);
border: 1px solid var(--surface-border);
width: 44px;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 0.75rem;
}
h2 {
font-size: 1.35rem;
font-weight: 700;
color: #f8fafc;
}
.code-block {
position: relative;
background-color: var(--code-bg);
border: 1px solid var(--code-border);
border-radius: 0.65rem;
padding: 1rem 1.25rem;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
font-size: 0.95rem;
color: #38bdf8;
overflow-x: auto;
margin-top: 0.75rem;
margin-bottom: 0.75rem;
display: flex;
justify-content: space-between;
align-items: center;
}
.code-block code {
word-break: break-all;
}
.copy-btn {
background-color: var(--surface-hover);
border: 1px solid var(--surface-border);
color: var(--text-secondary);
padding: 0.35rem 0.75rem;
border-radius: 0.4rem;
font-size: 0.8rem;
font-weight: 600;
cursor: pointer;
transition: all 0.2s ease;
white-space: nowrap;
margin-left: 1rem;
}
.copy-btn:hover {
background-color: var(--surface-border);
color: #ffffff;
}
.copy-btn.copied {
background-color: var(--accent-secondary);
color: #ffffff;
border-color: var(--accent-secondary);
}
.tabs {
display: flex;
gap: 0.5rem;
border-bottom: 1px solid var(--surface-border);
margin-bottom: 1.25rem;
padding-bottom: 0.5rem;
}
.tab-btn {
background: none;
border: none;
color: var(--text-secondary);
padding: 0.5rem 1rem;
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
border-radius: 0.5rem;
transition: all 0.2s ease;
}
.tab-btn:hover {
color: var(--text-primary);
background: var(--surface-hover);
}
.tab-btn.active {
color: var(--accent-primary);
background: rgba(56, 189, 248, 0.1);
}
.tab-content {
display: none;
}
.tab-content.active {
display: block;
}
.steps {
list-style: none;
counter-reset: step-counter;
}
.step-item {
position: relative;
padding-left: 2.75rem;
margin-bottom: 1.5rem;
}
.step-item::before {
counter-increment: step-counter;
content: counter(step-counter);
position: absolute;
left: 0;
top: 0;
width: 2rem;
height: 2rem;
background-color: rgba(56, 189, 248, 0.1);
border: 1px solid rgba(56, 189, 248, 0.3);
color: var(--accent-primary);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-weight: 700;
font-size: 0.9rem;
}
.step-title {
font-weight: 600;
margin-bottom: 0.25rem;
}
.step-desc {
color: var(--text-secondary);
font-size: 0.92rem;
margin-bottom: 0.5rem;
}
.packages-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
gap: 1.25rem;
margin-top: 1rem;
}
.package-item {
background-color: var(--surface-hover);
border: 1px solid var(--surface-border);
border-radius: 0.75rem;
padding: 1.25rem;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.package-name {
font-weight: 700;
font-size: 1.05rem;
color: #ffffff;
margin-bottom: 0.4rem;
}
.package-desc {
color: var(--text-secondary);
font-size: 0.88rem;
margin-bottom: 1rem;
flex-grow: 1;
}
.package-meta {
font-size: 0.8rem;
color: #64748b;
font-family: monospace;
border-top: 1px solid var(--surface-border);
padding-top: 0.75rem;
display: flex;
justify-content: space-between;
}
.links-row {
display: flex;
gap: 1rem;
flex-wrap: wrap;
margin-top: 1rem;
}
.btn-link {
display: inline-flex;
align-items: center;
gap: 0.5rem;
background-color: var(--surface-hover);
color: var(--text-primary);
text-decoration: none;
border: 1px solid var(--surface-border);
padding: 0.6rem 1.2rem;
border-radius: 0.6rem;
font-weight: 600;
font-size: 0.95rem;
transition: all 0.2s ease;
}
.btn-link:hover {
background-color: var(--surface-border);
border-color: var(--accent-primary);
color: var(--accent-primary);
}
footer {
text-align: center;
color: var(--text-secondary);
font-size: 0.88rem;
margin-top: 4rem;
border-top: 1px solid var(--surface-border);
padding-top: 2rem;
}
footer a {
color: var(--accent-primary);
text-decoration: none;
}
footer a:hover {
text-decoration: underline;
}
.alert-box {
background: rgba(245, 158, 11, 0.1);
border-left: 4px solid var(--warning-border);
padding: 0.85rem 1rem;
border-radius: 0 0.5rem 0.5rem 0;
font-size: 0.9rem;
color: #fde68a;
margin-top: 0.75rem;
}
</style>
</head>
<body>
<div class="container">
<header>
<div class="badge">
<span class="badge-dot"></span>
Private APT Repository • HTTP Basic Auth
</div>
<h1>Eendoe Package Repository</h1>
<p class="subtitle">Officiële software repository voor Debian, Ubuntu en Linux Mint componenten van Eendoe Services.</p>
</header>
<!-- Snelle installatie sectie -->
<div class="card">
<div class="card-header">
<div class="card-icon">⚡</div>
<div>
<h2>Snelle Installatie (1 Commando)</h2>
<p class="step-desc">Voer het onderstaande commando uit op je Linux Mint of Ubuntu/Debian systeem om de repository direct te configureren.</p>
</div>
</div>
<div class="tabs">
<button class="tab-btn active" onclick="switchTab('interactive')">Interactief (Aanbevolen)</button>
<button class="tab-btn" onclick="switchTab('oneliner')">Stille One-Liner</button>
</div>
<div id="interactive" class="tab-content active">
<p class="step-desc">Vraagt interactief en veilig naar je wachtwoord zonder dat het in je shellgeschiedenis belandt:</p>
<div class="code-block">
<code>curl -sSL https://eendoe.nl/install-repo.sh | sudo bash</code>
<button class="copy-btn" onclick="copyCode(this)">Kopieer</button>
</div>
</div>
<div id="oneliner" class="tab-content">
<p class="step-desc">Voor scripts of geautomatiseerde installaties (vul je wachtwoord direct in):</p>
<div class="code-block">
<code>curl -sSL https://eendoe.nl/install-repo.sh | sudo bash -s -- eendoe &lt;wachtwoord&gt;</code>
<button class="copy-btn" onclick="copyCode(this)">Kopieer</button>
</div>
</div>
<div class="alert-box">
🔒 <strong>Let op:</strong> Dit is een besloten repository. Toegang vereist geldige authenticatie (standaard gebruikersnaam: <code>eendoe</code>).
</div>
</div>
<!-- Handmatige configuratie sectie -->
<div class="card">
<div class="card-header">
<div class="card-icon">🛠️</div>
<div>
<h2>Handmatige Configuratie</h2>
<p class="step-desc">Wil je de repository liever handmatig configureren? Volg onderstaande stappen:</p>
</div>
</div>
<ol class="steps">
<li class="step-item">
<div class="step-title">Authenticatie instellen</div>
<div class="step-desc">Maak <code>/etc/apt/auth.conf.d/eendoe.conf</code> aan met strikte rechten (alleen root):</div>
<div class="code-block">
<code>echo "machine repository.eendoe.nl login eendoe password &lt;wachtwoord&gt;" | sudo tee /etc/apt/auth.conf.d/eendoe.conf && sudo chmod 600 /etc/apt/auth.conf.d/eendoe.conf</code>
<button class="copy-btn" onclick="copyCode(this)">Kopieer</button>
</div>
</li>
<li class="step-item">
<div class="step-title">GPG sleutel installeren</div>
<div class="step-desc">Haal de release sleutel op en bewaar deze in de apt keyrings:</div>
<div class="code-block">
<code>sudo install -m 0755 -d /etc/apt/keyrings && curl -u eendoe:&lt;wachtwoord&gt; -sSL https://eendoe.nl/install-repo.sh | grep -A 100 'BEGIN PGP' | grep -B 100 'END PGP' | gpg --dearmor | sudo tee /etc/apt/keyrings/eendoe.gpg &gt; /dev/null</code>
<button class="copy-btn" onclick="copyCode(this)">Kopieer</button>
</div>
</li>
<li class="step-item">
<div class="step-title">Repository toevoegen aan sources.list</div>
<div class="step-desc">Voeg de deb-bronregel toe aan <code>/etc/apt/sources.list.d/eendoe.list</code>:</div>
<div class="code-block">
<code>echo "deb [arch=amd64 signed-by=/etc/apt/keyrings/eendoe.gpg] https://repository.eendoe.nl/ stable main" | sudo tee /etc/apt/sources.list.d/eendoe.list</code>
<button class="copy-btn" onclick="copyCode(this)">Kopieer</button>
</div>
</li>
<li class="step-item">
<div class="step-title">Pakketlijst bijwerken</div>
<div class="step-desc">Werk de lokale cache bij:</div>
<div class="code-block">
<code>sudo apt update</code>
<button class="copy-btn" onclick="copyCode(this)">Kopieer</button>
</div>
</li>
</ol>
</div>
<!-- Beschikbare pakketten sectie -->
<div class="card">
<div class="card-header">
<div class="card-icon">📦</div>
<div>
<h2>Beschikbare Pakketten</h2>
<p class="step-desc">Pakketten die via deze repository kunnen worden geïnstalleerd:</p>
</div>
</div>
<div class="packages-grid">
<div class="package-item">
<div>
<div class="package-name">eendoe-hyperdeck</div>
<div class="package-desc">Blackmagic Hyperdeck opname- en streaming controller service met systemd integratie.</div>
</div>
<div class="package-meta">
<span>Versie: 0.15.2</span>
<span>Arch: all</span>
</div>
</div>
<div class="package-item">
<div>
<div class="package-name">eendoe-srs</div>
<div class="package-desc">Simple Realtime Server (SRS) video ingest- en feed service voor videostreams.</div>
</div>
<div class="package-meta">
<span>Versie: 0.0.1</span>
<span>Arch: all</span>
</div>
</div>
<div class="package-item">
<div>
<div class="package-name">eendoe-repository</div>
<div class="package-desc">Bootstrap configuratiepakket om automatisch de repository sleutels en bronnen in te stellen.</div>
</div>
<div class="package-meta">
<span>Versie: 1.0</span>
<span>Arch: all</span>
</div>
</div>
</div>
<div class="links-row">
<a class="btn-link" href="/dists/stable/">
📂 Blader door <code>/dists/stable/</code>
</a>
<a class="btn-link" href="/pool/main/">
📦 Blader door <code>/pool/main/</code>
</a>
<a class="btn-link" href="/pool/main/e/eendoe-repository/eendoe-repository-1.0_all.deb">
⬇️ Download eendoe-repository-1.0_all.deb
</a>
</div>
</div>
<footer>
<p>&copy; 2026 Eendoe Services B.V. &bull; <a href="https://eendoe.nl" target="_blank" rel="noopener">eendoe.nl</a> &bull; Beheerd via Homelab GitOps Cluster</p>
</footer>
</div>
<script>
function copyCode(btn) {
const codeBlock = btn.parentElement.querySelector('code');
const text = codeBlock.innerText;
navigator.clipboard.writeText(text).then(() => {
const originalText = btn.innerText;
btn.innerText = 'Gekopieerd!';
btn.classList.add('copied');
setTimeout(() => {
btn.innerText = originalText;
btn.classList.remove('copied');
}, 2000);
});
}
function switchTab(tabId) {
document.querySelectorAll('.tab-btn').forEach(btn => btn.classList.remove('active'));
document.querySelectorAll('.tab-content').forEach(content => content.classList.remove('active'));
event.target.classList.add('active');
document.getElementById(tabId).classList.add('active');
}
</script>
</body>
</html>