Component Detail
Image
Responsive image display with alt text and optional caption.
Example
References
- Template
templates/components/image.html- Golden
testdata/golden/image.golden.html
Go (Marionette) Example
This implementation example uses Marionette in Go. Source: docs/site-astro/public/examples/go/image.go
package goexamples
import (
mb "github.com/YoshihideShirai/marionette/backend"
mf "github.com/YoshihideShirai/marionette/frontend"
)
func RegisterImageExample(app *mb.App) {
app.Page("/image", func(ctx *mb.Context) mf.Node {
return mf.Image(mf.ImageProps{
Src: "https://images.unsplash.com/photo-1500530855697-b586d89ba3ee?auto=format&fit=crop&w=1200&q=80",
Alt: "Desk with laptop and notebook",
Caption: "Workspace preview",
Width: 1200,
Height: 800,
AspectRatio: "video",
ObjectFit: "cover",
})
})
}