@ddsys/material
Version:
<p> <a href="https://bhp-dev.gitlab.io/dds-digital-design-system/">Read the docs</a> · <a href="mailto:UserExperience@bhpbilliton.com">Request feature</a> </p>
22 lines (20 loc) • 657 B
JavaScript
import Color from "color";
export default function(theme) {
const { colors, variables } = theme;
const { common, fonts } = variables;
return {
style: {
borderRadius: `${common.spacing / 4}rem`,
fontSize: `${fonts.size.normal}rem`,
padding: "10px 12px",
transition:
"border-color 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms",
"&:focus": {
backgroundColor: colors.white,
outline: 0,
borderColor: Color(colors.bhp_blue_3).lighten(common.lighten).hex(),
boxShadow: `0 0 0 0.2rem ${Color(colors.blue).alpha(0.25)}`
}
}
};
}