import React from 'react';
import { Row, Col, Icon } from 'antd';
import QueueAnim from 'rc-queue-anim';
import ScrollOverPack from 'rc-scroll-anim/lib/ScrollOverPack';
import { Link } from 'bisheng/router';
import { FormattedMessage } from 'react-intl';
import * as utils from '../utils';
import svgBgToParallax from './util';
const page2Data = [
{
img: 'https://gw.alipayobjects.com/zos/rmsportal/eYNnmGagLWdrkdMHVUuA.svg',
name: 'Ant Design Components',
},
{
img: 'https://gw.alipayobjects.com/zos/rmsportal/EPaPtDVGnJhyqyBAUZMl.svg',
name: 'Ant Design Pro',
slogan: ,
link: 'https://pro.ant.design/index-cn',
},
{
img: 'https://gw.alipayobjects.com/zos/rmsportal/GobRAKexhfTSJdLFzDFY.svg',
name: 'Ant Design Mobile',
slogan: ,
},
{
img: 'https://gw.alipayobjects.com/zos/rmsportal/slVtnOCcgeAcLEPwtewY.svg',
name: 'AntV',
slogan: ,
link: 'https://antv.alipay.com/zh-cn/index.html',
},
{
img: 'https://gw.alipayobjects.com/zos/rmsportal/EAHlyTmYeDtTkZIPbUnP.svg',
name: 'Ant Design Landing',
slogan: ,
link: 'https://landing.ant.design',
new: true,
},
];
const svgBgChild = [
,
,
];
const svgBgChildArray = svgBgChild.map((item, i) => {
const {
props: { children },
} = item;
return React.cloneElement(item, { children: svgBgToParallax(children, i) });
});
export default function Page2({ isMobile, locale }) {
const isZhCN = locale === 'zh-CN';
const componentButton = (
);
const children = page2Data.map((item, i) => {
if (!isMobile && !i) {
return null;
}
const mobileContent = (
);
const moreContent =
i === 2
? mobileContent
: [
{item.slogan}
,
,
];
const content = isMobile && !i ? componentButton : moreContent;
const BlockElement = item.link ? 'a' : 'div';
return (
{item.name} {item.new && NEW}
{content}
);
});
return (
Ant Design Components
{componentButton}
{children}
{svgBgChildArray[0]}
{svgBgChildArray[1]}
);
}