40 lines
988 B
Svelte
40 lines
988 B
Svelte
<script>
|
|
import CardHeader from "./CardHeader.svelte"
|
|
import CardBody from "./CardBody.svelte"
|
|
import CardImage from "./CardImage.svelte"
|
|
import CardFooter from "./CardFooter.svelte"
|
|
import { H2, H6, Body2 } from "../Typography"
|
|
import { Button } from "../Button"
|
|
import { IconButton } from "../IconButton"
|
|
import ClassBuilder from "../ClassBuilder.js"
|
|
|
|
export let width = "350px"
|
|
export let height = "auto"
|
|
export let variant = "standard"
|
|
|
|
export let _bb
|
|
let card
|
|
|
|
const cb = new ClassBuilder("card", ["standard"])
|
|
|
|
$: modifiers = { variant }
|
|
$: props = { modifiers }
|
|
$: cardClass = cb.build({ props })
|
|
|
|
$: safeWidth = width !== "auto" && !/px$/.test(width) ? `${width}px` : width
|
|
|
|
$: safeHeight =
|
|
height !== "auto" && !/px$/.test(height) ? `${height}px` : height
|
|
|
|
$: card && _bb.attachChildren(card)
|
|
</script>
|
|
|
|
<div bind:this={card} class={`bbmd-card ${cardClass}`} />
|
|
|
|
<style>
|
|
.bbmd-card {
|
|
width: 350px;
|
|
height: auto;
|
|
}
|
|
</style>
|