Card.md

Fish Tank Cards

• Plain Card

  

  <Card>
    I am a plain card
  </Card>

• Card with heading

  

  <Card heading="I am a card heading">
    I am card content
  </Card>

• Card with heading and custom background

  

  <Card>
    <div
      slot="heading"
      slot-scope="{ headerClass }"
      :class="headerClass"
      class="custom-heading"
    >
      Heading with custom background
    </div>
    I am card content
  </Card>

• Branded Card

  

  <Card branded="card-sample-brand-class">
    I am a branded card
  </Card>

Usage

To import into your component

import { 
  Card 
}  from '@fishtank/fishtank-vue'

Props

Name	Type	Description	Required	Default
heading	String (Hex color, or valid CSS color)	Start Color of Gradient	true	undefined
branded	String (Hex color, or valid CSS color)	End Color of Gradient	true	undefined