Card component

The component <day-card> is a content container for text, images and actions in the context of a single subject.

Dependencies

'@core'

Selectors

Card: day-card

Card header: day-card-header

Card body: day-card-body

Card footer: day-card-footer

Installation and Usage

npm install @dayerlin-bustamante/card

import { DAYCardComponent } from '@dayerlin-bustamante/card';

<day-card>
    <day-card-body>Content</day-card-body>
</day-card>

Title

Subtitle

Content

Description

The component is a content container for text, images and actions in the context of a single subject.

Basic card sections

Element	Description
<day-card-header>	Section anchored to the top of the card (adds padding).
<day-card-body>	Body card content (adds padding).
<day-card-footer>	Section anchored to the bottom of the card (adds padding).

import { DAYCardComponent } from '@dayerlin-bustamante/card';
import { DAYCardHeaderComponent } from '@dayerlin-bustamante/card';
import { DAYCardBodyComponent } from '@dayerlin-bustamante/card';
import { DAYCardFooterComponent } from '@dayerlin-bustamante/card';

Inputs

Name	Description
type: <'primary' \| 'secondary'>	Type of the card.
shadow: <'big' \| 'small' \| 'none'>	Size of the card's shadow.

Output

Not included

Directives

Not included

Public methods

Not included