mirror of
https://github.com/ArchiveBox/ArchiveBox.git
synced 2026-09-14 11:06:13 +05:00
Add static ArchiveBox landing page
Signed-off-by: Nick Sweeting <git@sweeting.me>
This commit is contained in:
Nick Sweeting
parent
42dc87f271
commit
2c1700a8e0
42
.github/workflows/gh-pages.yml
vendored
42
.github/workflows/gh-pages.yml
vendored
@ -1,63 +1,39 @@
|
||||
# Simple workflow for deploying static content to GitHub Pages
|
||||
name: Deploy static content to Pages
|
||||
name: Deploy GitHub Pages
|
||||
|
||||
on:
|
||||
# Runs on pushes targeting the default branch
|
||||
push:
|
||||
branches: ["dev"]
|
||||
|
||||
# Allows you to run this workflow manually from the Actions tab
|
||||
branches:
|
||||
- dev
|
||||
workflow_dispatch:
|
||||
|
||||
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
|
||||
permissions:
|
||||
contents: read
|
||||
pages: write
|
||||
id-token: write
|
||||
|
||||
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
|
||||
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
|
||||
concurrency:
|
||||
group: "pages"
|
||||
cancel-in-progress: false
|
||||
group: pages
|
||||
cancel-in-progress: true
|
||||
|
||||
jobs:
|
||||
# Single deploy job since we're just deploying
|
||||
deploy:
|
||||
environment:
|
||||
name: github-pages
|
||||
url: ${{ steps.deployment.outputs.page_url }}
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
submodules: true
|
||||
fetch-depth: 1
|
||||
- name: Copy README.md into place
|
||||
run: |
|
||||
rm -f ./website/README.md
|
||||
cp ./README.md ./website/README.md
|
||||
|
||||
- name: Setup Pages
|
||||
uses: actions/configure-pages@v5
|
||||
- name: Build with Jekyll
|
||||
uses: actions/jekyll-build-pages@v1
|
||||
with:
|
||||
source: ./website
|
||||
destination: ./_site
|
||||
|
||||
- name: Upload artifact
|
||||
uses: actions/upload-pages-artifact@v3
|
||||
|
||||
# - name: Checkout
|
||||
# uses: actions/checkout@v4
|
||||
# - name: Setup Pages
|
||||
# uses: actions/configure-pages@v5
|
||||
# - name: Upload artifact
|
||||
# uses: actions/upload-pages-artifact@v3
|
||||
# with:
|
||||
# # Upload entire repository
|
||||
# path: './website'
|
||||
with:
|
||||
path: ./publicsite
|
||||
|
||||
- name: Deploy to GitHub Pages
|
||||
id: deployment
|
||||
|
||||
58
.github/workflows/jekyll-gh-pages.yml
vendored
58
.github/workflows/jekyll-gh-pages.yml
vendored
@ -1,58 +0,0 @@
|
||||
# Sample workflow for building and deploying a Jekyll site to GitHub Pages
|
||||
name: Build GitHub Pages website
|
||||
|
||||
on:
|
||||
# Runs on pushes targeting the default branch
|
||||
push:
|
||||
branches: ["dev"]
|
||||
|
||||
# Allows you to run this workflow manually from the Actions tab
|
||||
workflow_dispatch:
|
||||
|
||||
# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
|
||||
permissions:
|
||||
contents: read
|
||||
pages: write
|
||||
id-token: write
|
||||
|
||||
# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
|
||||
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
|
||||
concurrency:
|
||||
group: "pages"
|
||||
cancel-in-progress: true
|
||||
|
||||
jobs:
|
||||
# Build job
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout
|
||||
uses: actions/checkout@v4
|
||||
with:
|
||||
submodules: true
|
||||
fetch-depth: 1
|
||||
- name: Copy README.md into place
|
||||
run: |
|
||||
rm ./website/README.md
|
||||
cp ./README.md ./website/README.md
|
||||
- name: Setup Pages
|
||||
uses: actions/configure-pages@v5
|
||||
- name: Build with Jekyll
|
||||
uses: actions/jekyll-build-pages@v1
|
||||
with:
|
||||
source: ./website
|
||||
destination: ./_site
|
||||
- name: Upload artifact
|
||||
uses: actions/upload-pages-artifact@v3
|
||||
|
||||
# Deployment job
|
||||
deploy:
|
||||
environment:
|
||||
name: github-pages
|
||||
url: ${{ steps.deployment.outputs.page_url }}
|
||||
runs-on: ubuntu-latest
|
||||
needs: build
|
||||
steps:
|
||||
- name: Deploy to GitHub Pages
|
||||
id: deployment
|
||||
uses: actions/deploy-pages@v4
|
||||
1
publicsite/.nojekyll
Normal file
1
publicsite/.nojekyll
Normal file
@ -0,0 +1 @@
|
||||
|
||||
|
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
275
publicsite/index.html
Normal file
275
publicsite/index.html
Normal file
@ -0,0 +1,275 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="ArchiveBox is open-source self-hosted web archiving for preserving websites, media, evidence, research sources, and institutional records in durable formats.">
|
||||
<title>ArchiveBox - Open-source self-hosted web archiving</title>
|
||||
<link rel="icon" href="./icon.png">
|
||||
<link rel="apple-touch-icon" href="./icon.png">
|
||||
<link rel="stylesheet" href="./shadcn-theme.css">
|
||||
<link rel="stylesheet" href="./styles.css">
|
||||
</head>
|
||||
<body>
|
||||
<header class="site-header">
|
||||
<a class="brand" href="#top" aria-label="ArchiveBox home">
|
||||
<img src="./icon.png" alt="" width="42" height="42">
|
||||
<span>ArchiveBox</span>
|
||||
</a>
|
||||
<nav aria-label="Primary navigation">
|
||||
<a href="#install">Install</a>
|
||||
<a href="#use-cases">Use cases</a>
|
||||
<a href="#ecosystem">Ecosystem</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki">Docs</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox">GitHub</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main id="top">
|
||||
<section class="hero section">
|
||||
<div class="hero-copy">
|
||||
<p class="eyebrow">Open-source self-hosted web archiving</p>
|
||||
<h1>Preserve the web content you care about, on infrastructure you control.</h1>
|
||||
<p class="lede">ArchiveBox saves websites, bookmarks, RSS feeds, social posts, media, source code, and research material in durable files like HTML, PDF, PNG, TXT, JSON, WARC, MP4, and SQLite.</p>
|
||||
<div class="hero-actions" aria-label="Primary actions">
|
||||
<a class="button primary" href="#install">Run with Docker Compose</a>
|
||||
<a class="button secondary" href="https://demo.archivebox.io">View demo</a>
|
||||
</div>
|
||||
<div class="hero-links" aria-label="Project links">
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Quickstart">Quickstart</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki">Documentation</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Web-Archiving-Community">Community</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-panel" aria-label="ArchiveBox setup preview">
|
||||
<div class="terminal">
|
||||
<div class="terminal-bar">
|
||||
<span></span><span></span><span></span>
|
||||
</div>
|
||||
<pre><code>mkdir -p ~/archivebox/data && cd ~/archivebox
|
||||
curl -fsSL 'https://docker-compose.archivebox.io' > docker-compose.yml
|
||||
docker compose run archivebox init --install
|
||||
docker compose up</code></pre>
|
||||
</div>
|
||||
<img class="product-shot" src="https://github.com/ArchiveBox/ArchiveBox/assets/511499/e8e0b6f8-8fdf-4b7f-8124-c10d8699bdb2" alt="ArchiveBox snapshot list in the admin web interface">
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="trust-strip" aria-label="ArchiveBox capabilities">
|
||||
<span>CLI</span>
|
||||
<span>Web UI</span>
|
||||
<span>REST API</span>
|
||||
<span>Webhooks</span>
|
||||
<span>Browser extension</span>
|
||||
<span>Filesystem access</span>
|
||||
</section>
|
||||
|
||||
<section class="section split">
|
||||
<div>
|
||||
<p class="eyebrow">Why ArchiveBox</p>
|
||||
<h2>Designed for useful archives, not proprietary silos.</h2>
|
||||
</div>
|
||||
<div class="feature-grid">
|
||||
<article>
|
||||
<h3>Readable for decades</h3>
|
||||
<p>Snapshots are stored as ordinary files and folders, with metadata in SQLite and JSON. You can browse the collection without depending on a hosted service.</p>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Multiple captures per URL</h3>
|
||||
<p>ArchiveBox can save rendered HTML, screenshots, PDFs, WARC files, article text, headers, favicons, media, subtitles, and source repositories.</p>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Bring your sources</h3>
|
||||
<p>Import one URL, pipe text into the CLI, upload exported bookmarks, or schedule recurring pulls from RSS feeds and other text-based source lists.</p>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Self-hosted by default</h3>
|
||||
<p>Run it as a Docker web app, use one-off CLI commands, or automate with APIs while keeping private and public material under your own policy.</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="use-cases" class="section">
|
||||
<div class="section-heading">
|
||||
<p class="eyebrow">Who it is for</p>
|
||||
<h2>Archiving workflows for individuals, professionals, and institutions.</h2>
|
||||
</div>
|
||||
<div class="audience-grid">
|
||||
<article class="audience-card">
|
||||
<h3>Personal archivists and self-hosters</h3>
|
||||
<p>Save bookmarks, browser history, RSS feeds, social media, form content, videos, podcasts, music, photos, and personal knowledge collections.</p>
|
||||
<ul>
|
||||
<li>Own your data and keep it on local or remote storage you control.</li>
|
||||
<li>Use the browser extension, CLI, Web UI, and scheduled imports together.</li>
|
||||
<li>Export static HTML or browse the filesystem directly.</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article class="audience-card">
|
||||
<h3>Lawyers and journalists</h3>
|
||||
<p>Capture web pages, articles, source material, and public records while preserving reviewable copies outside of volatile platforms.</p>
|
||||
<ul>
|
||||
<li>Store screenshots, PDFs, headers, WARC files, and text extraction.</li>
|
||||
<li>Tag and review sources through the self-hosted web interface.</li>
|
||||
<li>Tune privacy, authentication, and publishing settings for casework.</li>
|
||||
</ul>
|
||||
</article>
|
||||
<article class="audience-card">
|
||||
<h3>Researchers and institutions</h3>
|
||||
<p>Support OSINT, social media research, AI-powered research agents, libraries, governments, and collection-building teams.</p>
|
||||
<ul>
|
||||
<li>Automate imports through the CLI, REST API, webhooks, and schedules.</li>
|
||||
<li>Keep machine-readable metadata in JSON and SQLite.</li>
|
||||
<li>Extend extraction pipelines through the ArchiveBox ecosystem.</li>
|
||||
</ul>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="install" class="section install-section">
|
||||
<div class="install-copy">
|
||||
<p class="eyebrow">Recommended install</p>
|
||||
<h2>Start with Docker Compose.</h2>
|
||||
<p>Docker Compose is the recommended ArchiveBox setup for the easiest install and update path, better isolation, and bundled archiving dependencies like Chrome, wget, yt-dlp, SingleFile, and readability tools.</p>
|
||||
<div class="mini-links">
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Install#option-a-docker--docker-compose-setup-%EF%B8%8F">Docker install guide</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Docker">Docker usage wiki</a>
|
||||
<a href="https://raw.githubusercontent.com/ArchiveBox/ArchiveBox/dev/docker-compose.yml">docker-compose.yml</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="command-card">
|
||||
<div class="step">
|
||||
<span>1</span>
|
||||
<div>
|
||||
<h3>Create a data directory</h3>
|
||||
<pre><code>mkdir -p ~/archivebox/data && cd ~/archivebox</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="step">
|
||||
<span>2</span>
|
||||
<div>
|
||||
<h3>Download Docker Compose config</h3>
|
||||
<pre><code>curl -fsSL 'https://docker-compose.archivebox.io' > docker-compose.yml</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="step">
|
||||
<span>3</span>
|
||||
<div>
|
||||
<h3>Initialize and start</h3>
|
||||
<pre><code>docker compose run archivebox init --install
|
||||
docker compose up</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="step">
|
||||
<span>4</span>
|
||||
<div>
|
||||
<h3>Add your first URL</h3>
|
||||
<pre><code>docker compose run archivebox add 'https://example.com'</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section compact-docs" aria-labelledby="other-installs-title">
|
||||
<h2 id="other-installs-title">Other install paths</h2>
|
||||
<p>ArchiveBox can also run with plain Docker, pip, brew, deb packages, or the optional setup script. Docker Compose remains the default recommendation, especially when you want bundled dependencies and clean upgrades.</p>
|
||||
<div class="doc-link-grid">
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Install">Bare metal install</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox#quickstart">README quickstart</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Usage#cli-usage">CLI usage</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Configuration">Configuration</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section data-section">
|
||||
<div class="section-heading">
|
||||
<p class="eyebrow">Inputs and outputs</p>
|
||||
<h2>Feed it almost any source list. Keep redundant, portable captures.</h2>
|
||||
</div>
|
||||
<div class="data-grid">
|
||||
<article>
|
||||
<h3>Inputs</h3>
|
||||
<p>Archive one URL at a time or schedule imports from bookmarks, browser history, RSS, JSON, CSV, TXT, SQL, HTML, Markdown, Pocket, Pinboard, Instapaper, Shaarli, Wallabag, and more.</p>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Outputs</h3>
|
||||
<p>Each snapshot can include original HTML, rendered single-file HTML, PDF, screenshot PNG, WARC, title, article text, favicon, headers, media, subtitles, metadata, thumbnails, and git clones.</p>
|
||||
</article>
|
||||
<article>
|
||||
<h3>Access</h3>
|
||||
<p>Manage the same collection through the Web UI, CLI, REST API, Python API, SQLite, or the data folder itself. The tools are complementary, not separate products.</p>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="ecosystem" class="section ecosystem">
|
||||
<div class="section-heading">
|
||||
<p class="eyebrow">Ecosystem</p>
|
||||
<h2>Core projects that make ArchiveBox extensible.</h2>
|
||||
</div>
|
||||
<div class="project-grid">
|
||||
<article>
|
||||
<h3>abx-plugins</h3>
|
||||
<p>Extractor and plugin packages used to preserve more types of content.</p>
|
||||
<div>
|
||||
<a href="https://github.com/ArchiveBox/abx-plugins">GitHub</a>
|
||||
<a href="https://archivebox.github.io/abx-plugins/">Docs</a>
|
||||
</div>
|
||||
</article>
|
||||
<article>
|
||||
<h3>abx-dl</h3>
|
||||
<p>Download and extraction tooling for saving web content and media.</p>
|
||||
<div>
|
||||
<a href="https://github.com/ArchiveBox/abx-dl">GitHub</a>
|
||||
</div>
|
||||
</article>
|
||||
<article>
|
||||
<h3>abxpkg</h3>
|
||||
<p>Runtime package management for dependencies used by ArchiveBox and plugins.</p>
|
||||
<div>
|
||||
<a href="https://github.com/ArchiveBox/abxpkg">GitHub</a>
|
||||
<a href="https://archivebox.github.io/abxpkg/">Docs</a>
|
||||
</div>
|
||||
</article>
|
||||
<article>
|
||||
<h3>abxbus</h3>
|
||||
<p>Event bus infrastructure for ArchiveBox automation and integrations.</p>
|
||||
<div>
|
||||
<a href="https://github.com/ArchiveBox/abxbus">GitHub</a>
|
||||
<a href="https://abxbus.archivebox.io">Site</a>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section docs-band">
|
||||
<div>
|
||||
<p class="eyebrow">Documentation</p>
|
||||
<h2>Go deeper when you need production details.</h2>
|
||||
<p>The README and wiki cover supported sources, outputs, scheduled archiving, storage backends, authentication, security, publishing, Chrome setup, upgrades, and troubleshooting.</p>
|
||||
</div>
|
||||
<div class="doc-link-grid">
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Quickstart">Quickstart</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Scheduled-Archiving">Scheduled archiving</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Setting-up-Storage">Storage backends</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Security-Overview">Security overview</a>
|
||||
<a href="https://docs.archivebox.io">API docs</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/issues">Issue tracker</a>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<footer class="site-footer">
|
||||
<div class="brand">
|
||||
<img src="./icon.png" alt="" width="34" height="34">
|
||||
<span>ArchiveBox</span>
|
||||
</div>
|
||||
<p>Open-source self-hosted web archiving. MIT licensed, nonprofit-supported, and built for durable collections.</p>
|
||||
<div>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/blob/dev/LICENSE">License</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/releases">Changelog</a>
|
||||
<a href="https://zulip.archivebox.io">Community chat</a>
|
||||
<a href="https://github.com/ArchiveBox/ArchiveBox/wiki/Donations">Donations</a>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
22
publicsite/shadcn-theme.css
Normal file
22
publicsite/shadcn-theme.css
Normal file
@ -0,0 +1,22 @@
|
||||
:root {
|
||||
--background: 339 49% 100%;
|
||||
--foreground: 339 66% 4%;
|
||||
--muted: 99 20% 93%;
|
||||
--muted-foreground: 99 9% 39%;
|
||||
--popover: 339 49% 100%;
|
||||
--popover-foreground: 339 66% 4%;
|
||||
--card: 339 49% 100%;
|
||||
--card-foreground: 339 66% 4%;
|
||||
--border: 339 7% 94%;
|
||||
--input: 339 7% 94%;
|
||||
--primary: 339 48% 41%;
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: 99 48% 41%;
|
||||
--secondary-foreground: 0 0% 100%;
|
||||
--accent: 219 48% 41%;
|
||||
--accent-foreground: 0 0% 100%;
|
||||
--destructive: 19 85% 36%;
|
||||
--destructive-foreground: 0 0% 100%;
|
||||
--ring: 339 48% 41%;
|
||||
--radius: 0.5rem;
|
||||
}
|
||||
624
publicsite/styles.css
Normal file
624
publicsite/styles.css
Normal file
@ -0,0 +1,624 @@
|
||||
:root {
|
||||
color-scheme: light;
|
||||
--font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||||
--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
|
||||
--page: hsl(var(--background));
|
||||
--text: hsl(var(--foreground));
|
||||
--muted-text: hsl(var(--muted-foreground));
|
||||
--line: hsl(var(--border));
|
||||
--panel: hsl(var(--card));
|
||||
--soft: hsl(var(--muted));
|
||||
--brand: hsl(var(--primary));
|
||||
--brand-text: hsl(var(--primary-foreground));
|
||||
--green: hsl(var(--secondary));
|
||||
--blue: hsl(var(--accent));
|
||||
--shadow: 0 20px 70px hsl(339 48% 41% / 0.12);
|
||||
--radius: 8px;
|
||||
--content: 1180px;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
overflow-x: hidden;
|
||||
background:
|
||||
linear-gradient(180deg, hsl(339 49% 99%) 0%, hsl(99 20% 97%) 44%, #ffffff 100%);
|
||||
color: var(--text);
|
||||
font-family: var(--font-sans);
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
body::before {
|
||||
content: "";
|
||||
position: fixed;
|
||||
inset: 0;
|
||||
pointer-events: none;
|
||||
background-image:
|
||||
linear-gradient(hsl(339 7% 94% / 0.56) 1px, transparent 1px),
|
||||
linear-gradient(90deg, hsl(339 7% 94% / 0.56) 1px, transparent 1px);
|
||||
background-size: 40px 40px;
|
||||
mask-image: linear-gradient(180deg, black 0%, transparent 56%);
|
||||
}
|
||||
|
||||
a {
|
||||
color: var(--brand);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
display: block;
|
||||
}
|
||||
|
||||
pre {
|
||||
margin: 0;
|
||||
overflow-x: auto;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.92rem;
|
||||
}
|
||||
|
||||
.site-header {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 20;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 24px;
|
||||
width: min(var(--content), calc(100vw - 32px));
|
||||
margin: 0 auto;
|
||||
padding: 16px 0;
|
||||
background: hsl(var(--background) / 0.88);
|
||||
backdrop-filter: blur(16px);
|
||||
border-bottom: 1px solid hsl(var(--border) / 0.72);
|
||||
}
|
||||
|
||||
.brand {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
color: var(--text);
|
||||
font-weight: 760;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.brand:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.brand img {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.site-header nav,
|
||||
.site-footer div:last-child,
|
||||
.hero-links,
|
||||
.mini-links {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px 18px;
|
||||
}
|
||||
|
||||
.site-header nav a {
|
||||
color: var(--muted-text);
|
||||
font-size: 0.94rem;
|
||||
font-weight: 650;
|
||||
}
|
||||
|
||||
.site-header nav a:hover {
|
||||
color: var(--brand);
|
||||
}
|
||||
|
||||
.section {
|
||||
position: relative;
|
||||
width: min(var(--content), calc(100vw - 32px));
|
||||
margin: 0 auto;
|
||||
padding: 88px 0;
|
||||
}
|
||||
|
||||
.hero {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) minmax(360px, 0.82fr);
|
||||
gap: 48px;
|
||||
align-items: center;
|
||||
min-height: calc(100vh - 76px);
|
||||
padding-top: 56px;
|
||||
}
|
||||
|
||||
.hero-copy {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.eyebrow {
|
||||
margin: 0 0 14px;
|
||||
color: var(--brand);
|
||||
font-size: 0.78rem;
|
||||
font-weight: 820;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
max-width: 850px;
|
||||
margin-bottom: 22px;
|
||||
font-size: clamp(3.1rem, 7.4vw, 5.9rem);
|
||||
line-height: 0.95;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin-bottom: 18px;
|
||||
font-size: clamp(2rem, 4.3vw, 3.5rem);
|
||||
line-height: 1;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin-bottom: 10px;
|
||||
font-size: 1.08rem;
|
||||
line-height: 1.25;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.lede {
|
||||
max-width: 720px;
|
||||
color: var(--muted-text);
|
||||
font-size: clamp(1.1rem, 2vw, 1.32rem);
|
||||
}
|
||||
|
||||
.hero-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
margin: 32px 0 20px;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline-flex;
|
||||
min-height: 46px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 0 18px;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
font-weight: 760;
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.button.primary {
|
||||
background: var(--brand);
|
||||
color: var(--brand-text);
|
||||
border-color: var(--brand);
|
||||
box-shadow: 0 12px 28px hsl(339 48% 41% / 0.2);
|
||||
}
|
||||
|
||||
.button.secondary {
|
||||
background: var(--panel);
|
||||
color: var(--text);
|
||||
}
|
||||
|
||||
.hero-links a,
|
||||
.mini-links a {
|
||||
color: var(--muted-text);
|
||||
font-weight: 650;
|
||||
}
|
||||
|
||||
.hero-panel {
|
||||
display: grid;
|
||||
gap: 18px;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.terminal,
|
||||
.command-card,
|
||||
.audience-card,
|
||||
.project-grid article,
|
||||
.data-grid article,
|
||||
.feature-grid article,
|
||||
.docs-band,
|
||||
.compact-docs {
|
||||
background: hsl(var(--card) / 0.94);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.terminal {
|
||||
overflow: hidden;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.terminal-bar {
|
||||
display: flex;
|
||||
gap: 7px;
|
||||
padding: 14px 16px;
|
||||
border-bottom: 1px solid var(--line);
|
||||
background: hsl(var(--muted) / 0.62);
|
||||
}
|
||||
|
||||
.terminal-bar span {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 999px;
|
||||
background: var(--brand);
|
||||
}
|
||||
|
||||
.terminal-bar span:nth-child(2) {
|
||||
background: var(--green);
|
||||
}
|
||||
|
||||
.terminal-bar span:nth-child(3) {
|
||||
background: var(--blue);
|
||||
}
|
||||
|
||||
.terminal pre,
|
||||
.step pre {
|
||||
padding: 18px;
|
||||
background: hsl(339 66% 4%);
|
||||
color: hsl(0 0% 100%);
|
||||
}
|
||||
|
||||
.product-shot {
|
||||
width: 100%;
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.trust-strip {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
width: min(var(--content), calc(100vw - 32px));
|
||||
margin: -28px auto 0;
|
||||
padding: 18px;
|
||||
background: hsl(var(--background) / 0.88);
|
||||
border: 1px solid var(--line);
|
||||
border-radius: var(--radius);
|
||||
}
|
||||
|
||||
.trust-strip span {
|
||||
display: inline-flex;
|
||||
min-height: 34px;
|
||||
align-items: center;
|
||||
padding: 0 13px;
|
||||
background: var(--soft);
|
||||
border-radius: 999px;
|
||||
color: var(--muted-text);
|
||||
font-size: 0.9rem;
|
||||
font-weight: 720;
|
||||
}
|
||||
|
||||
.split {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(240px, 0.54fr) minmax(0, 1fr);
|
||||
gap: 36px;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.feature-grid,
|
||||
.audience-grid,
|
||||
.data-grid,
|
||||
.project-grid,
|
||||
.doc-link-grid {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.feature-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.feature-grid article,
|
||||
.data-grid article,
|
||||
.project-grid article {
|
||||
padding: 22px;
|
||||
}
|
||||
|
||||
.feature-grid p,
|
||||
.audience-card p,
|
||||
.data-grid p,
|
||||
.project-grid p,
|
||||
.docs-band p,
|
||||
.compact-docs p,
|
||||
.site-footer p {
|
||||
color: var(--muted-text);
|
||||
}
|
||||
|
||||
.section-heading {
|
||||
max-width: 780px;
|
||||
margin-bottom: 34px;
|
||||
}
|
||||
|
||||
.audience-grid {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.audience-card {
|
||||
display: flex;
|
||||
min-height: 100%;
|
||||
flex-direction: column;
|
||||
padding: 26px;
|
||||
}
|
||||
|
||||
.audience-card ul {
|
||||
margin: auto 0 0;
|
||||
padding-left: 19px;
|
||||
color: var(--muted-text);
|
||||
}
|
||||
|
||||
.audience-card li + li {
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
.install-section {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 0.72fr) minmax(360px, 1fr);
|
||||
gap: 34px;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
.install-copy {
|
||||
position: sticky;
|
||||
top: 112px;
|
||||
}
|
||||
|
||||
.command-card {
|
||||
display: grid;
|
||||
gap: 1px;
|
||||
overflow: hidden;
|
||||
background: var(--line);
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.step {
|
||||
display: grid;
|
||||
grid-template-columns: 46px minmax(0, 1fr);
|
||||
gap: 16px;
|
||||
padding: 22px;
|
||||
background: var(--panel);
|
||||
}
|
||||
|
||||
.step > span {
|
||||
display: inline-flex;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: var(--brand);
|
||||
border-radius: 999px;
|
||||
color: var(--brand-text);
|
||||
font-weight: 820;
|
||||
}
|
||||
|
||||
.step h3 {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.step pre {
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.compact-docs {
|
||||
padding: 34px;
|
||||
}
|
||||
|
||||
.doc-link-grid {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.doc-link-grid a {
|
||||
display: flex;
|
||||
min-height: 48px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10px 12px;
|
||||
background: var(--soft);
|
||||
border: 1px solid hsl(var(--border) / 0.72);
|
||||
border-radius: var(--radius);
|
||||
color: var(--text);
|
||||
font-weight: 720;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.doc-link-grid a:hover {
|
||||
border-color: var(--brand);
|
||||
color: var(--brand);
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.data-grid {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.ecosystem {
|
||||
padding-top: 72px;
|
||||
}
|
||||
|
||||
.project-grid {
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.project-grid article {
|
||||
display: flex;
|
||||
min-height: 230px;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.project-grid article div {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
margin-top: auto;
|
||||
}
|
||||
|
||||
.project-grid article a {
|
||||
display: inline-flex;
|
||||
min-height: 34px;
|
||||
align-items: center;
|
||||
padding: 0 11px;
|
||||
background: var(--soft);
|
||||
border-radius: 999px;
|
||||
font-weight: 740;
|
||||
}
|
||||
|
||||
.docs-band {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 0.8fr) minmax(360px, 1fr);
|
||||
gap: 28px;
|
||||
align-items: center;
|
||||
padding: 34px;
|
||||
}
|
||||
|
||||
.docs-band .doc-link-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.site-footer {
|
||||
position: relative;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(160px, auto) minmax(220px, 1fr) auto;
|
||||
gap: 24px;
|
||||
align-items: center;
|
||||
width: min(var(--content), calc(100vw - 32px));
|
||||
margin: 0 auto;
|
||||
padding: 38px 0 48px;
|
||||
border-top: 1px solid var(--line);
|
||||
}
|
||||
|
||||
.site-footer p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.site-footer a {
|
||||
color: var(--muted-text);
|
||||
font-weight: 650;
|
||||
}
|
||||
|
||||
@media (max-width: 980px) {
|
||||
.site-header,
|
||||
.hero,
|
||||
.split,
|
||||
.install-section,
|
||||
.docs-band,
|
||||
.site-footer {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.site-header {
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.hero {
|
||||
min-height: auto;
|
||||
}
|
||||
|
||||
.install-copy {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.audience-grid,
|
||||
.data-grid,
|
||||
.project-grid {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
|
||||
.doc-link-grid {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 680px) {
|
||||
.site-header,
|
||||
.section,
|
||||
.trust-strip,
|
||||
.site-footer {
|
||||
width: min(358px, calc(100vw - 32px));
|
||||
margin-left: 16px;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 62px 0;
|
||||
}
|
||||
|
||||
.site-header {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.site-header nav {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 2.55rem;
|
||||
line-height: 1.02;
|
||||
}
|
||||
|
||||
.hero {
|
||||
padding-top: 36px;
|
||||
}
|
||||
|
||||
.hero-panel,
|
||||
.install-section {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.feature-grid,
|
||||
.audience-grid,
|
||||
.data-grid,
|
||||
.project-grid,
|
||||
.doc-link-grid,
|
||||
.docs-band .doc-link-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.step {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.command-card,
|
||||
.compact-docs,
|
||||
.docs-band,
|
||||
.audience-card {
|
||||
padding: 22px;
|
||||
}
|
||||
|
||||
.terminal pre,
|
||||
.step pre {
|
||||
padding: 14px;
|
||||
}
|
||||
|
||||
code {
|
||||
font-size: 0.82rem;
|
||||
}
|
||||
}
|
||||
@ -179,7 +179,7 @@ ignore = ["E731", "E303", "E266", "E241", "E222"]
|
||||
|
||||
[tool.codespell]
|
||||
ignore-words-list = "abx,archivebox,adminsnapshots,bu,wit,dont,cant,wont,havent,thats,shouldnt,doesnt,doenst,re-use,re-used,re-using,re-usable"
|
||||
skip = "*.json,*.min.js,*.min.css,uv.lock,old/*,website/*"
|
||||
skip = "*.json,*.min.js,*.min.css,uv.lock,old/*,publicsite/*"
|
||||
|
||||
[tool.pytest.ini_options]
|
||||
testpaths = [ "archivebox/tests" ]
|
||||
|
||||
@ -1 +0,0 @@
|
||||
../README.md
|
||||
@ -1,3 +0,0 @@
|
||||
production_url: https://archivebox.io
|
||||
theme: jekyll-theme-merlot
|
||||
# Github Pages static site settings for https://archivebox.io
|
||||
@ -1,5 +0,0 @@
|
||||
# assets/
|
||||
|
||||
This folder contains assets used by the Jekyll Static Site Generator for ArchiveBox.io.
|
||||
|
||||
It cannot be moved or renamed or the custom CSS on ArchiveBox.io will break.
|
||||
@ -1,50 +0,0 @@
|
||||
---
|
||||
---
|
||||
|
||||
@import "{{ site.theme }}";
|
||||
|
||||
div.shell {
|
||||
width: 80%;
|
||||
max-width: 1300px;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
span.banner-fix {
|
||||
width: 80%;
|
||||
max-width: 1300px;
|
||||
min-width: 300px;
|
||||
}
|
||||
|
||||
header h1 {
|
||||
background-color: #aa1f55;
|
||||
padding-bottom: 15px;
|
||||
font-weight: 200px;
|
||||
}
|
||||
header h2 {
|
||||
background-color: #aa1f55;
|
||||
font-family: 'Open Sans';
|
||||
}
|
||||
|
||||
#main_content div[align=center] h1 {
|
||||
display: none;
|
||||
}
|
||||
#main_content img {
|
||||
box-shadow: 4px 4px 4px rgba(0,0,0,0.1);
|
||||
border-radius: 8px;
|
||||
border: 0px;
|
||||
vertical-align: top;
|
||||
}
|
||||
#main_content em img {
|
||||
display: block;
|
||||
margin-top: -83px;
|
||||
padding: 0px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
#main_content img[alt=comparison] {
|
||||
margin: 25px;
|
||||
}
|
||||
|
||||
#forkme_banner {
|
||||
opacity: 0.1;
|
||||
}
|
||||
@ -1,47 +0,0 @@
|
||||
@layer base {
|
||||
:root {
|
||||
--background: 339 49% 100%;
|
||||
--foreground: 339 66% 4%;
|
||||
--muted: 99 20% 93%;
|
||||
--muted-foreground: 99 9% 39%;
|
||||
--popover: 339 49% 100%;
|
||||
--popover-foreground: 339 66% 4%;
|
||||
--card: 339 49% 100%;
|
||||
--card-foreground: 339 66% 4%;
|
||||
--border: 339 7% 94%;
|
||||
--input: 339 7% 94%;
|
||||
--primary: 339 48% 41%;
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: 99 48% 41%;
|
||||
--secondary-foreground: 0 0% 100%;
|
||||
--accent: 219 48% 41%;
|
||||
--accent-foreground: 0 0% 100%;
|
||||
--destructive: 19 85% 36%;
|
||||
--destructive-foreground: 0 0% 100%;
|
||||
--ring: 339 48% 41%;
|
||||
--radius: 0.5rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--background: 339 32% 4%;
|
||||
--foreground: 339 18% 99%;
|
||||
--muted: 99 20% 7%;
|
||||
--muted-foreground: 99 9% 61%;
|
||||
--popover: 339 32% 4%;
|
||||
--popover-foreground: 339 18% 99%;
|
||||
--card: 339 32% 4%;
|
||||
--card-foreground: 339 18% 99%;
|
||||
--border: 339 7% 12%;
|
||||
--input: 339 7% 12%;
|
||||
--primary: 339 48% 41%;
|
||||
--primary-foreground: 0 0% 100%;
|
||||
--secondary: 99 48% 41%;
|
||||
--secondary-foreground: 0 0% 100%;
|
||||
--accent: 219 48% 41%;
|
||||
--accent-foreground: 0 0% 100%;
|
||||
--destructive: 19 85% 53%;
|
||||
--destructive-foreground: 0 0% 0%;
|
||||
--ring: 339 48% 41%;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user