import * as React from "react";

import { Col, Row, Divider, Typography } from "antd";
import styles from "./bussiness.modules.css";
import image1 from "../../assets/images/facebook-807588_640.png";
import image2 from "../../assets/images/follow-826033_640.png";
import image3 from "../../assets/images/icon-720944_640.png";
import image4 from "../../assets/images/microsoft-80658_640.png";
const companies = [
  { src: image1, title: "facebook" },
  { src: image2, title: "follow" },
  { src: image3, title: "icon" },
  { src: image4, title: "microsoft" },
];
export const Bussiness: React.FC = () => {
  return (
    <>
      <div className={styles.content}>
        <Divider orientation="left">
          <Typography.Title level={3}>合作企业</Typography.Title>
        </Divider>
        <Row>
          {companies.map((item, index) => (
            <Col span={6} key={index}>
              <img
                src={item.src}
                alt=""
                style={{
                  width: "80%",
                  display: "block",
                  marginLeft: "auto",
                  marginRight: "auto",
                }}
              />
              <div>
                <span style={{ fontSize: 24 }}>{item.title}</span>
              </div>
            </Col>
          ))}
        </Row>
      </div>
    </>
  );
};
