animaltrack/docs/vendor/monsterui/api_ref/docs_containers.md

Articles, Containers & Sections API Reference

ArticleMeta

Source

[code]

ArticleMeta(*c, cls=(), **kwargs) -> fastcore.xml.FT

[/code]

A metadata component for use within an Article showing things like date, author etc

Params

• c contents of ArticleMeta tag (often other tags)

• cls Classes in addition to ArticleMeta styling

• kwargs

Returns: P(..., cls='uk-article-meta')

ArticleTitle

Source

[code]

ArticleTitle(*c, cls=(), **kwargs) -> fastcore.xml.FT

[/code]

A title component for use within an Article

Params

• c contents of ArticleTitle tag (often other tags)

• cls Classes in addition to ArticleTitle styling

• kwargs

Returns: H1(..., cls='uk-article-title')

Article

Source

[code]

Article(*c, cls=(), **kwargs) -> fastcore.xml.FT

[/code]

A styled article container for blog posts or similar content

Params

• c contents of Article tag (often other tags)

• cls Classes in addition to Article styling

• kwargs

Returns: Article(..., cls='uk-article')

See Source

See Output

Sample Article Title

By: John Doe

lorem ipsum dolor sit amet consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

[code]

def ex_articles():
    return Article(
        ArticleTitle("Sample Article Title"), 
        Subtitle("By: John Doe"),
        P('lorem ipsum dolor sit amet consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.'))

[/code]

Container

Source

[code]

Container(*c, cls=('mt-5', <ContainerT.xl: 'uk-container-xl'>), **kwargs) -> fastcore.xml.FT

[/code]

Div to be used as a container that often wraps large sections or a page of content

Params

• c Contents of Container tag (often other FT Components)

• cls Classes in addition to Container styling

• kwargs

Returns: Container(..., cls='uk-container')

---

ContainerT

Max width container sizes from https://franken-ui.dev/docs/container

Option	Value	Option	Value
xs	uk-container-xs	sm	uk-container-sm
lg	uk-container-lg	xl	uk-container-xl
expand	uk-container-expand

See Source

See Output

This is a sample container with custom styling.

[code]

def ex_containers():
    return Container(
        "This is a sample container with custom styling.",
        cls=ContainerT.xs,
        style="background-color: #FFA500; color: #000000")

[/code]

Section

Source

[code]

Section(*c, cls=(), **kwargs) -> fastcore.xml.FT

[/code]

Section with styling and margins

Params

• c contents of Section tag (often other tags)

• cls Classes in addition to Section styling

• kwargs

Returns: Div(..., cls='uk-section')

---

SectionT

Section styles from https://franken-ui.dev/docs/section

Option	Value	Option	Value	Option	Value
default	uk-section-default	muted	uk-section-muted	primary	uk-section-primary
secondary	uk-section-secondary	xs	uk-section-xsmall	sm	uk-section-small
lg	uk-section-large	xl	uk-section-xlarge	remove_vertical	uk-section-remove-vertical