Files
outline/app/components/NudeButton.tsx
Tom Moor b9bf2e58cb feat: Add cursor style user preference (#4199)
* feat: Add cursor style user preference

* Remove headings for now
2022-10-01 04:39:45 -07:00

36 lines
875 B
TypeScript

import styled from "styled-components";
import ActionButton, {
Props as ActionButtonProps,
} from "~/components/ActionButton";
type Props = ActionButtonProps & {
width?: number | string;
height?: number | string;
size?: number;
type?: "button" | "submit" | "reset";
};
const NudeButton = styled(ActionButton).attrs((props: Props) => ({
type: "type" in props ? props.type : "button",
}))<Props>`
width: ${(props) =>
typeof props.width === "string"
? props.width
: `${props.width || props.size || 24}px`};
height: ${(props) =>
typeof props.height === "string"
? props.height
: `${props.height || props.size || 24}px`};
background: none;
border-radius: 4px;
display: inline-block;
line-height: 0;
border: 0;
padding: 0;
cursor: var(--pointer);
user-select: none;
color: inherit;
`;
export default NudeButton;