@wulperstudio/cms
Version:
Wulper Studio Library Components CMS
113 lines (112 loc) • 3.58 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.WrapperOption = exports.WrapperCenterButton = exports.WrapperBottomBar = exports.Text = exports.CenterButton = void 0;
var _material = require("@mui/material");
var WrapperBottomBar = exports.WrapperBottomBar = (0, _material.styled)('div', {
shouldForwardProp: function shouldForwardProp(prop) {
return prop !== 'backgroundColor' && prop !== 'isDivider';
}
})(function (_ref) {
var backgroundColor = _ref.backgroundColor,
isDivider = _ref.isDivider,
theme = _ref.theme;
return Object.assign({
width: '100%',
height: 60,
display: 'flex',
justifyContent: 'space-around',
alignItems: 'center',
backgroundColor: backgroundColor,
position: 'relative',
zIndex: 1000,
padding: '0px 10px'
}, isDivider && {
borderTop: "1px solid ".concat(theme.palette.divider)
});
});
var WrapperOption = exports.WrapperOption = (0, _material.styled)('div', {
shouldForwardProp: function shouldForwardProp(prop) {
return prop !== 'active' && prop !== 'isTextEnabled' && prop !== 'activeColor';
}
})(function (_ref2) {
var active = _ref2.active,
isTextEnabled = _ref2.isTextEnabled,
activeColor = _ref2.activeColor;
return {
color: active ? activeColor : '#B2BEDA',
padding: isTextEnabled ? '5px 10px' : '13px 20px',
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
cursor: 'pointer',
'&:hover': {
backgroundColor: 'rgba(255,255,255,0.04)',
borderRadius: 5
}
};
});
var Text = exports.Text = (0, _material.styled)('p', {
shouldForwardProp: function shouldForwardProp(prop) {
return prop !== 'active' && prop !== 'activeColor';
}
})(function (_ref3) {
var active = _ref3.active,
activeColor = _ref3.activeColor;
return {
padding: 0,
margin: 0,
color: active ? activeColor : '#B2BEDA',
fontSize: '12px',
fontWeight: 500
};
});
var CenterButton = exports.CenterButton = (0, _material.styled)('div', {
shouldForwardProp: function shouldForwardProp(prop) {
return prop !== 'foregroundColor' && prop !== 'floatIconColor';
}
})(function (_ref4) {
var floatIconColor = _ref4.floatIconColor;
return {
minWidth: 50,
minHeight: 50,
backgroundColor: floatIconColor,
borderRadius: '50%',
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
alignItems: 'center',
color: 'white',
cursor: 'pointer'
};
});
var WrapperCenterButton = exports.WrapperCenterButton = (0, _material.styled)('div', {
shouldForwardProp: function shouldForwardProp(prop) {
return prop !== 'foregroundColor' && prop !== 'borderVariant';
}
})(function (_ref5) {
var foregroundColor = _ref5.foregroundColor,
borderVariant = _ref5.borderVariant;
return Object.assign({}, borderVariant === 'none' && {
background: "linear-gradient(0deg, ".concat(foregroundColor, " 0%, transparent 0%)")
}, borderVariant === 'middle' && {
background: "linear-gradient(0deg, ".concat(foregroundColor, " 49%, transparent 50%)")
}, borderVariant === 'contained' && {
background: "linear-gradient(0deg, ".concat(foregroundColor, " 100%, transparent 0%)")
}, {
borderRadius: '50%',
padding: 5,
position: 'relative',
top: -10
// bottom: '50%',
// transform: 'translate(-50%, -50%)',
// [theme.breakpoints.down('md')]: {
// position: 'unset',
// top: 'unset',
// bottom: 'unset',
// transform: 'unset',
// },
});
});