mirror of
https://tangled.org/evan.jarrett.net/at-container-registry
synced 2026-08-30 12:46:57 +00:00
more style fixes for the og cards
This commit is contained in:
@@ -120,6 +120,34 @@ func (h *RepoOGHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
|
||||
}
|
||||
}
|
||||
|
||||
// DefaultOGHandler generates the default OpenGraph image for the home page
|
||||
type DefaultOGHandler struct{}
|
||||
|
||||
func (h *DefaultOGHandler) ServeHTTP(w http.ResponseWriter, r *http.Request) {
|
||||
// Generate the OG image
|
||||
card := ogcard.NewCard()
|
||||
card.Fill(ogcard.ColorBackground)
|
||||
|
||||
// Draw large centered "ATCR" title
|
||||
centerY := float64(ogcard.CardHeight) / 2
|
||||
card.DrawText("ATCR", float64(ogcard.CardWidth)/2, centerY-20, 96.0, ogcard.ColorText, ogcard.AlignCenter, true)
|
||||
|
||||
// Draw tagline below
|
||||
card.DrawText("Distributed Container Registry", float64(ogcard.CardWidth)/2, centerY+60, ogcard.FontDescription, ogcard.ColorMuted, ogcard.AlignCenter, false)
|
||||
|
||||
// Draw subtitle
|
||||
card.DrawText("Push and pull Docker images on the AT Protocol", float64(ogcard.CardWidth)/2, centerY+110, ogcard.FontStats, ogcard.ColorMuted, ogcard.AlignCenter, false)
|
||||
|
||||
// Set cache headers and content type (cache longer since it's static content)
|
||||
w.Header().Set("Content-Type", "image/png")
|
||||
w.Header().Set("Cache-Control", "public, max-age=86400")
|
||||
|
||||
if err := card.EncodePNG(w); err != nil {
|
||||
slog.Error("Failed to encode default OG image", "error", err)
|
||||
http.Error(w, "Failed to generate image", http.StatusInternalServerError)
|
||||
}
|
||||
}
|
||||
|
||||
// UserOGHandler generates OpenGraph images for user profile pages
|
||||
type UserOGHandler struct {
|
||||
DB *sql.DB
|
||||
|
||||
@@ -44,16 +44,16 @@ const (
|
||||
// Font sizes
|
||||
FontTitle = 48.0
|
||||
FontDescription = 32.0
|
||||
FontStats = 24.0
|
||||
FontBadge = 20.0
|
||||
FontStats = 40.0 // Larger for visibility when scaled down
|
||||
FontBadge = 32.0 // Larger for visibility when scaled down
|
||||
FontBranding = 28.0
|
||||
|
||||
// Spacing
|
||||
LineSpacingLarge = 65 // Gap after title
|
||||
LineSpacingSmall = 60 // Gap between description lines
|
||||
StatsIconGap = 30 // Gap between stat icon and text
|
||||
StatsItemGap = 40 // Gap between stat items
|
||||
BadgeGap = 15 // Gap between badges
|
||||
StatsIconGap = 48 // Gap between stat icon and text
|
||||
StatsItemGap = 60 // Gap between stat items
|
||||
BadgeGap = 20 // Gap between badges
|
||||
)
|
||||
|
||||
// Layout holds computed positions for a standard OG card layout
|
||||
@@ -403,7 +403,7 @@ func createCircleMask(diameter int) *image.Alpha {
|
||||
|
||||
// Common colors
|
||||
var (
|
||||
ColorBackground = color.RGBA{R: 13, G: 17, B: 23, A: 255} // #0d1117 - GitHub dark
|
||||
ColorBackground = color.RGBA{R: 22, G: 27, B: 34, A: 255} // #161b22 - GitHub dark elevated
|
||||
ColorText = color.RGBA{R: 230, G: 237, B: 243, A: 255} // #e6edf3 - Light text
|
||||
ColorMuted = color.RGBA{R: 125, G: 133, B: 144, A: 255} // #7d8590 - Muted text
|
||||
ColorAccent = color.RGBA{R: 47, G: 129, B: 247, A: 255} // #2f81f7 - Blue accent
|
||||
|
||||
@@ -142,6 +142,8 @@ func RegisterUIRoutes(router chi.Router, deps UIDependencies) {
|
||||
).ServeHTTP)
|
||||
|
||||
// OpenGraph image generation (public, cacheable)
|
||||
router.Get("/og/home", (&uihandlers.DefaultOGHandler{}).ServeHTTP)
|
||||
|
||||
router.Get("/og/u/{handle}", (&uihandlers.UserOGHandler{
|
||||
DB: deps.ReadOnlyDB,
|
||||
}).ServeHTTP)
|
||||
|
||||
@@ -3,6 +3,20 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>ATCR - Distributed Container Registry</title>
|
||||
<!-- Open Graph -->
|
||||
<meta property="og:title" content="ATCR - Distributed Container Registry">
|
||||
<meta property="og:description" content="Push and pull Docker images on the AT Protocol. Same Docker, decentralized.">
|
||||
<meta property="og:image" content="https://{{ .RegistryURL }}/og/home">
|
||||
<meta property="og:image:width" content="1200">
|
||||
<meta property="og:image:height" content="630">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://{{ .RegistryURL }}">
|
||||
<meta property="og:site_name" content="ATCR">
|
||||
<!-- Twitter Card (used by Discord) -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:title" content="ATCR - Distributed Container Registry">
|
||||
<meta name="twitter:description" content="Push and pull Docker images on the AT Protocol. Same Docker, decentralized.">
|
||||
<meta name="twitter:image" content="https://{{ .RegistryURL }}/og/home">
|
||||
{{ template "head" . }}
|
||||
</head>
|
||||
<body>
|
||||
|
||||
Reference in New Issue
Block a user