import React from "react";
import clsx from "clsx";
import styles from "./LogoCarousel.module.css";
import Link from '@docusaurus/Link'
import Translate, {translate} from '@docusaurus/Translate';


let ticks = 0;

export default class LogoCarousel extends React.Component {
  render() {

    return (
<div className="logoall"><h1 className={styles.title}><Translate id="用户案例">用户案例</Translate></h1>
<h2 className={styles.subtitle}><Translate id="用户案例instruction">RocketMQ已帮助数万家互联网、金融、制造业等公司</Translate></h2>
      <div className = "logoutsider">
      <div className="logocontainer">
        

        <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/2dfire-logo.jpg"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/2dfire-logo.jpg"
            width="100"
            height="100"
          />
        </div>
    
        <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/alibaba-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/alibaba-logo.png"
            width="100"
            height="100"
          />
        </div>
    
        <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/ant-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/ant-logo.png"
            width="100"
            height="100"
          />
        </div>

        <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/beibei-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/beibei-logo.png"
            width="100"
            height="100"
          />
        </div>

        <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/china-telecom-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/china-telecom-logo.png"
            width="100"
            height="100"
          />
        </div>


        <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/decent-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/decent-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/didi-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/didi-logo.png"
            width="100"
            height="100"
          />
        </div> <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/egov-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/egov-logo.png"
            width="100"
            height="100"
          />
        </div> <div className="avatar">
          <img
            alt=""
            aria-hidden
            src="/community/fenqile-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/fenqile-logo.png"
            width="100"
            height="100"
          />
        </div> <div className={clsx("avatar",styles.logo15)}>
          <img
            alt=""
            aria-hidden
            src="/community/gome-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/gome-logo.png"
            width="100"
            height="100"
          />
        </div> <div className={clsx("avatar",styles.logo14)}>
          <img
            alt=""
            aria-hidden
            src="/community/huawei-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/huawei-logo.png"
            width="100"
            height="100"
          />
        </div> <div className={clsx("avatar",styles.logo13)}>
          <img
            alt=""
            aria-hidden
            src="/community/iqiyi-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/iqiyi-logo.png"
            width="100"
            height="100"
          />
        </div> <div className={clsx("avatar",styles.logo12)}>
          <img
            alt=""
            aria-hidden
            src="/community/kedaxunfei-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/kedaxunfei-logo.png"
            width="100"
            height="100"
          />
        </div> <div className={clsx("avatar",styles.logo11)}>
          <img
            alt=""
            aria-hidden
            src="/community/media-logo.jpg"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/media-logo.jpg"
            width="100"
            height="100"
          />
        </div> <div className={clsx("avatar",styles.logo10)}>
          <img
            alt=""
            aria-hidden
            src="/community/meizu-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/meizu-logo.png"
            width="100"
            height="100"
          />
        </div> <div className={clsx("avatar",styles.logo9)}>
          <img
            alt=""
            aria-hidden
            src="/community/mingsheng-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/mingsheng-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo8)}>
          <img
            alt=""
            aria-hidden
            src="/community/mobike-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/mobike-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo7)}>
          <img
            alt=""
            aria-hidden
            src="/community/mogujie-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/mogujie-logo.png"
            width="100"
            height="100"
          />
        </div>
     
        <div className={clsx("avatar",styles.logo6)}>
          <img
            alt=""
            aria-hidden
            src="/community/shihai-logo.jpg"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/shihai-logo.jpg"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo5)}>
          <img
            alt=""
            aria-hidden
            src="/community/shouqi-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/shouqi-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo4)}>
          <img
            alt=""
            aria-hidden
            src="/community/shunfeng-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/shunfeng-logo.png"
            width="100"
            height="100"
          />
        </div>
  
        <div className={clsx("avatar",styles.logo3)}>
          <img
            alt=""
            aria-hidden
            src="/community/tree-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/tree-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo2)}>
          <img
            alt=""
            aria-hidden
            src="/community/webank-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/webank-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo1)}>
          <img
            alt=""
            aria-hidden
            src="/community/wensihaihui-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/wensihaihui-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo1)}>
          <img
            alt=""
            aria-hidden
            src="/community/yeahmobi-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/yeahmobi-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo1)}>
          <img
            alt=""
            aria-hidden
            src="/community/yhsoft-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/yhsoft-logo.png"
            width="100"
            height="100"
          />
        </div>
        <div className={clsx("avatar",styles.logo1)}>
          <img
            alt=""
            aria-hidden
            src="/community/yunpan-logo.png"
            class="background"
          />
          <img
            alt="Avatar"
            src="/community/yunpan-logo.png"
            width="100"
            height="100"
          />
        </div>
        </div>
        </div>
        <div className={styles.buttondiv} >
        <Link
            className={clsx(
              "button button--outline button--secondary button--lg ",
              styles.buttonlogo
            )}
            to={"/blog"}
          ><Translate id="更多案例">
            更多案例
            </Translate>
          </Link>
          </div>
          </div>
    );
  }
}
