@kubit-ui-web/react-components
Version:
Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience
50 lines • 1.6 kB
JavaScript
export const transformShadow = (radius) => ({
transform_style: 'preserve-3d',
transform: 'translateZ(1px)',
position: 'relative',
border_radius: radius,
});
export const shadowAfterStyles = (radius, color, width, height) => ({
before: {
display: 'block',
content: '',
position: 'absolute',
bottom: `calc(-${width} * 2)`,
right: `calc(-${width} * 2)`,
width: `calc(100% + ${width})`,
height: height ? height : '100%',
background_color: color,
border_radius: radius,
transform: 'translateZ(-1px)',
},
});
export const shadowAfterStylesSpecificProps = (radius, color, pixelsTranslation, width, height, right, top) => ({
before: {
display: 'block',
content: '',
position: 'absolute',
top: top,
bottom: `calc(-${pixelsTranslation} * 2)`,
right: right ? right : `calc(-${pixelsTranslation} * 2)`,
width: width ? width : `calc(100% + ${width})`,
height: height ? height : '100%',
background_color: color,
border_radius: radius,
transform: 'translateZ(-1px)',
},
});
export const shadowBeforeStyles = (radius, color, width) => ({
before: {
display: 'block',
content: '',
position: 'absolute',
bottom: `calc(-${width} * 2)`,
right: `calc(-${width} * 2)`,
width: `calc(100% + ${width})`,
height: '100%',
background_color: color,
border_radius: radius,
transform: 'translateZ(-1px)',
},
});
//# sourceMappingURL=wireframe.js.map