system-copyright-react/src/components/arrow/Arrow.tsx
2024-03-15 18:18:29 +08:00

23 lines
759 B
TypeScript

import './arrow.css';
import {IArrow} from "../../interfaces/arrow/IArrow.ts";
import {ReactNode} from "react";
export default function Arrow(props: IArrow) {
const renderLineBlock = () => {
const blockArray: ReactNode[] = [];
const size:number = parseInt(((props.width - 20) / 20).toFixed(0));
for(let i = 0; i < size; i++) {
blockArray.push(<div className="arrow-line-block" style={{backgroundColor: props.color}}></div>)
}
return blockArray;
}
return (
<div className="arrow" style={{width: props.width}}>
<div className="arrow-line">{renderLineBlock()}</div>
<div className="arrow-head" style={{borderLeftColor: props.color}}></div>
</div>
)
}