Card

For more examples, visit the Storybook.

Example

<StudsCard>
    <StudsCardHeader>
        <StudsCardTitle>Title Text</StudsCardTitle>
        <StudsCardDescription>
            This is a card description.
        </StudsCardDescription>
    </StudsCardHeader>
    <StudsCardContent>
        <div>This is a card content.</div>
    </StudsCardContent>
    <StudsCardFooter>
        <StudsButton variant='outline'>Cancel</StudsButton>
        <StudsButton>Deploy</StudsButton>
    </StudsCardFooter>
</StudsCard>

For more examples, visit the Storybook.

Example

<StudsCard>
    <StudsCardHeader>
        <StudsCardTitle>Title Text</StudsCardTitle>
        <StudsCardDescription>
            This is a card description.
        </StudsCardDescription>
    </StudsCardHeader>
    <StudsCardContent>
        <div>This is a card content.</div>
    </StudsCardContent>
    <StudsCardFooter>
        <StudsButton variant='outline'>Cancel</StudsButton>
        <StudsButton>Deploy</StudsButton>
    </StudsCardFooter>
</StudsCard>

For more examples, visit the Storybook.

Example

<StudsCard>
    <StudsCardHeader>
        <StudsCardTitle>Title Text</StudsCardTitle>
        <StudsCardDescription>This is a card description.</StudsCardDescription>
    </StudsCardHeader>
    <StudsCardContent>
        <div>
            This is the card content.
        </div>
    </StudsCardContent>
    <StudsCardFooter>
        <div class="d-flex justify-content-between">
            <StudsButton ButtonStyle="ButtonStyle.Outline">Cancel</StudsButton>
            <StudsButton>Deploy</StudsButton>
        </div>
    </StudsCardFooter>
</StudsCard>

`StudsCard` Parameters

Template

RenderFragment<StudsCard>

Gets or sets the template to create a customized card.

ChildContent

RenderFragment

Gets or sets the child content.

Attributes

Dictionary<string, object>

Specifies additional custom attributes that will be rendered by the component.

MouseEnter

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse enters an item.

MouseLeave

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse leaves an item.

A callback that will be invoked when the user right-clicks the component. Commonly used to display a context menu.

Culture

CultureInfo

default:"CultureInfo.CurrentCulture"

Gets or sets the culture used to display localizable data (numbers, dates). Set by default to “CultureInfo.CurrentCulture”.

Style

string

Gets or sets the inline CSS style.

Visible

bool

default:"true"

Gets or sets a value indicating whether this “T:Studs.StudsComponent” is visible. Invisible components are not rendered.

`StudsCardHeader` Parameters

ChildContent

RenderFragment

Gets or sets the child content for the card header.

Attributes

Dictionary<string, object>

Specifies additional custom attributes that will be rendered by the component.

MouseEnter

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse enters an item.

MouseLeave

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse leaves an item.

A callback that will be invoked when the user right-clicks the component. Commonly used to display a context menu.

Culture

CultureInfo

default:"CultureInfo.CurrentCulture"

Gets or sets the culture used to display localizable data (numbers, dates). Set by default to “CultureInfo.CurrentCulture”.

Style

string

Gets or sets the inline CSS style.

Visible

bool

default:"true"

Gets or sets a value indicating whether this “T:Studs.StudsComponent” is visible. Invisible components are not rendered.

`StudsCardTitle` Parameters

ChildContent

RenderFragment

Gets or sets the child content for the card title.

Attributes

Dictionary<string, object>

Specifies additional custom attributes that will be rendered by the component.

MouseEnter

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse enters an item.

MouseLeave

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse leaves an item.

A callback that will be invoked when the user right-clicks the component. Commonly used to display a context menu.

Culture

CultureInfo

default:"CultureInfo.CurrentCulture"

Gets or sets the culture used to display localizable data (numbers, dates). Set by default to “CultureInfo.CurrentCulture”.

Style

string

Gets or sets the inline CSS style.

Visible

bool

default:"true"

Gets or sets a value indicating whether this “T:Studs.StudsComponent” is visible. Invisible components are not rendered.

`StudsCardDescription` Parameters

ChildContent

RenderFragment

Gets or sets the child content for the card description.

Attributes

Dictionary<string, object>

Specifies additional custom attributes that will be rendered by the component.

MouseEnter

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse enters an item.

MouseLeave

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse leaves an item.

A callback that will be invoked when the user right-clicks the component. Commonly used to display a context menu.

Culture

CultureInfo

default:"CultureInfo.CurrentCulture"

Gets or sets the culture used to display localizable data (numbers, dates). Set by default to “CultureInfo.CurrentCulture”.

Style

string

Gets or sets the inline CSS style.

Visible

bool

default:"true"

Gets or sets a value indicating whether this “T:Studs.StudsComponent” is visible. Invisible components are not rendered.

`StudsCardContent` Parameters

ChildContent

RenderFragment

Gets or sets the child content for the card content area.

Attributes

Dictionary<string, object>

Specifies additional custom attributes that will be rendered by the component.

MouseEnter

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse enters an item.

MouseLeave

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse leaves an item.

A callback that will be invoked when the user right-clicks the component. Commonly used to display a context menu.

Culture

CultureInfo

default:"CultureInfo.CurrentCulture"

Gets or sets the culture used to display localizable data (numbers, dates). Set by default to “CultureInfo.CurrentCulture”.

Style

string

Gets or sets the inline CSS style.

Visible

bool

default:"true"

Gets or sets a value indicating whether this “T:Studs.StudsComponent” is visible. Invisible components are not rendered.

`StudsCardFooter` Parameters

ChildContent

RenderFragment

Gets or sets the child content for the card footer.

Attributes

Dictionary<string, object>

Specifies additional custom attributes that will be rendered by the component.

MouseEnter

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse enters an item.

MouseLeave

EventCallback<ElementReference>

Gets or sets the callback that is invoked when the mouse leaves an item.

A callback that will be invoked when the user right-clicks the component. Commonly used to display a context menu.

Culture

CultureInfo

default:"CultureInfo.CurrentCulture"

Gets or sets the culture used to display localizable data (numbers, dates). Set by default to “CultureInfo.CurrentCulture”.

Style

string

Gets or sets the inline CSS style.

Visible

bool

default:"true"

Gets or sets a value indicating whether this “T:Studs.StudsComponent” is visible. Invisible components are not rendered.

Getting Started

Foundations

Components

Integration

Content

`StudsCard` Parameters

`StudsCardHeader` Parameters

`StudsCardTitle` Parameters

`StudsCardDescription` Parameters

`StudsCardContent` Parameters

`StudsCardFooter` Parameters

Getting Started

Foundations

Components

Integration

Content

​StudsCard Parameters

​StudsCardHeader Parameters

​StudsCardTitle Parameters

​StudsCardDescription Parameters

​StudsCardContent Parameters

​StudsCardFooter Parameters

`StudsCard` Parameters

`StudsCardHeader` Parameters

`StudsCardTitle` Parameters

`StudsCardDescription` Parameters

`StudsCardContent` Parameters

`StudsCardFooter` Parameters