From 6359edaf2060b5b048595024f43a26af99bfa023 Mon Sep 17 00:00:00 2001 From: Evan Jarrett Date: Mon, 13 Oct 2025 20:59:14 -0500 Subject: [PATCH] add hero banner, fix up css styles --- CLAUDE.md | 2 - deploy/README.md | 4 +- pkg/appview/handlers/home.go | 2 +- pkg/appview/static/css/style.css | 329 ++++++++++++++++++++++- pkg/appview/templates/pages/home.html | 49 ++++ pkg/appview/templates/pages/install.html | 82 +----- pkg/hold/authorization.go | 16 ++ pkg/hold/registration.go | 48 +++- 8 files changed, 423 insertions(+), 109 deletions(-) diff --git a/CLAUDE.md b/CLAUDE.md index 1bcc47d..4b87d07 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -492,8 +492,6 @@ See `.env.hold.example` for all available options. Key environment variables: **OAuth implementation:** - Client (`pkg/auth/oauth/client.go`) encapsulates all OAuth configuration -- Uses `authelia.com/client/oauth2` for PAR support -- DPoP proofs generated with `github.com/AxisCommunications/go-dpop` (auto-handles JWK) - Token validation via `com.atproto.server.getSession` ensures no trust in client-provided identity - All ATCR components use standardized `/auth/oauth/callback` path - Client ID generation (localhost query-based vs production metadata URL) handled internally diff --git a/deploy/README.md b/deploy/README.md index ef2a3b9..19247d0 100644 --- a/deploy/README.md +++ b/deploy/README.md @@ -466,5 +466,5 @@ docker run --rm \ ## Support - Documentation: https://tangled.org/@evan.jarrett.net/at-container-registry -- Issues: https://github.com/your-org/atcr.io/issues -- Bluesky: @yourhandle.bsky.social +- Issues: https://tangled.org/@evan.jarrett.net/at-container-registry/issues +- Bluesky: @evan.jarrett.net diff --git a/pkg/appview/handlers/home.go b/pkg/appview/handlers/home.go index 331839c..f916b28 100644 --- a/pkg/appview/handlers/home.go +++ b/pkg/appview/handlers/home.go @@ -60,7 +60,7 @@ type RecentPushesHandler struct { } func (h *RecentPushesHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) { - limit := 50 + limit := 20 offset := 0 if o := r.URL.Query().Get("offset"); o != "" { diff --git a/pkg/appview/static/css/style.css b/pkg/appview/static/css/style.css index 4bc6ca8..027efa6 100644 --- a/pkg/appview/static/css/style.css +++ b/pkg/appview/static/css/style.css @@ -1,8 +1,13 @@ :root { --primary: #0066cc; + --primary-dark: #0052a3; --secondary: #6c757d; --success: #28a745; + --success-bg: #d4edda; + --warning: #ffc107; + --warning-bg: #fff3cd; --danger: #dc3545; + --danger-bg: #f8d7da; --bg: #ffffff; --fg: #1a1a1a; --border-dark: #666; @@ -10,6 +15,17 @@ --code-bg: #f5f5f5; --hover-bg: #f9f9f9; --star: #fbbf24; + + /* Hero section colors */ + --hero-bg-start: #f8f9fa; + --hero-bg-end: #e9ecef; + + /* Terminal colors */ + --terminal-bg: var(--fg); + --terminal-header-bg: #2d2d2d; + --terminal-text: var(--border); + --terminal-prompt: #4ec9b0; + --terminal-comment: #6a9955; } * { @@ -694,23 +710,26 @@ button:hover, .btn:hover, .btn-primary:hover, .btn-secondary:hover { padding: 1rem; } -/* Status Messages */ +/* Status Messages / Callouts */ +.note { + background: var(--warning-bg); + border-left: 4px solid var(--warning); + padding: 1rem; + margin: 1rem 0; +} + .success { - color: var(--success); - padding: 0.5rem; - background: #d4edda; - border: 1px solid #c3e6cb; - border-radius: 4px; - margin-top: 1rem; + background: var(--success-bg); + border-left: 4px solid var(--success); + padding: 1rem; + margin: 1rem 0; } .error { - color: var(--danger); - padding: 0.5rem; - background: #f8d7da; - border: 1px solid #f5c6cb; - border-radius: 4px; - margin-top: 1rem; + background: var(--danger-bg); + border-left: 4px solid var(--danger); + padding: 1rem; + margin: 1rem 0; } /* Load More Button */ @@ -1167,6 +1186,248 @@ button:hover, .btn:hover, .btn-primary:hover, .btn-secondary:hover { color: var(--fg); } +/* Hero Section */ +.hero-section { + background: linear-gradient(135deg, var(--hero-bg-start) 0%, var(--hero-bg-end) 100%); + padding: 4rem 2rem; + border-bottom: 1px solid var(--border); +} + +.hero-content { + max-width: 900px; + margin: 0 auto; + text-align: center; +} + +.hero-title { + font-size: 3rem; + font-weight: 700; + margin-bottom: 1.5rem; + color: var(--fg); + line-height: 1.2; +} + +.hero-subtitle { + font-size: 1.2rem; + color: var(--border-dark); + margin-bottom: 3rem; + line-height: 1.6; +} + +.hero-terminal { + max-width: 600px; + margin: 0 auto 2.5rem; + background: var(--terminal-bg); + border-radius: 8px; + box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15); + overflow: hidden; +} + +.terminal-header { + background: var(--terminal-header-bg); + padding: 0.75rem 1rem; + display: flex; + gap: 0.5rem; + align-items: center; +} + +.terminal-dot { + width: 12px; + height: 12px; + border-radius: 50%; + background: var(--border-dark); +} + +.terminal-dot:nth-child(1) { + background: #ff5f56; +} + +.terminal-dot:nth-child(2) { + background: #ffbd2e; +} + +.terminal-dot:nth-child(3) { + background: #27c93f; +} + +.terminal-content { + padding: 1.5rem; + margin: 0; + font-family: 'Monaco', 'Courier New', monospace; + font-size: 0.95rem; + line-height: 1.8; + color: var(--terminal-text); + overflow-x: auto; +} + +.terminal-prompt { + color: var(--terminal-prompt); + font-weight: bold; +} + +.terminal-comment { + color: var(--terminal-comment); + font-style: italic; +} + +.hero-actions { + display: flex; + gap: 1rem; + justify-content: center; + margin-bottom: 4rem; +} + +.btn-hero-primary, +.btn-hero-secondary { + padding: 0.9rem 2rem; + font-size: 1.1rem; + font-weight: 600; + border-radius: 6px; + text-decoration: none; + transition: all 0.2s ease; + display: inline-block; +} + +.btn-hero-primary { + background: var(--primary); + color: var(--bg); + border: 2px solid var(--primary); +} + +.btn-hero-primary:hover { + background: var(--primary-dark); + border-color: var(--primary-dark); + transform: translateY(-2px); + box-shadow: 0 4px 12px rgba(0, 102, 204, 0.3); +} + +.btn-hero-secondary { + background: transparent; + color: var(--primary); + border: 2px solid var(--primary); +} + +.btn-hero-secondary:hover { + background: var(--primary); + color: var(--bg); + transform: translateY(-2px); +} + +.hero-benefits { + max-width: 1000px; + margin: 0 auto; + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 2rem; +} + +.benefit-card { + background: var(--bg); + border: 1px solid var(--border); + border-radius: 8px; + padding: 2rem 1.5rem; + text-align: center; + transition: all 0.2s ease; +} + +.benefit-card:hover { + border-color: var(--primary); + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); + transform: translateY(-4px); +} + +.benefit-icon { + font-size: 3rem; + margin-bottom: 1rem; + line-height: 1; +} + +.benefit-card h3 { + font-size: 1.2rem; + margin-bottom: 0.75rem; + color: var(--fg); +} + +.benefit-card p { + color: var(--border-dark); + font-size: 0.95rem; + line-height: 1.5; + margin: 0; +} + +/* Install Page */ +.install-page { + max-width: 800px; + margin: 0 auto; + padding: 2rem 1rem; +} + +.install-section { + margin: 2rem 0; +} + +.install-section h2 { + margin-bottom: 1rem; + color: var(--fg); +} + +.install-section h3 { + margin: 1.5rem 0 0.5rem; + color: var(--border-dark); + font-size: 1.1rem; +} + +.code-block { + background: var(--code-bg); + border: 1px solid var(--border); + border-radius: 4px; + padding: 1rem; + margin: 0.5rem 0 1rem; + overflow-x: auto; +} + +.code-block code { + font-family: 'Monaco', 'Menlo', monospace; + font-size: 0.9rem; + line-height: 1.5; + white-space: pre-wrap; +} + +.platform-tabs { + display: flex; + gap: 0.5rem; + border-bottom: 2px solid var(--border); + margin-bottom: 1rem; +} + +.platform-tab { + padding: 0.5rem 1rem; + cursor: pointer; + border: none; + background: none; + font-size: 1rem; + color: var(--border-dark); + transition: all 0.2s; +} + +.platform-tab:hover { + color: var(--fg); +} + +.platform-tab.active { + color: var(--primary); + border-bottom: 2px solid var(--primary); + margin-bottom: -2px; +} + +.platform-content { + display: none; +} + +.platform-content.active { + display: block; +} + /* Responsive */ @media (max-width: 768px) { .navbar { @@ -1219,10 +1480,52 @@ button:hover, .btn:hover, .btn-primary:hover, .btn-secondary:hover { .featured-card { min-height: auto; } + + .hero-section { + padding: 3rem 1.5rem; + } + + .hero-title { + font-size: 2rem; + } + + .hero-subtitle { + font-size: 1rem; + margin-bottom: 2rem; + } + + .hero-terminal { + margin-bottom: 2rem; + } + + .terminal-content { + font-size: 0.85rem; + padding: 1rem; + } + + .hero-actions { + flex-direction: column; + margin-bottom: 3rem; + } + + .btn-hero-primary, + .btn-hero-secondary { + width: 100%; + text-align: center; + } + + .hero-benefits { + grid-template-columns: 1fr; + gap: 1.5rem; + } } @media (max-width: 1024px) and (min-width: 769px) { .featured-grid { grid-template-columns: repeat(2, 1fr); } + + .hero-benefits { + grid-template-columns: repeat(3, 1fr); + } } diff --git a/pkg/appview/templates/pages/home.html b/pkg/appview/templates/pages/home.html index 376595a..5d46dc5 100644 --- a/pkg/appview/templates/pages/home.html +++ b/pkg/appview/templates/pages/home.html @@ -11,6 +11,55 @@ {{ template "nav" . }} + {{ if not .User }} + +
+
+

ship containers on the open web.

+

+ Push and pull Docker images on the AT Protocol.
+ Browse public registries or control your data. +

+ +
+
+ + + +
+
$ docker login atcr.io
+$ docker push atcr.io/you/app
+
+# same docker, decentralized
+
+ + +
+ + +
+
+
🐳
+

Works with Docker

+

Use docker push & pull. No new tools to learn.

+
+
+
+

Your Data

+

Join shared holds or captain your own storage.

+
+
+
🧭
+

Discover Images

+

Browse and star public container registries.

+
+
+
+ {{ end }} +
diff --git a/pkg/appview/templates/pages/install.html b/pkg/appview/templates/pages/install.html index 116d646..72a5c77 100644 --- a/pkg/appview/templates/pages/install.html +++ b/pkg/appview/templates/pages/install.html @@ -7,79 +7,6 @@ Install ATCR Credential Helper - ATCR - {{ template "nav" . }} @@ -137,8 +64,7 @@ chmod +x install.sh

Authentication

The credential helper will automatically prompt for authentication when you push or pull:

-
export ATCR_AUTO_AUTH=1 -docker push {{ .RegistryURL }}/yourhandle/myapp:latest
+
docker push {{ .RegistryURL }}/yourhandle/myapp:latest

This will:

    @@ -180,12 +106,8 @@ which docker-credential-atcr # Add to PATH if needed export PATH="/usr/local/bin:$PATH"
-

Authentication failed

-

Make sure auto-auth is enabled:

-
export ATCR_AUTO_AUTH=1
-

Still having issues?

-

Check the full documentation or open an issue.

+

Check the full documentation or open an issue.

diff --git a/pkg/hold/authorization.go b/pkg/hold/authorization.go index 2b07606..31dec64 100644 --- a/pkg/hold/authorization.go +++ b/pkg/hold/authorization.go @@ -106,6 +106,17 @@ func (s *HoldService) isCrewMember(did string) (bool, error) { return false, fmt.Errorf("no PDS endpoint found for owner") } + // Build this hold's URI for filtering + publicURL := s.config.Server.PublicURL + if publicURL == "" { + return false, fmt.Errorf("hold public URL not configured") + } + holdName, err := extractHostname(publicURL) + if err != nil { + return false, fmt.Errorf("failed to extract hold name: %w", err) + } + holdURI := fmt.Sprintf("at://%s/%s/%s", ownerDID, atproto.HoldCollection, holdName) + // Create unauthenticated client to read public records client := atproto.NewClient(pdsEndpoint, ownerDID, "") @@ -127,6 +138,11 @@ func (s *HoldService) isCrewMember(did string) (bool, error) { continue } + // Only check crew records for THIS hold (prevents cross-hold access) + if crewRecord.Hold != holdURI { + continue + } + // Check expiration (if set) if crewRecord.ExpiresAt != nil && time.Now().After(*crewRecord.ExpiresAt) { continue // Skip expired membership diff --git a/pkg/hold/registration.go b/pkg/hold/registration.go index 5206ba3..37d4968 100644 --- a/pkg/hold/registration.go +++ b/pkg/hold/registration.go @@ -256,12 +256,16 @@ func (s *HoldService) ReconcileAllowAllCrew(callbackHandler *http.HandlerFunc) e return nil } -// hasAllowAllCrewRecord checks if the allow-all crew record exists in the PDS +// hasAllowAllCrewRecord checks if the allow-all crew record exists in the PDS for THIS hold func (s *HoldService) hasAllowAllCrewRecord() (bool, error) { ownerDID := s.config.Registration.OwnerDID + publicURL := s.config.Server.PublicURL if ownerDID == "" { return false, fmt.Errorf("hold owner DID not configured") } + if publicURL == "" { + return false, fmt.Errorf("hold public URL not configured") + } ctx := context.Background() @@ -282,11 +286,18 @@ func (s *HoldService) hasAllowAllCrewRecord() (bool, error) { return false, fmt.Errorf("no PDS endpoint found for owner") } + // Build hold-specific rkey + holdName, err := extractHostname(publicURL) + if err != nil { + return false, fmt.Errorf("failed to extract hostname: %w", err) + } + crewRKey := fmt.Sprintf("allow-all-%s", holdName) + // Create unauthenticated client to read public records client := atproto.NewClient(pdsEndpoint, ownerDID, "") - // Query for specific rkey "allow-all" - record, err := client.GetRecord(ctx, atproto.HoldCrewCollection, "allow-all") + // Query for hold-specific allow-all record + record, err := client.GetRecord(ctx, atproto.HoldCrewCollection, crewRKey) if err != nil { // Record doesn't exist if errors.Is(err, atproto.ErrRecordNotFound) { @@ -302,7 +313,13 @@ func (s *HoldService) hasAllowAllCrewRecord() (bool, error) { } // Check if it's the exact wildcard pattern - return crewRecord.MemberPattern != nil && *crewRecord.MemberPattern == "*", nil + if crewRecord.MemberPattern == nil || *crewRecord.MemberPattern != "*" { + return false, nil + } + + // Verify it's for this hold (defensive check) + expectedHoldURI := fmt.Sprintf("at://%s/%s/%s", ownerDID, atproto.HoldCollection, holdName) + return crewRecord.Hold == expectedHoldURI, nil } // createAllowAllCrewRecord creates a wildcard crew record allowing all authenticated users @@ -329,7 +346,9 @@ func (s *HoldService) createAllowAllCrewRecord(callbackHandler *http.HandlerFunc // Create wildcard crew record crewRecord := atproto.NewHoldCrewRecordWithPattern(holdURI, "*", "write") - _, err = client.PutRecord(ctx, atproto.HoldCrewCollection, "allow-all", crewRecord) + // Use hold-specific rkey to support multiple holds with different allow-all settings + crewRKey := fmt.Sprintf("allow-all-%s", holdName) + _, err = client.PutRecord(ctx, atproto.HoldCrewCollection, crewRKey, crewRecord) if err != nil { return fmt.Errorf("failed to create allow-all crew record: %w", err) } @@ -338,19 +357,26 @@ func (s *HoldService) createAllowAllCrewRecord(callbackHandler *http.HandlerFunc return nil } -// deleteAllowAllCrewRecord deletes the wildcard crew record +// deleteAllowAllCrewRecord deletes the wildcard crew record for this hold func (s *HoldService) deleteAllowAllCrewRecord(callbackHandler *http.HandlerFunc) error { - // Safety check: only delete if it's the exact wildcard pattern + // Safety check: only delete if it's the exact wildcard pattern for THIS hold isWildcard, err := s.hasAllowAllCrewRecord() if err != nil { return fmt.Errorf("failed to check allow-all crew record: %w", err) } if !isWildcard { - log.Printf("Warning: 'allow-all' crew record exists but is not wildcard - skipping deletion") + log.Printf("Note: 'allow-all' crew record not found for this hold (may exist for other holds)") return nil } + // Get hold name for rkey + holdName, err := extractHostname(s.config.Server.PublicURL) + if err != nil { + return fmt.Errorf("failed to extract hostname: %w", err) + } + crewRKey := fmt.Sprintf("allow-all-%s", holdName) + // Run OAuth flow to get authenticated client client, err := s.runOAuthFlow(callbackHandler, "Deleting allow-all crew record") if err != nil { @@ -359,13 +385,13 @@ func (s *HoldService) deleteAllowAllCrewRecord(callbackHandler *http.HandlerFunc ctx := context.Background() - // Delete the record - err = client.DeleteRecord(ctx, atproto.HoldCrewCollection, "allow-all") + // Delete the hold-specific allow-all record + err = client.DeleteRecord(ctx, atproto.HoldCrewCollection, crewRKey) if err != nil { return fmt.Errorf("failed to delete allow-all crew record: %w", err) } - log.Printf("✓ Deleted allow-all crew record") + log.Printf("✓ Deleted allow-all crew record for this hold") return nil }