@zenequityui/card v0.9.6

Installation

To install a component run

$ npm install @zenequityui/card --save

Please import CSS styles via

@import '/path__to__node_modules/@zenequityui/card/dist/index.min.css

Usage

Box Card

import { Card } from '@zenequityui/card';

<div style={{ display: 'flex', justifyContent: 'space-around' }}>
  <div>
    <div>Without Hoverable</div>
    <br />
    <Card />
  </div>

  <div>
    <div>With Hoverable</div>
    <br />
    <Card
      isHoverable
    />
  </div>

  <div>
    <div>With Clickable</div>
    <br />
    <Card
      isClickable
      onClick={() => { alert('Card Clicked'); }}
    />
  </div>
</div>

Circle Card

import { Card } from '@zenequityui/card';

<div style={{ display: 'flex', justifyContent: 'space-around' }}>
  <div>
    <div>Without Hoverable</div>
    <br />
    <Card
      layout="circle"
    />
  </div>

  <div>
    <div>With Hoverable</div>
    <br />
    <Card
      layout="circle"
      isHoverable
    />
  </div>
  
  <div>
    <div>With Clickable</div>
    <br />
    <Card
      layout="circle"
      isClickable
      onClick={() => { alert('Card Clicked'); }}
    />
  </div>
</div>