ant-design/components/flex/demo/combination.tsx
Abhay Aggarwal 985b7ac889
demo: fixed a grammatical error (#46343)
* Fixed a grammatical error | "start" -> "started"

Fixed the issue of tense on the button at the example in flex section of the documentation

Signed-off-by: Abhay Aggarwal <97821733+abhay-ag@users.noreply.github.com>

* added the jest snapshots

---------

Signed-off-by: Abhay Aggarwal <97821733+abhay-ag@users.noreply.github.com>
2023-12-09 18:29:30 +08:00

34 lines
937 B
TypeScript

import React from 'react';
import { Button, Card, Flex, Typography } from 'antd';
const cardStyle: React.CSSProperties = {
width: 620,
};
const imgStyle: React.CSSProperties = {
display: 'block',
width: 273,
};
const App: React.FC = () => (
<Card hoverable style={cardStyle} bodyStyle={{ padding: 0, overflow: 'hidden' }}>
<Flex justify="space-between">
<img
alt="avatar"
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png"
style={imgStyle}
/>
<Flex vertical align="flex-end" justify="space-between" style={{ padding: 32 }}>
<Typography.Title level={3}>
antd is an enterprise-class UI design language and React UI library.
</Typography.Title>
<Button type="primary" href="https://ant.design" target="_blank">
Get Started
</Button>
</Flex>
</Flex>
</Card>
);
export default App;