# MUK CARDS

## Usage

```html

<lib-muk-cards
        [cardData]="cardData"
>
    <ng-template content>
        <div class="card-content">
            <div class="card-content-title">
                {{cardData.title}}
            </div>
            <div class="card-content-subtitle">
                {{cardData.subtitle}}
            </div>
        </div>
    </ng-template>

</lib-muk-cards>
```

```typescript
import {Component} from '@angular/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html'
})
export class AppComponent {
    cardData: ICard = {
        title: 'Title',
        subtitle: 'Subtitle',
        image: 'https://via.placeholder.com/150',
        alt: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec auctor, nisl eget ultricies aliquam, nunc ni',
        alignActions: CardActionsAlignment.start,
        buttons: [
            {
                label: 'Button 1',
                icon: 'add',
                color: ButtonColor.primary,
                size: ButtonSize.small,
                disabled: false,
                onClick: () => {
                    console.log('Button 1 clicked');
                }
            },
            {
                label: 'Button 2',
                icon: 'add',
                color: ButtonColor.primary,
                size: ButtonSize.small,
                disabled: false,
                onClick: () => {
                    console.log('Button 2 clicked');
                }
            }
        ]
    }
}
```

### Properties

| Name     | Type  | Description                      |
|----------|-------|----------------------------------|
| cardData | ICard | Data of the card to be displayed |

### Template

| Name    | Type        | Description                                          |
|---------|-------------|------------------------------------------------------|
| content | TemplateRef | Template to be displayed in the content of the card. |