@raona/components
Version:
React components used at Raona to work with SPFx
51 lines (50 loc) • 3.51 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
Object.defineProperty(exports, "__esModule", { value: true });
var React = require("react");
var react_1 = require("react");
var stylesConstants_1 = require("../stylesConstants");
exports.NewsCardFullBody = function (props) {
var bodyStyles = props.bodyStyles, item = props.item, newsBodyStyle = props.newsBodyStyle;
var title = item.title, date = item.date, others = item.others, imageUrl = item.imageUrl, hasVideo = item.hasVideo, showText = item.showText, isDraft = item.isDraft, category = item.category;
var otherLabels;
if (others) {
otherLabels = others.join(', ');
}
var styles = bodyStyles ? __assign({}, bodyStyles) : __assign({}, stylesConstants_1.productBodyStyles); //Default Styles for this component
var newsStyles = newsBodyStyle ? __assign({}, newsBodyStyle) : __assign({}, stylesConstants_1.newsConstantBodyStyles);
var cardColor = item.colorToPrint ? item.colorToPrint : (Math.random() < 0.5 ? '#7C7C7C' : '#005eb8');
return (
// <Fragment>
// <div className='card__meta card__meta--left'>
// <span className='card__metaCat' style={{ backgroundColor: isDraft ? '#005eb8' : '#fff', color: isDraft ? '#fff' : (imageUrl ? '#7C7C7C' : cardColor) }}>{isDraft ? 'NEWS DRAFT' : 'NEWS'}</span>
// </div>
// <div className={`card__header card__header--full ${imageUrl ? '' : ' card__header--noImg'} ${hasVideo ? ' card__header--video' : ''} ${isDraft ? ' card__header--draft' : ''}`}>
// <span className='card__img card__img--full' style={{ backgroundImage: imageUrl ? `url(${imageUrl})` : '', backgroundColor: cardColor }}> </span>
// </div>
// <div className={styles.bodyDiv}>
// {showText && <p className={styles.title}>{title}</p>}
// <p className={styles.info}>{date} <span className={styles.category}>{otherLabels}</span></p>
// </div>
// </Fragment>
React.createElement(react_1.Fragment, null,
React.createElement("div", { className: newsStyles.metacard__metaleft }, category !== 'group' && React.createElement("span", { className: newsStyles.metaCat, style: { backgroundColor: isDraft ? '#005eb8' : '#fff', color: isDraft ? '#fff' : (imageUrl ? '#7C7C7C' : cardColor) } }, isDraft ? 'NEWS DRAFT' : 'NEWS')),
React.createElement("div", { className: newsStyles.headerfull + " " + (imageUrl ? '' : newsStyles.headernoImg) + " " + (hasVideo ? newsStyles.headervideo : '') + " " + (isDraft ? newsStyles.headerdraft : '') },
React.createElement("span", { className: newsStyles.imgfull, style: { backgroundImage: imageUrl ? "url(\"" + imageUrl + "\")" : '', backgroundColor: cardColor } }, " ")),
React.createElement("div", { className: styles.bodyDiv },
showText && React.createElement("p", { className: styles.title, title: title }, title),
React.createElement("p", { className: styles.info },
date,
" ",
React.createElement("span", { className: styles.category }, otherLabels)))));
};
;