@wulperstudio/cms
Version:
Wulper Studio Library Components CMS
60 lines (59 loc) • 1.85 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.WrapperImage = exports.WrapperComponent = exports.WrapperCard = exports.Image = void 0;
var _material = require("@mui/material");
var WrapperComponent = exports.WrapperComponent = (0, _material.styled)('div', {
shouldForwardProp: function shouldForwardProp(prop) {
return prop !== 'urlImage' && prop !== 'variant';
}
})(function (_ref) {
var urlImage = _ref.urlImage,
variant = _ref.variant;
return {
boxSizing: 'border-box',
width: '100%',
maxWidth: 310,
height: '100%',
maxHeight: '100%',
borderRadius: 10,
backgroundImage: variant === 'fixed' ? "url(".concat(urlImage, ")") : undefined,
backgroundPosition: variant === 'fixed' ? 'center center' : undefined,
backgroundRepeat: variant === 'fixed' ? 'no-repeat' : undefined,
backgroundSize: variant === 'fixed' ? 'cover' : undefined,
padding: '15px 10px',
display: 'flex',
flexDirection: variant === 'fixed' ? 'row' : 'column',
justifyContent: 'center',
alignItems: variant === 'fixed' ? 'flex-end' : 'center',
rowGap: 10
};
});
var WrapperCard = exports.WrapperCard = (0, _material.styled)('div')({
width: '100%'
});
var WrapperImage = exports.WrapperImage = (0, _material.styled)('div')(function (_ref2) {
var theme = _ref2.theme;
return {
position: 'relative',
borderRadius: 10,
width: 280,
height: 340,
'&::before': {
content: "''",
position: 'absolute',
width: '100%',
height: '100%',
border: "5px solid ".concat(theme.palette.primary.main),
transform: 'rotate(4deg)',
zIndex: -1,
borderRadius: 'inherit'
}
};
});
var Image = exports.Image = (0, _material.styled)('img')({
objectFit: 'cover',
objectPosition: 'center',
borderRadius: 10
});