Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
render() {
const { className, cssModule, header, mainText, icon, color, children, variant, ...attributes } = this.props;
// demo purposes only
const padding = (variant === '0' ? { card: 'p-3', icon: 'p-3', lead: 'mt-2' } : (variant === '1' ? {
card: 'p-0', icon: 'p-4', lead: 'pt-3',
} : { card: 'p-0', icon: 'p-4 px-5', lead: 'pt-3' }));
const card = { style: 'clearfix', color: color, icon: icon, classes: '' };
card.classes = mapToCssModules(classNames(className, card.style, padding.card), cssModule);
const lead = { style: 'h5 mb-0', color: color, classes: '' };
lead.classes = classNames(lead.style, 'text-' + card.color, padding.lead);
const blockIcon = function (icon) {
const classes = classNames(icon, 'bg-' + card.color, padding.icon, 'font-2xl mr-3 float-left');
return (<i></i>);
};
return (
{blockIcon(card.icon)}
<p>{header}</p>
<p>{mainText}</p>
render() {
const {className, cssModule, header, icon, color, value, children, invert, ...attributes} = this.props;
// demo purposes only
const progress = {style: "", color: color, value: value};
const card = {style: "", bgColor: "", icon: icon};
if (invert) {
progress.style = "progress-white";
progress.color = "";
card.style = "text-white";
card.bgColor = 'bg-' + color;
}
const classes = mapToCssModules(classNames(className, card.style, card.bgColor), cssModule);
progress.style = classNames("progress-xs mt-3 mb-0", progress.style);
return (
<div>
<i></i>
</div>
<div>{ header }</div>
<small>{ children }</small>
<progress value="{" color="{">
</progress>
)
}
}
} = this.props
// demo purposes only
const padding =
variant === '0'
? { card: 'p-3', icon: 'p-3', lead: 'mt-2' }
: variant === '1'
? {
card: 'p-0',
icon: 'p-4',
lead: 'pt-3'
}
: { card: 'p-0', icon: 'p-4 px-5', lead: 'pt-3' }
const card = { style: 'clearfix', color: color, icon: icon, classes: '' }
card.classes = mapToCssModules(
classNames(className, card.style, padding.card),
cssModule
)
const lead = { style: 'h5 mb-0', color: color, classes: '' }
lead.classes = classNames(lead.style, 'text-' + card.color, padding.lead, 'text-capitalize')
const blockIcon = function (icon) {
const classes = classNames(
icon,
'bg-' + card.color,
padding.icon,
'font-2xl mr-3 float-left'
)
return <i>
}</i>
render() {
const {className, cssModule, header, mainText, icon, color, footer, link, children, variant, ...attributes} = this.props;
// demo purposes only
const padding = (variant === '0' ? {card: "p-3", icon: "p-3", lead: "mt-2"} : ( variant === "1" ? {
card: "p-0", icon: "p-4", lead: "pt-3" } : {card: "p-0", icon: "p-4 px-5", lead: "pt-3"}));
const card = {style: "clearfix", color: color, icon: icon, classes: ""};
card.classes = mapToCssModules(classNames(className, card.style, padding.card), cssModule);
const lead = {style: "h5 mb-0", color: color, classes: ""};
lead.classes = classNames(lead.style, 'text-' + card.color, padding.lead);
const blockIcon = function (icon) {
const classes = classNames(icon, 'bg-' + card.color, padding.icon, "font-2xl mr-3 float-left");
return (<i></i>);
};
const cardFooter = function () {
if (footer) {
return (
<a href="{link}">View More
<i></i></a>
render() {
const {className, cssModule, header, mainText, smallText, color, value, children, variant, ...attributes} = this.props;
// demo purposes only
const progress = {style: "", color: color, value: value};
const card = {style: "", bgColor: ""};
if (variant === "inverse") {
progress.style = "progress-white";
progress.color = "";
card.style = "text-white";
card.bgColor = 'bg-' + color;
}
const classes = mapToCssModules(classNames(className, card.style, card.bgColor), cssModule);
progress.style = classNames("progress-xs my-3", progress.style);
return (
<div>{ header }</div>
<div>{ mainText }</div>
<progress value="{" color="{">
<small>{ smallText }</small>
<div>{children}</div>
</progress>
)
}
}
const data = dataBox();
const variant = data.variant;
if (!variant || ['facebook', 'twitter', 'linkedin', 'google-plus'].indexOf(variant) < 0) {
return (null);
}
const back = 'bg-' + variant;
const icon = 'fa fa-' + variant;
const keys = Object.keys(data);
const vals = Object.values(data);
const classCard = 'brand-card';
const classCardHeader = classNames(`${classCard}-header`, back);
const classCardBody = classNames(`${classCard}-body`);
const classes = mapToCssModules(classNames(classCard, className), cssModule);
return (
<div>
<div>
<i></i>
{children}
</div>
<div>
<div>
<div>{vals[1]}</div>
<div>{keys[1]}</div>
</div>
<div>
<div>{vals[2]}</div>
<div>{keys[2]}</div>
</div></div></div>
const data = dataBox();
const variant = data.variant;
if (!variant || ['facebook', 'twitter', 'linkedin', 'google-plus'].indexOf(variant) < 0) {
return (null);
}
const back = 'bg-' + variant;
const icon = 'fa fa-' + variant;
const keys = Object.keys(data);
const vals = Object.values(data);
const classCard = 'brand-card';
const classCardHeader = classNames(`${classCard}-header`, back);
const classCardBody = classNames(`${classCard}-body`);
const classes = mapToCssModules(classNames(classCard, className), cssModule);
return (
<div>
<div>
<i></i>
{children}
</div>
<div>
<div>
<div>{vals[1]}</div>
<div>{keys[1]}</div>
</div>
<div>
<div>{vals[2]}</div>
<div>{keys[2]}</div>
</div></div></div>