ant-design/components/calendar/demo/card.md
MadCcc 6776bb8916
docs: demo support react18 (#34843)
* docs: update demo

* chore: add script

* test: fix demo test

* docs: convert demos

* chore: move script

* test: remove react-dom import

* chore: update deps

* docs: update riddle js

* test: fix image test

* docs: fix riddle demo
2022-04-03 23:27:45 +08:00

43 lines
661 B
Markdown

---
order: 2
title:
zh-CN: 卡片模式
en-US: Card
---
## zh-CN
用于嵌套在空间有限的容器中。
## en-US
Nested inside a container element for rendering in limited space.
```jsx
import { Calendar } from 'antd';
function onPanelChange(value, mode) {
console.log(value, mode);
}
export default () => (
<div className="site-calendar-demo-card">
<Calendar fullscreen={false} onPanelChange={onPanelChange} />
</div>
);
```
```css
.site-calendar-demo-card {
width: 300px;
border: 1px solid #f0f0f0;
border-radius: 2px;
}
```
<style>
[data-theme="dark"] .site-calendar-demo-card {
border: 1px solid #303030;
}
</style>