duck.html.components.card

Card component module.

Module Contents

Classes

Card

Basic card component derived from flex container.

API

class duck.html.components.card.Card(element: Optional[str] = None, properties: Optional[Dict[str, str]] = None, props: Optional[Dict[str, str]] = None, style: Optional[Dict[str, str]] = None, inner_html: Optional[Union[str, str, float]] = None, children: Optional[List[duck.html.components.HtmlComponent]] = None, **kwargs)[source]

Bases: duck.html.components.container.FlexContainer

Basic card component derived from flex container.

Renders a centered, vertically-stacked card with a soft shadow and a subtle hover lift, suited for feature tiles, stat blocks, and similar content that needs equal visual weight.

Parameters:

  • bg_color – Optional card background override.

  • border_color – Optional card border color override.

Initialization

Initialize an HTML component.

Parameters:

  • element – The HTML element tag name (e.g., textarea, input, button). Can be None, but make sure element is returned by get_element method.

  • accept_inner_html – Whether the HTML component accepts an inner body (e.g., inner-body-here).

  • inner_html – Inner html to add to the HTML component. Defaults to None.

  • properties – Dictionary for properties to initialize the component with.

  • props – Just same as properties argument (added for simplicity).

  • style – Dictionary for style to initialize the component with.

  • event_handlers – Events to automatically bind. Each dictionary maps an event name to its handler and may include additional keyword arguments forwarded to bind(), e.g. event_handlers=[{"click": on_button_click, **extra_kwargs}].

  • **kwargs – Extra keyword arguments

Raises:

HtmlComponentError – If ‘element’ is not a string or ‘inner_html’ is set but ‘accept_inner_html’ is False.

build_style() → duck.html.components.style.Style[source]

Builds the card’s scoped hover styling.

Reads the per-instance border color from the --card-border-color custom property set alongside the base styling, so multiple cards with different border colors don’t stomp on each other’s hover rule.

Returns:

A Style component containing the card’s hover rule.

on_create() → None[source]