Commit d8c00bb9 authored by Chunchi Che's avatar Chunchi Che

optimize ui

parent cf3b4bb2
Pipeline #21065 passed with stages
in 15 minutes and 51 seconds
......@@ -14,11 +14,12 @@ import {
setCheckCardModalIsOpen,
} from "../../reducers/duel/mod";
import { Button, Row, Col, Popover } from "antd";
import { CheckCard } from "@ant-design/pro-components";
import { CheckCard, CheckCardProps } from "@ant-design/pro-components";
import {
sendSelectCardResponse,
sendSelectChainResponse,
} from "../../api/ocgcore/ocgHelper";
import { ThunderboltOutlined } from "@ant-design/icons";
import NeosConfig from "../../../neos.config.json";
import DragModal from "./dragModal";
......@@ -108,15 +109,8 @@ const CheckCardModal = () => {
{tab.options.map((option, idx) => {
return (
<Col span={4} key={idx}>
<Popover
content={
<div>
<p>{option.name}</p>
<p>{option.effectDesc}</p>
</div>
}
>
<CheckCard
<HoverCheckCard
hoverContent={option.effectDesc}
title={option.name}
description={option.desc}
style={{ width: 120 }}
......@@ -129,7 +123,6 @@ const CheckCardModal = () => {
}
value={option.response}
/>
</Popover>
</Col>
);
})}
......@@ -141,4 +134,28 @@ const CheckCardModal = () => {
);
};
const HoverCheckCard = (props: CheckCardProps & { hoverContent?: string }) => {
const [hover, setHover] = useState(false);
const onMouseEnter = () => setHover(true);
const onMouseLeave = () => setHover(false);
return (
<>
<CheckCard {...props} />
{props.hoverContent ? (
<Popover content={<p>{props.hoverContent}</p>} open={hover}>
<Button
icon={<ThunderboltOutlined />}
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
></Button>
</Popover>
) : (
<></>
)}
</>
);
};
export default CheckCardModal;
......@@ -8,7 +8,6 @@ import {
selectMeInitInfo,
selectOpInitInfo,
} from "../../reducers/duel/initInfoSlice";
import { selectCurrentPlayerIsMe } from "../../reducers/duel/turnSlice";
import { selectWaiting } from "../../reducers/duel/mod";
const Config = NeosConfig.ui.status;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment