Brandon Lucas
7e76acab18
Website rebuilt from scratch based on analysis of 11 beloved language websites (Elm, Zig, Gleam, Swift, Kotlin, Haskell, OCaml, Crystal, Roc, Rust, Go). New website structure: - Homepage with hero, playground, three pillars, install guide - Language Tour with interactive lessons (hello world, types, effects) - Examples cookbook with categorized sidebar - API documentation index - Installation guide (Nix and source) - Sleek/noble design (black/gold, serif typography) Also includes: - New stdlib/json.lux module for JSON serialization - Enhanced stdlib/http.lux with middleware and routing - New string functions (charAt, indexOf, lastIndexOf, repeat) - LSP improvements (rename, signature help, formatting) - Package manager transitive dependency resolution - Updated documentation for effects and stdlib - New showcase example (task_manager.lux) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
227 lines
7.3 KiB
HTML
227 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Install Lux</title>
|
|
<meta name="description" content="Install the Lux programming language.">
|
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>✨</text></svg>">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&family=Playfair+Display:wght@400;600;700&family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="../static/style.css">
|
|
<style>
|
|
.install-container {
|
|
max-width: 800px;
|
|
margin: 0 auto;
|
|
padding: var(--space-xl) var(--space-lg);
|
|
}
|
|
|
|
.install-header {
|
|
text-align: center;
|
|
margin-bottom: var(--space-2xl);
|
|
}
|
|
|
|
.install-method {
|
|
background: var(--bg-glass);
|
|
border: 1px solid var(--border-subtle);
|
|
border-radius: 8px;
|
|
padding: var(--space-xl);
|
|
margin-bottom: var(--space-xl);
|
|
}
|
|
|
|
.install-method.recommended {
|
|
border-color: var(--border-gold);
|
|
}
|
|
|
|
.install-method h2 {
|
|
text-align: left;
|
|
margin-bottom: var(--space-sm);
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--space-sm);
|
|
}
|
|
|
|
.install-method .badge {
|
|
font-size: 0.7rem;
|
|
padding: 0.2rem 0.5rem;
|
|
}
|
|
|
|
.install-method p {
|
|
margin-bottom: var(--space-lg);
|
|
}
|
|
|
|
.install-code {
|
|
background: var(--code-bg);
|
|
border: 1px solid var(--code-border);
|
|
border-radius: 6px;
|
|
padding: var(--space-md);
|
|
margin-bottom: var(--space-md);
|
|
position: relative;
|
|
}
|
|
|
|
.install-code pre {
|
|
font-family: var(--font-code);
|
|
font-size: 0.9rem;
|
|
margin: 0;
|
|
overflow-x: auto;
|
|
}
|
|
|
|
.install-code .copy-btn {
|
|
position: absolute;
|
|
top: var(--space-sm);
|
|
right: var(--space-sm);
|
|
padding: var(--space-xs) var(--space-sm);
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
.verify {
|
|
margin-top: var(--space-lg);
|
|
padding-top: var(--space-lg);
|
|
border-top: 1px solid var(--border-subtle);
|
|
}
|
|
|
|
.verify h3 {
|
|
color: var(--text-primary);
|
|
font-size: 1rem;
|
|
margin-bottom: var(--space-md);
|
|
}
|
|
|
|
.next-steps {
|
|
text-align: center;
|
|
margin-top: var(--space-2xl);
|
|
}
|
|
|
|
.next-steps h2 {
|
|
margin-bottom: var(--space-lg);
|
|
}
|
|
|
|
.next-steps-links {
|
|
display: flex;
|
|
gap: var(--space-md);
|
|
justify-content: center;
|
|
flex-wrap: wrap;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<nav>
|
|
<a href="/" class="logo">Lux</a>
|
|
<ul class="nav-links" id="nav-links">
|
|
<li><a href="/install" class="active">Install</a></li>
|
|
<li><a href="/tour/">Tour</a></li>
|
|
<li><a href="/examples/">Examples</a></li>
|
|
<li><a href="/docs/">Docs</a></li>
|
|
<li><a href="/play">Play</a></li>
|
|
<li><a href="https://git.qrty.ink/blu/lux" class="nav-source">Source</a></li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<main class="install-container">
|
|
<header class="install-header">
|
|
<h1>Install Lux</h1>
|
|
<p>Get Lux running on your machine in under a minute.</p>
|
|
</header>
|
|
|
|
<div class="install-method recommended">
|
|
<h2>
|
|
With Nix
|
|
<span class="badge">Recommended</span>
|
|
</h2>
|
|
<p>The easiest way to run Lux. One command, zero dependencies. Works on Linux and macOS.</p>
|
|
|
|
<div class="install-code">
|
|
<pre>nix run git+https://git.qrty.ink/blu/lux</pre>
|
|
<button class="btn copy-btn" data-copy="nix run git+https://git.qrty.ink/blu/lux">Copy</button>
|
|
</div>
|
|
|
|
<p style="font-size: 0.9rem; color: var(--text-muted);">
|
|
Don't have Nix? Install it with: <code>curl -L https://nixos.org/nix/install | sh</code>
|
|
</p>
|
|
|
|
<div class="verify">
|
|
<h3>Verify Installation</h3>
|
|
<div class="install-code">
|
|
<pre>lux --version
|
|
# Lux 0.1.0</pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="install-method">
|
|
<h2>From Source</h2>
|
|
<p>Build Lux from source using Cargo. Requires Rust toolchain.</p>
|
|
|
|
<div class="install-code">
|
|
<pre>git clone https://git.qrty.ink/blu/lux
|
|
cd lux
|
|
cargo build --release</pre>
|
|
<button class="btn copy-btn" data-copy="git clone https://git.qrty.ink/blu/lux && cd lux && cargo build --release">Copy</button>
|
|
</div>
|
|
|
|
<p>The binary will be at <code>./target/release/lux</code>. Add it to your PATH:</p>
|
|
|
|
<div class="install-code">
|
|
<pre>export PATH="$PWD/target/release:$PATH"</pre>
|
|
</div>
|
|
|
|
<div class="verify">
|
|
<h3>Verify Installation</h3>
|
|
<div class="install-code">
|
|
<pre>./target/release/lux --version
|
|
# Lux 0.1.0</pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="install-method">
|
|
<h2>Development with Nix</h2>
|
|
<p>Enter a development shell with all dependencies available.</p>
|
|
|
|
<div class="install-code">
|
|
<pre>git clone https://git.qrty.ink/blu/lux
|
|
cd lux
|
|
nix develop</pre>
|
|
</div>
|
|
|
|
<p>Inside the shell, you can run all development commands:</p>
|
|
|
|
<div class="install-code">
|
|
<pre>cargo build # Build
|
|
cargo test # Run tests
|
|
cargo run # Run interpreter</pre>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="next-steps">
|
|
<h2>Next Steps</h2>
|
|
<div class="next-steps-links">
|
|
<a href="/tour/" class="btn btn-primary">Take the Tour</a>
|
|
<a href="/examples/" class="btn btn-secondary">Browse Examples</a>
|
|
<a href="/docs/" class="btn btn-tertiary">Read the Docs</a>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<script>
|
|
document.querySelectorAll('.copy-btn').forEach(function(btn) {
|
|
btn.addEventListener('click', async function() {
|
|
const text = btn.dataset.copy;
|
|
try {
|
|
await navigator.clipboard.writeText(text);
|
|
const original = btn.textContent;
|
|
btn.textContent = 'Copied!';
|
|
btn.classList.add('copied');
|
|
setTimeout(function() {
|
|
btn.textContent = original;
|
|
btn.classList.remove('copied');
|
|
}, 2000);
|
|
} catch (e) {
|
|
console.error('Failed to copy:', e);
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|