diff --git a/website/index.html b/website/index.html
index 0a739f1..6ec9840 100644
--- a/website/index.html
+++ b/website/index.html
@@ -279,19 +279,54 @@
margin-bottom: 1rem;
}
+ /* ─── install tabs ─── */
+ .install-tabs {
+ display: flex;
+ gap: 0;
+ margin-top: 1.5rem;
+ border-bottom: 1px solid var(--border);
+ }
+ .install-tab {
+ background: none;
+ border: 1px solid transparent;
+ border-bottom: none;
+ color: var(--muted);
+ font-family: 'JetBrains Mono', monospace;
+ font-size: 12px;
+ font-weight: 600;
+ letter-spacing: 0.05em;
+ padding: 0.6rem 1.2rem;
+ cursor: pointer;
+ transition: color 0.15s, border-color 0.15s;
+ position: relative;
+ bottom: -1px;
+ }
+ .install-tab:hover {
+ color: var(--white);
+ }
+ .install-tab.active {
+ color: var(--green);
+ border-color: var(--border-hi);
+ border-bottom-color: var(--bg);
+ background: var(--bg);
+ }
+
/* ─── install block ─── */
.install-block {
background: var(--surface);
border: 1px solid var(--border);
- display: flex;
+ border-top: none;
+ display: none;
align-items: center;
justify-content: space-between;
gap: 1rem;
padding: 1rem 1.2rem;
- margin-top: 1.5rem;
flex-wrap: wrap;
transition: border-color 0.15s;
}
+ .install-block.active {
+ display: flex;
+ }
.install-block:hover {
border-color: var(--border-hi);
}
@@ -572,10 +607,18 @@
01 — Install
Get started in seconds
-
Requires Go 1.21+ and git on your PATH.
-
-
go install github.com/belaytzev/git-scoper@latest
-
+
Pick your preferred method — just git on your PATH is required.
+
+
+
+
+
+ brew tap belaytzev/tap && brew install git-scoper
+
+
+
+ go install github.com/belaytzev/git-scoper@latest
+
@@ -759,10 +802,23 @@
Identity resolution
}
})();
+ /* ── install tabs ── */
+ var tabs = document.querySelectorAll('.install-tab');
+ var panels = document.querySelectorAll('.install-block');
+ tabs.forEach(function (tab) {
+ tab.addEventListener('click', function () {
+ tabs.forEach(function (t) { t.classList.remove('active'); });
+ panels.forEach(function (p) { p.classList.remove('active'); });
+ tab.classList.add('active');
+ document.getElementById(tab.getAttribute('data-target')).classList.add('active');
+ });
+ });
+
/* ── copy to clipboard ── */
- function copyInstall() {
- var cmd = document.getElementById('install-cmd').textContent;
- var btn = document.getElementById('copy-btn');
+ function copyInstall(e) {
+ var block = e.target.closest('.install-block');
+ var cmd = block.querySelector('.install-cmd').textContent;
+ var btn = e.target;
function onSuccess() {
btn.textContent = 'copied!';
@@ -797,8 +853,10 @@
Identity resolution
}
}
- /* ── attach copy handler ─── */
- document.getElementById('copy-btn').addEventListener('click', copyInstall);
+ /* ── attach copy handlers ─── */
+ document.querySelectorAll('.copy-btn').forEach(function (btn) {
+ btn.addEventListener('click', copyInstall);
+ });