35 lines
830 B
TypeScript
35 lines
830 B
TypeScript
import "./spoolIcon.css";
|
|
|
|
interface Props {
|
|
color: string | { colors: string[]; vertical: boolean };
|
|
size?: "small" | "large";
|
|
no_margin? : boolean
|
|
}
|
|
|
|
export default function SpoolIcon(props: Readonly<Props>) {
|
|
let dirClass = "vertical";
|
|
let cols = [];
|
|
let size = props.size ? props.size : "small";
|
|
let no_margin = props.no_margin ? "no-margin" : "";
|
|
|
|
if (typeof props.color === "string") {
|
|
cols = [props.color];
|
|
} else {
|
|
dirClass = props.color.vertical ? "vertical" : "horizontal";
|
|
cols = props.color.colors;
|
|
}
|
|
|
|
return (
|
|
<div className={"spool-icon " + dirClass + " " + size + " " + no_margin}>
|
|
{cols.map((col) => (
|
|
<div
|
|
key={col}
|
|
style={{
|
|
backgroundColor: "#" + col.replace("#", ""),
|
|
}}
|
|
></div>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|