@infinitoui/infinito-card

infinito card component

Usage no npm install needed!

<script type="module">
  import infinitouiInfinitoCard from 'https://cdn.skypack.dev/@infinitoui/infinito-card';
</script>

README

@infinitoui/infinito-card

Downloads per month NPM Version TypeScript

Preview

preview

Demo

Install

npm install @infinitoui/infinito-card

Usage

引入组件：

import '@infinitoui/infinito-card'

使用：

<infinito-card title="标题">
  <p>这是有标题的card，并且可以折叠</p>
</infinito-card>

<infinito-card>
  <p>这是没有标题的card</p>
</infinito-card>

Properties

Property Attribute Type Default Description
open open boolean false 默认是否关闭
title title string "" 卡片标题，没有标题不能折叠

Slots

Name Description
卡片主体内容（默认插槽）

CSS Custom Properties

Property Default Description
--border-radius "0" 卡片圆角
--card-color "#fff" 卡片背景颜色
--padding-width "20px" 卡片内边距