Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
import styled from "styled-components";
import { colors as colorConstants } from "@crave/farmblocks-theme";
const StyledInfo = styled.div`
display: flex;
align-items: baseline;
.icon {
display: inline-block;
margin: 0 4px;
cursor: pointer;
color: ${colorConstants.OYSTER};
.farmblocks-icon {
font-size: 1.2em;
}
}
.icon:hover, .hovered {
color: ${colorConstants.INDIGO_MILK_CAP};
}
}`;
export default StyledInfo;
const fontColor = props => {
if (props.selected && !props.highlighted) {
return colorConstants.INDIGO_MILK_CAP;
}
return colorConstants.OYSTER;
};
PRIMARY,
NEUTRAL,
SECONDARY,
POSITIVE,
NEGATIVE,
CLOSED,
OFF_NEUTRAL,
} from "./buttonTypes";
export default {
[PRIMARY]: {
color: colorConstants.TANGERINE,
hoverColor: colorConstants.TANGERINE_2,
},
[NEUTRAL]: {
textColor: colorConstants.OYSTER,
iconColor: colorConstants.GREY_32,
textHoverColor: colorConstants.INDIGO_MILK_CAP,
color: "#FFFFFF",
},
[SECONDARY]: {
color: colorConstants.INDIGO_MILK_CAP,
hoverColor: colorConstants.BLUE_CORN,
},
[POSITIVE]: {
color: colorConstants.LETTUCE,
hoverColor: colorConstants.AVOCADO,
},
[NEGATIVE]: {
color: colorConstants.STRAWBERRY,
hoverColor: colorConstants.TOMATO,
},
background-color: ${colorConstants.INDIGO_MILK_CAP};
color: white;
&:hover {
border-color: ${colorConstants.GREY_32};
background-color: ${colorConstants.BLUE_CORN};
}
&:hover .close-icon,
&:focus .close-icon {
color: white;
}
`,
[tagTypes.NEUTRAL]: css`
background-color: ${colorConstants.SUGAR};
color: ${colorConstants.OYSTER};
&:hover {
background-color: ${colorConstants.GREY_16};
}
`,
};
const disabledStyles = {
[tagTypes.SECONDARY]: css`
background-color: ${colorConstants.GREY_32};
pointer-events: none;
padding: 6px 14px 8px 15px;
`,
};
const StyledTag = styled.div`