reset icon color
This commit is contained in:
parent
bc9617beb2
commit
a252655b2f
2 changed files with 42 additions and 15 deletions
|
|
@ -1,7 +1,36 @@
|
||||||
|
import React from "react";
|
||||||
|
|
||||||
const ResetIcon = () => {
|
interface ResetIconProps {
|
||||||
|
width?: number;
|
||||||
|
height?: number;
|
||||||
|
color?: string;
|
||||||
|
className?: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
const ResetIcon: React.FC<ResetIconProps> = ({
|
||||||
|
width = 20,
|
||||||
|
height = 20,
|
||||||
|
className = "",
|
||||||
|
}) => {
|
||||||
return (
|
return (
|
||||||
<svg fill="none" height="20" viewBox="0 0 20 20" width="20" xmlns="http://www.w3.org/2000/svg"><g stroke="#de689e" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5"><path d="m13.5 8.5h3v-3"/><path d="m13.775 14c-.7863.7419-1.7737 1.2356-2.8389 1.4196-1.06527.1839-2.16109.0498-3.15057-.3855s-1.82875-1.1525-2.41293-2.0621c-.58419-.9095-.88739-1.9711-.87172-3.05197.01567-1.08089.34952-2.13319.95982-3.02543.61031-.89224 1.47001-1.58485 2.4717-1.99129s2.1009-.50868 3.1604-.29396c1.0595.21473 2.0322.7369 2.7965 1.50127l2.6107 2.38938"/></g></svg>
|
<svg
|
||||||
|
width={width}
|
||||||
|
height={height}
|
||||||
|
viewBox="0 0 20 20"
|
||||||
|
fill="none"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className={className}
|
||||||
|
>
|
||||||
|
<g
|
||||||
|
stroke={"currentColor"}
|
||||||
|
strokeLinecap="round"
|
||||||
|
strokeLinejoin="round"
|
||||||
|
strokeWidth="1.5"
|
||||||
|
>
|
||||||
|
<path d="m13.5 8.5h3v-3" />
|
||||||
|
<path d="m13.775 14c-.7863.7419-1.7737 1.2356-2.8389 1.4196-1.06527.1839-2.16109.0498-3.15057-.3855s-1.82875-1.1525-2.41293-2.0621c-.58419-.9095-.88739-1.9711-.87172-3.05197.01567-1.08089.34952-2.13319.95982-3.02543.61031-.89224 1.47001-1.58485 2.4717-1.99129s2.1009-.50868 3.1604-.29396c1.0595.21473 2.0322.7369 2.7965 1.50127l2.6107 2.38938" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -7,16 +7,14 @@ interface ResetButtonProps {
|
||||||
className?: string;
|
className?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const ResetButton: React.FC<ResetButtonProps> = React.memo(({
|
export const ResetButton: React.FC<ResetButtonProps> = React.memo(
|
||||||
onClick,
|
({ onClick, disabled = false, className = "" }) => (
|
||||||
disabled = false,
|
<button
|
||||||
className = ""
|
className={`p-1 hover:bg-logo-primary/30 active:bg-logo-primary/50 active:translate-y-[1px] rounded fill-text hover:cursor-pointer hover:border-logo-primary border border-transparent transition-all duration-150 text-text/80 ${className}`}
|
||||||
}) => (
|
onClick={onClick}
|
||||||
<button
|
disabled={disabled}
|
||||||
className={`p-1 hover:bg-logo-primary/30 active:bg-logo-primary/50 active:translate-y-[1px] rounded fill-text hover:cursor-pointer hover:border-logo-primary border border-transparent transition-all duration-150 ${className}`}
|
>
|
||||||
onClick={onClick}
|
<ResetIcon />
|
||||||
disabled={disabled}
|
</button>
|
||||||
>
|
),
|
||||||
<ResetIcon />
|
);
|
||||||
</button>
|
|
||||||
));
|
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue