forked from Gitlink/forgeplus-react
35 lines
1.3 KiB
JavaScript
35 lines
1.3 KiB
JavaScript
import React, { useState } from "react";
|
||
import "./contactFloat.scss";
|
||
import { Icon } from "antd";
|
||
|
||
export default function ContactFloat() {
|
||
const [isExpanded, setIsExpanded] = useState(false);
|
||
|
||
return (
|
||
<div className={`contact-float ${isExpanded ? "expanded" : ""}`}>
|
||
<div className="contact-float-toggle" onClick={() => setIsExpanded(!isExpanded)}>
|
||
<Icon type={isExpanded ? "close" : "customer-service"} />
|
||
<span className="contact-float-text">{isExpanded ? "收起" : "联系我们"}</span>
|
||
</div>
|
||
|
||
<div className="contact-float-content">
|
||
<div className="contact-float-tip">活动专属咨询:扫码添加,快速解答您的疑问</div>
|
||
|
||
<div className="contact-float-qrcode">
|
||
<img src={require("../image/wechat-qrcode.png")} alt="微信二维码" width={120} height={120} />
|
||
</div>
|
||
|
||
<div className="contact-float-wechat">
|
||
<div className="contact-float-wechat-label">微信</div>
|
||
<div className="contact-float-wechat-id">GR</div>
|
||
</div>
|
||
|
||
<div className="contact-float-email">
|
||
<div className="contact-float-wechat-label">邮箱</div>
|
||
<div className="contact-float-wechat-id">gr@chancefoundation.org.cn</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|