Node Promiscuous Modules

    @commercetools-uikit/card
    TypeScript icon, indicating that this package has built-in type declarations

    15.2.3 • Public • Published

    Card

    Description

    Cards are used to display content and actions on a single topic.

    Installation

    yarn add @commercetools-uikit/card
    
    npm --save install @commercetools-uikit/card
    

    Additionally install the peer dependencies (if not present)

    yarn add react
    
    npm --save install react
    

    Usage

    import Card from '@commercetools-uikit/card';
    
    const Example = () => (
      <Card theme="light" type="raised">
        <p>{`You'll never guess where I've been!`}</p>
      </Card>
    );
    
    export default Example;

    Properties

    Props Type Required Default Description
    type union
    Possible values:
    'raised' , 'flat'
    'raised' Determines the visual effect of the card. A raised card has a box shadow while a flat card has just a border.
    insetScale union
    Possible values:
    'none' , 's' , 'm'
    'm' Determines the spacing (padding) that the content should have from the card borders. In case there is no space needed, you can pass none.
    theme union
    Possible values:
    'light' , 'dark'
    'light' Determines the background color of the card.
    className string Pass a custom CSS class, useful to override the styles.
    NOTE: This is not recommended and should only be used for building new components that require special style adjustments.
    children ReactNode

    Install

    npm i @commercetools-uikit/card

    DownloadsWeekly Downloads

    6,030

    Version

    15.2.3

    License

    MIT

    Unpacked Size

    26.6 kB

    Total Files

    11

    Last publish

    Collaborators

    • emmenko
    • commercetools-admin
    • tdeekens