import React from "react";
import { Card, Button, H3 } from "@tencent/tea-component";

export default function CardExample() {
  return (
    <div className="example-stage">
      <Card style={{ maxWidth: 400 }}>
        <img
          width="100%"
          src="////main.qcloudimg.com/raw/6c8fd423cd9bdd7a77b0e99725e04fff.png"
          alt="bg"
        />
        <Card.Body title="标题" subtitle="(小标题)">
          描述文案
        </Card.Body>
        <Card.Footer style={{ padding: "8px 20px" }}>
          <Button type="link">查看</Button>
          <Button type="link" style={{ marginLeft: 16 }}>
            下载
          </Button>
        </Card.Footer>
      </Card>
      <Card style={{ maxWidth: 400, marginTop: 16 }}>
        <Card.Header>
          <H3>标题</H3>
        </Card.Header>
        <img
          width="100%"
          src="////main.qcloudimg.com/raw/6c8fd423cd9bdd7a77b0e99725e04fff.png"
          alt="bg"
        />
        <Card.Body>描述文案</Card.Body>
        <Card.Footer style={{ padding: "8px 20px" }}>
          <Button type="link">查看</Button>
          <Button type="link" style={{ marginLeft: 16 }}>
            下载
          </Button>
        </Card.Footer>
      </Card>
    </div>
  );
}