gpui-ai

Effects · Decoration

Photo

The photograph with nothing between it and the words. Its own colours, not the theme's - a decoration is the application's, and nothing here has to follow the palette. Also the reason the next one exists.

Photo — gpui-ai

Starts when it scrolls into view

Pop out

NORD FROST · DARK · RADIUS 6/10 · BASE 16PX · SHADOW

The decorations story, opened on Photo. The switcher above the card is the story's own — every state it offers has a page here.

Code

Cut from the gallery’s own decorations, so it is the code that drew the frame above rather than a description of it.

crates/gallery/src/decorations.rsOpen in the galleryImplementation
fn photograph(cx: &App) -> impl IntoElement {
    static SHAPED: OnceLock<Arc<RenderImage>> = OnceLock::new();
    let radius = f32::from(decoration::frame_radius(cx));
    let image = Arc::clone(SHAPED.get_or_init(|| shaped_crop(stage_pixels(Stage::Photo), radius)));
    img(image).absolute().inset_0()
}

Applying it

Every framed component takes a Decoration, and the layer decides for itself whether it belongs to the shape — either by carrying the frame’s radius, or by not reaching a corner. The two rules are the whole contract.

crates/gallery/src/decorations.rs
let card = ApprovalCard::new("decorated-gate", "Publish the launch plan?")
    .description(
        "The card is unchanged. Everything behind and in front of it \
         is the application's.",
    )
    .decoration(kind.build(cx))