import { Col, Row } from "antd";
import * as React from "react";
import Skeleton from "react-loading-skeleton";
import "./LoadingModule.scss";
const LoadingModule = () => {
  return (
    <div className="loading-module">
      <Row align="middle" justify="space-between">
        <Col>
          <Skeleton className="border__radius--8" width={116} height={16} />
        </Col>
        <Col>
          <Skeleton className="border__radius--8" width={76} height={16} />
        </Col>
      </Row>

      <Row align="middle" className="m__t--20 loading-module__item">
        <Col className="loading-module__item--photo">
          <Skeleton containerClassName="picture" width={80} height={80} />
        </Col>
        <Col className="p--16 height--82" flex="1">
          <Skeleton className="border__radius--8" height={16} />
          <Skeleton className="border__radius--8 m__t--14" height={16} />
        </Col>
      </Row>
      <Row align="middle" className="m__t--20 loading-module__item">
        <Col className="loading-module__item--photo">
          <Skeleton containerClassName="picture" width={80} height={80} />
        </Col>
        <Col className="p--16 height--82" flex="1">
          <Skeleton className="border__radius--8" height={16} />
          <Skeleton className="border__radius--8 m__t--14" height={16} />
        </Col>
      </Row>
    </div>
  );
};

export default LoadingModule;
