From c074f95ae918e02dc2ab400e775095651984237a Mon Sep 17 00:00:00 2001 From: seanseannery Date: Sat, 7 Mar 2026 01:05:57 -0800 Subject: [PATCH 1/3] feat: add GitHub Pages deploy workflow and update docs (Issue#5) --- .github/workflows/pages.yml | 33 +++++++++++++++++++++++++++++++++ AGENTS.md | 1 + README.md | 2 ++ 3 files changed, 36 insertions(+) create mode 100644 .github/workflows/pages.yml diff --git a/.github/workflows/pages.yml b/.github/workflows/pages.yml new file mode 100644 index 0000000..1657139 --- /dev/null +++ b/.github/workflows/pages.yml @@ -0,0 +1,33 @@ +name: Deploy GitHub Pages + +on: + push: + branches: [main] + paths: ['site/**'] + workflow_dispatch: + +permissions: + contents: read + pages: write + id-token: write + +concurrency: + group: pages + cancel-in-progress: false + +jobs: + deploy: + name: Deploy + runs-on: ubuntu-latest + environment: + name: github-pages + url: ${{ steps.deployment.outputs.page_url }} + steps: + - uses: actions/checkout@v4 + - uses: actions/configure-pages@v5 + - uses: actions/upload-pages-artifact@v3 + with: + path: site/ + - name: Deploy to GitHub Pages + id: deployment + uses: actions/deploy-pages@v4 diff --git a/AGENTS.md b/AGENTS.md index 62789bf..d3d6e79 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -31,6 +31,7 @@ ├── .githooks/ Local git hooks: pre-push (lint+test), commit-msg (conventional commit format) │ ├── Formula/ Homebrew tap formula — auto-updated by release.yml on each release + ├── site/ GitHub Pages static landing page (HTML + CSS) — deployed by pages.yml ├── go.mod Module declaration (sean_seannery/opsfile, Go 1.25+, no external deps) ├── AGENTS.md This file — source of truth for agentic context ├── CLAUDE.md Links to AGENTS.md (Claude does not natively support AGENTS.md) diff --git a/README.md b/README.md index 5414650..a9faf77 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,7 @@ # opsfile (aka `ops`) +> **Website:** [seanseannery.github.io/opsfile](https://seanseannery.github.io/opsfile) + ## What does `ops` do? It's a cli tool, essentially like `make` and `makefiles` but for sharing and executing live-operations / on-call commands for the repo. Simply create an `Opsfile` in your repo with common on-call commands your team uses and run it with `ops [env] `. From 7f2118a21b06058aaa8f911dc3a2153c5a4426e6 Mon Sep 17 00:00:00 2001 From: seanseannery Date: Sat, 7 Mar 2026 01:06:17 -0800 Subject: [PATCH 2/3] feat: add GitHub Pages Solarized Dark CSS stylesheet (Issue#5) --- site/style.css | 433 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 433 insertions(+) create mode 100644 site/style.css diff --git a/site/style.css b/site/style.css new file mode 100644 index 0000000..9b999e5 --- /dev/null +++ b/site/style.css @@ -0,0 +1,433 @@ +/* Solarized Dark — GitHub Pages stylesheet for ops CLI */ + +/* ─── Color Palette ─────────────────────────────────────────── */ +:root { + --bg: #002b36; /* base03 - page background */ + --bg-hl: #073642; /* base02 - card/code backgrounds */ + --bg-hl2: #0a4050; /* slightly lighter, hover states */ + --subtle: #586e75; /* base01 - borders, muted text */ + --muted: #657b83; /* base00 */ + --body: #839496; /* base0 - body text */ + --emphasis: #93a1a1; /* base1 - headings, emphasis */ + --bright: #fdf6e3; /* base3 - high contrast text */ + --yellow: #b58900; + --orange: #cb4b16; + --red: #dc322f; + --cyan: #2aa198; + --blue: #268bd2; + --green: #859900; +} + +/* ─── Global ─────────────────────────────────────────────────── */ +* { + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; +} + +body { + background: var(--bg); + color: var(--body); + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; + margin: 0; + padding: 0; +} + +a { + color: var(--blue); + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +.container { + max-width: 900px; + margin: 0 auto; + padding: 0 24px; +} + +/* ─── Header ─────────────────────────────────────────────────── */ +.site-header { + background: var(--bg-hl); + border-bottom: 1px solid var(--subtle); + position: sticky; + top: 0; + z-index: 100; + padding: 14px 0; +} + +.site-header .container { + display: flex; + align-items: center; + justify-content: space-between; +} + +.logo { + font-weight: bold; + font-size: 1.4rem; + color: var(--cyan); + font-family: monospace; + letter-spacing: -1px; + text-decoration: none; +} + +.logo:hover { + text-decoration: none; +} + +.site-nav a { + color: var(--body); + margin-left: 20px; + font-size: 0.9rem; + text-decoration: none; +} + +.site-nav a:hover { + color: var(--cyan); + text-decoration: none; +} + +/* ─── Hero ───────────────────────────────────────────────────── */ +.hero { + padding: 80px 0 60px; + text-align: center; +} + +.hero h1 { + font-size: 4rem; + color: var(--cyan); + font-family: monospace; + margin-bottom: 8px; + margin-top: 0; +} + +.tagline { + font-size: 1.4rem; + color: var(--emphasis); + margin-bottom: 8px; +} + +.subtitle { + color: var(--muted); + font-size: 1rem; + margin-bottom: 32px; +} + +.cta-buttons { + display: flex; + gap: 12px; + justify-content: center; + flex-wrap: wrap; +} + +.btn-primary, +.btn-secondary { + display: inline-block; + padding: 10px 24px; + border-radius: 4px; + font-family: monospace; + text-decoration: none; + cursor: pointer; + font-size: 1rem; + transition: background 0.2s, border-color 0.2s, color 0.2s; +} + +.btn-primary { + background: var(--cyan); + color: var(--bg); + font-weight: bold; + border: none; +} + +.btn-primary:hover { + background: var(--blue); + text-decoration: none; + color: var(--bg); +} + +.btn-secondary { + border: 2px solid var(--subtle); + color: var(--emphasis); + background: none; +} + +.btn-secondary:hover { + border-color: var(--cyan); + color: var(--cyan); + text-decoration: none; +} + +/* ─── Terminal Demo ──────────────────────────────────────────── */ +#terminal-demo { + max-width: 640px; + margin: 40px auto; + background: var(--bg-hl); + border-radius: 8px; + overflow: hidden; + box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5); +} + +.terminal-bar { + background: var(--subtle); + padding: 10px 14px; + display: flex; + align-items: center; + gap: 6px; +} + +.terminal-dot { + width: 12px; + height: 12px; + border-radius: 50%; +} + +.terminal-dot:nth-child(1) { background: var(--red); } +.terminal-dot:nth-child(2) { background: var(--yellow); } +.terminal-dot:nth-child(3) { background: var(--green); } + +.terminal-body { + padding: 20px; + font-family: monospace; + font-size: 0.9rem; + line-height: 1.8; +} + +.line { + opacity: 0; + animation: appear 0.3s ease forwards; +} + +.line:nth-child(1) { animation-delay: 0.5s; } +.line:nth-child(2) { animation-delay: 1.5s; } +.line:nth-child(3) { animation-delay: 2.5s; } +.line:nth-child(4) { animation-delay: 3.5s; } + +.prompt { color: var(--green); } +.cmd { color: var(--bright); } +.out { color: var(--muted); } + +.cursor { + display: inline-block; + width: 8px; + height: 1.1em; + background: var(--cyan); + vertical-align: text-bottom; + animation: blink 1s step-end infinite; +} + +@keyframes appear { + from { opacity: 0; transform: translateY(4px); } + to { opacity: 1; transform: none; } +} + +@keyframes blink { + 0%, 100% { opacity: 1; } + 50% { opacity: 0; } +} + +/* ─── Install Section ────────────────────────────────────────── */ +#install, +.install-section { + padding: 64px 0; + background: var(--bg); +} + +.install-section h2, +#install h2 { + color: var(--emphasis); + margin-bottom: 32px; + font-family: monospace; +} + +.install-tabs { + display: flex; + gap: 4px; + margin-bottom: 0; + border-bottom: 2px solid var(--bg-hl); +} + +.tab-btn { + background: none; + border: none; + color: var(--muted); + padding: 10px 20px; + cursor: pointer; + font-family: monospace; + font-size: 1rem; + border-bottom: 2px solid transparent; + margin-bottom: -2px; + transition: color 0.2s, border-color 0.2s; +} + +.tab-btn:hover { + color: var(--emphasis); +} + +.tab-btn.active { + color: var(--cyan); + border-bottom-color: var(--cyan); +} + +.tab-content { + display: none; +} + +.tab-content.active { + display: block; +} + +.code-block { + background: var(--bg-hl); + border-radius: 0 4px 4px 4px; + padding: 20px; +} + +pre > code { + font-family: monospace; + font-size: 0.9rem; + color: var(--bright); + white-space: pre-wrap; + word-break: break-all; +} + +/* ─── Usage Section ──────────────────────────────────────────── */ +#usage, +.usage-section { + padding: 64px 0; + background: var(--bg-hl); +} + +.usage-section h2, +.usage-section h3, +#usage h2, +#usage h3 { + color: var(--emphasis); + font-family: monospace; +} + +.opsfile-example { + background: var(--bg); + border-radius: 4px; + padding: 20px; + border-left: 3px solid var(--cyan); +} + +.opsfile-example code { + color: var(--body); + font-size: 0.85rem; +} + +/* ─── Features Section ───────────────────────────────────────── */ +.features-section { + padding: 64px 0; + background: var(--bg); + text-align: center; +} + +.features-section h2 { + color: var(--emphasis); + font-family: monospace; + margin-bottom: 40px; +} + +.feature-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 24px; +} + +.feature-card { + background: var(--bg-hl); + border-radius: 6px; + padding: 24px; + border: 1px solid var(--subtle); + transition: border-color 0.2s, transform 0.2s; +} + +.feature-card:hover { + border-color: var(--cyan); + transform: translateY(-2px); +} + +.feature-icon { + font-size: 2rem; + margin-bottom: 12px; +} + +.feature-title { + color: var(--cyan); + font-family: monospace; + font-weight: bold; + margin-bottom: 8px; +} + +/* ─── Links Section ──────────────────────────────────────────── */ +.links-section { + padding: 48px 0; + background: var(--bg-hl); + text-align: center; +} + +.links-section h2 { + color: var(--emphasis); + font-family: monospace; + margin-bottom: 32px; +} + +.links-grid { + display: flex; + justify-content: center; + gap: 20px; + flex-wrap: wrap; +} + +.link-card { + background: var(--bg); + border: 1px solid var(--subtle); + border-radius: 6px; + padding: 20px 32px; + color: var(--blue); + font-family: monospace; + text-decoration: none; + transition: border-color 0.2s, color 0.2s; +} + +.link-card:hover { + border-color: var(--cyan); + color: var(--cyan); + text-decoration: none; +} + +/* ─── Footer ─────────────────────────────────────────────────── */ +.site-footer { + background: var(--bg); + border-top: 1px solid var(--subtle); + padding: 24px 0; + text-align: center; + color: var(--subtle); + font-size: 0.85rem; +} + +.site-footer a { + color: var(--subtle); + text-decoration: none; +} + +.site-footer a:hover { + color: var(--cyan); + text-decoration: none; +} + +/* ─── Responsive ─────────────────────────────────────────────── */ +@media (max-width: 600px) { + .hero h1 { font-size: 2.5rem; } + .cta-buttons { flex-direction: column; align-items: center; } + #terminal-demo { margin: 24px 0; font-size: 0.8rem; } + .feature-grid { grid-template-columns: 1fr; } + .links-grid { flex-direction: column; align-items: center; } + .site-nav { display: none; } +} From 00931d500487bd8e0cf7e39d525525f37166bd82 Mon Sep 17 00:00:00 2001 From: seanseannery Date: Sat, 7 Mar 2026 01:06:18 -0800 Subject: [PATCH 3/3] feat: add GitHub Pages HTML landing page (Issue#5) --- site/index.html | 222 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 222 insertions(+) create mode 100644 site/index.html diff --git a/site/index.html b/site/index.html new file mode 100644 index 0000000..6bbc61c --- /dev/null +++ b/site/index.html @@ -0,0 +1,222 @@ + + + + + + + ops — live operations CLI + + + + + + + + +
+
+

ops

+

like make, but for live operations

+

Create an Opsfile. Run ops [env] [command]. Done.

+ + + +
+
+ + + +
+
+
+ $ ops prod tail-logs +
+
+ Fetching logs from /aws/ecs/my-service-prod ... +
+
+ $ ops prod check-alarms +
+
+ No alarms in ALARM state. All clear. +
+ +
+
+
+
+ + +
+
+

Installation

+
+ + + +
+ +
+
brew tap seanseannery/opsfile https://github.com/seanseannery/opsfile
+brew install seanseannery/opsfile/opsfile
+
+ +
+
npm install -g github:seanseannery/opsfile
+
+ +
+
curl -fsSL https://raw.githubusercontent.com/seanseannery/opsfile/main/install/install.sh | bash
+
+
+
+ + +
+
+

Getting Started

+ +

Step 1: Create an Opsfile

+

Create an Opsfile in your repo root. It uses Makefile-style syntax:

+
+
# Variables — prefix with environment name to scope them
+prod_AWS_ACCOUNT=1234567
+preprod_AWS_ACCOUNT=8765431
+
+# Commands — define per-environment shell lines
+# Use "default" as a fallback when env-specific block is absent
+tail-logs:
+    default:
+        aws cloudwatch logs --tail $(AWS_ACCOUNT)
+    local:
+        docker logs myapp --follow
+
+list-instance-ips:
+    prod:
+        aws ec2 --list-instances
+    preprod:
+        aws ecs cluster --list-instances
+
+# Shell environment variables are injected automatically using the same $(VAR) syntax.
+# No declaration needed — if ops can't find it in the Opsfile, it falls back to env variables
+show-profile:
+    default:
+        echo "Using AWS profile: $(AWS_PROFILE)"
+
+ +

Step 2: Run ops commands

+

Run commands with the following syntax:

+
+
ops [flags] <your_environment> <your_command> [any-command-args]
+
+ + + + + + + + + + + + + + + + +
FlagShortDescription
--directory <path>-D <path>Use the Opsfile in the given directory
--dry-run-dPrint resolved commands without executing
--silent-sExecute commands without printing output
--version-vPrint the ops version and exit
--help-hShow usage information and exit
+ +

Examples:

+
+
ops preprod instance-count
+ops prod open-dashboard
+ops local logs
+ops prod k8s -namespace myspace
+
+
+
+ + +
+
+

Why use it?

+
+
+
+
Less Stress
+

Quickly find the right command during a live outage

+
+
+
🤖
+
Less AI tokens
+

Let agents run ops scripts instead of googling commands

+
+
+
📖
+
Knowledge Sharing
+

Share runbooks with your team as code

+
+
+
📦
+
Encapsulation
+

Keep your Makefile focused on CI/CD

+
+
+
+
+ + + + + +
+
+

© 2025 opsfile · MIT License · GitHub

+
+
+ + + + +