oolib 2.149.1 → 2.149.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -42,6 +42,6 @@ var Playground = function (args) {
|
|
|
42
42
|
return (react_1.default.createElement(Container_1.Container, null,
|
|
43
43
|
react_1.default.createElement(Paddings_1.PaddingTopBottom30, null,
|
|
44
44
|
react_1.default.createElement(Wrappers_1.Wrapper1500, { left: true },
|
|
45
|
-
react_1.default.createElement(WrapperCardGrid_1.WrapperCardGrid, null, (0, makeArrayFromLength_1.makeArrayFromLength)(50).map(function (d) { return (react_1.default.createElement(index_1.CardContent, __assign({}, props, { config: props.config }))); }))))));
|
|
45
|
+
react_1.default.createElement(WrapperCardGrid_1.WrapperCardGrid, null, (0, makeArrayFromLength_1.makeArrayFromLength)(50).map(function (d, i) { return (react_1.default.createElement(index_1.CardContent, __assign({}, props, { data: i === 1 ? (__assign(__assign({}, props.data), { title: 'Hello' })) : props.data, config: props.config }))); }))))));
|
|
46
46
|
};
|
|
47
47
|
exports.Playground = Playground;
|
|
@@ -53,24 +53,25 @@ var CardContent = function (_a) {
|
|
|
53
53
|
var HighLightIcon = highlight === 'secondary' ? Star : CrownSimple;
|
|
54
54
|
return (react_1.default.createElement(LinkComp, { target: target, href: (0, injectHttps_1.injectHttps)(to), to: to },
|
|
55
55
|
react_1.default.createElement(styled_2.StyledCardWrapper, { id: id, highlight: highlight, onClick: onClick ? function (e) { return onClick(e, data); } : undefined },
|
|
56
|
-
|
|
57
|
-
react_1.default.createElement(
|
|
58
|
-
|
|
59
|
-
react_1.default.createElement(
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
react_1.default.createElement(
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
react_1.default.createElement(
|
|
68
|
-
react_1.default.createElement(
|
|
69
|
-
|
|
70
|
-
react_1.default.createElement(
|
|
71
|
-
|
|
56
|
+
react_1.default.createElement("div", null,
|
|
57
|
+
showEmbedSection ? (react_1.default.createElement(styled_2.StyledEmbedSection, null,
|
|
58
|
+
react_1.default.createElement(CardLabelTag, { label: cardLabel, isEmbedPresent: showEmbedSection, isHighlightPresent: highlight, statusTagVariant: statusTagVariant }),
|
|
59
|
+
(0, mediaDataExists_1.imageDataExists)(image) ? (react_1.default.createElement("div", { style: { width: "100%" } }, react_1.default.createElement(ImageInput_1.ImageInput, { value: image, aspectRatio: "5/3", readOnly: true, defaultImageSpread: "cover", enableCaptions: false, disableImageBorder: true }))) : (0, mediaDataExists_1.videoDataExists)(video) ? (react_1.default.createElement("div", { style: { width: "100%", position: 'relative' } },
|
|
60
|
+
react_1.default.createElement(VideoInput_1.default, { value: video, readOnly: true, light: true }),
|
|
61
|
+
react_1.default.createElement("div", { style: { position: 'absolute', top: 0, left: 0, width: '100%', height: '100%' } }))) : (react_1.default.createElement(ImagePlaceholder_1.ImagePlaceholder, { title: title })))) : (react_1.default.createElement(styled_2.StyledCardLabelAndStatusTagWrapper, null,
|
|
62
|
+
react_1.default.createElement(CardLabelTag, { label: cardLabel, isEmbedPresent: showEmbedSection, isHighlightPresent: highlight }),
|
|
63
|
+
react_1.default.createElement(StatusTag, { display: tagDisplay, isEmbedPresent: showEmbedSection, isHighlightPresent: highlight, statusTagVariant: statusTagVariant }))),
|
|
64
|
+
highlight && react_1.default.createElement(styled_2.StyledStarWrapper, { highlight: highlight },
|
|
65
|
+
react_1.default.createElement(HighLightIcon, { size: 18, color: white, weight: "fill", style: { filter: "drop-shadow(0px 2px 8.2px rgba(0, 0, 0, 0.50 ))" } })),
|
|
66
|
+
showEmbedSection && (react_1.default.createElement(StatusTag, { display: tagDisplay, isEmbedPresent: showEmbedSection, isHighlightPresent: highlight, statusTagVariant: statusTagVariant })),
|
|
67
|
+
title ? (react_1.default.createElement(styled_2.StyledTitleWrapper, { highlight: highlight, showEmbedSection: showEmbedSection },
|
|
68
|
+
react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 6 },
|
|
69
|
+
react_1.default.createElement(styled_1.StyledTitle, { capitalize: true, className: "StyledTitle" }, localize(title))))) : null,
|
|
70
|
+
description ? (react_1.default.createElement(styled_2.StyledDescription, null,
|
|
71
|
+
react_1.default.createElement(LineClampWrapper_1.LineClampWrapper, { noOfLines_M: 6 }, description))) : null),
|
|
72
|
+
react_1.default.createElement("div", null, (metaBlock === null || metaBlock === void 0 ? void 0 : metaBlock.length) > 0 ? (
|
|
72
73
|
//show only two meta for cardContent
|
|
73
74
|
react_1.default.createElement(styled_2.StyledMetaBlockWrapper, null,
|
|
74
|
-
react_1.default.createElement(MetaBlock_1.default, { data: data, config: metaBlock }))) : null)));
|
|
75
|
+
react_1.default.createElement(MetaBlock_1.default, { data: data, config: metaBlock }))) : null))));
|
|
75
76
|
};
|
|
76
77
|
exports.CardContent = CardContent;
|
|
@@ -13,7 +13,7 @@ var colors_1 = require("../../../themes/colors");
|
|
|
13
13
|
var Typo2_1 = require("../../Typo2");
|
|
14
14
|
var white = colors_1.colors.white, grey10 = colors_1.colors.grey10, grey50 = colors_1.colors.grey50, grey60 = colors_1.colors.grey60, yellowBG = colors_1.colors.yellowBG, yellowStroke = colors_1.colors.yellowStroke, shadowDefault = colors_1.colors.shadowDefault, shadowHover = colors_1.colors.shadowHover, yellow = colors_1.colors.yellow, meadow = colors_1.colors.meadow, meadowBG = colors_1.colors.meadowBG, meadowStroke = colors_1.colors.meadowStroke;
|
|
15
15
|
exports.StyledEmbedSection = styled_components_1.default.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n max-height: 182px;\n width: 100%;\n border-radius: 4px;\n overflow: hidden;\n display: flex;\n align-items: center;\n margin-bottom: 8px;\n"], ["\n max-height: 182px;\n width: 100%;\n border-radius: 4px;\n overflow: hidden;\n display: flex;\n align-items: center;\n margin-bottom: 8px;\n"])));
|
|
16
|
-
exports.StyledCardWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 100%;\n border: 1px solid ", ";\n background-color: ", ";\n cursor: pointer;\n position: relative;\n padding: 12px;\n width: 100%;\n /* max-width: 450px; */\n border-radius: 8px;\n box-shadow: 0px 4px 10px 0px ", ";\n \n &:hover {\n border: ", ";\n box-shadow: 0px 4px 10px 0px ", ";\n }\n"], ["\n height: 100%;\n border: 1px solid ", ";\n background-color: ", ";\n cursor: pointer;\n position: relative;\n padding: 12px;\n width: 100%;\n /* max-width: 450px; */\n border-radius: 8px;\n box-shadow: 0px 4px 10px 0px ", ";\n \n &:hover {\n border: ", ";\n box-shadow: 0px 4px 10px 0px ", ";\n }\n"])), function (_a) {
|
|
16
|
+
exports.StyledCardWrapper = styled_components_1.default.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n height: 100%;\n border: 1px solid ", ";\n background-color: ", ";\n cursor: pointer;\n position: relative;\n padding: 12px;\n width: 100%;\n /* max-width: 450px; */\n border-radius: 8px;\n box-shadow: 0px 4px 10px 0px ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n \n &:hover {\n border: ", ";\n box-shadow: 0px 4px 10px 0px ", ";\n }\n"], ["\n height: 100%;\n border: 1px solid ", ";\n background-color: ", ";\n cursor: pointer;\n position: relative;\n padding: 12px;\n width: 100%;\n /* max-width: 450px; */\n border-radius: 8px;\n box-shadow: 0px 4px 10px 0px ", ";\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n \n &:hover {\n border: ", ";\n box-shadow: 0px 4px 10px 0px ", ";\n }\n"])), function (_a) {
|
|
17
17
|
var highlight = _a.highlight;
|
|
18
18
|
return highlight === "secondary" ? yellowStroke : highlight === "primary" ? meadowStroke : grey10;
|
|
19
19
|
}, function (_a) {
|
|
@@ -41,5 +41,5 @@ exports.StyledStarWrapper = styled_components_1.default.div(templateObject_8 ||
|
|
|
41
41
|
var highlight = _a.highlight;
|
|
42
42
|
return highlight === "secondary" ? yellow : highlight === "primary" ? meadow : white;
|
|
43
43
|
});
|
|
44
|
-
exports.StyledMetaBlockWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n color: ", ";\n font-family: ", ";\n"], ["\n color: ", ";\n font-family: ", ";\n"])), grey50, Typo2_1.UI_CAPTION);
|
|
44
|
+
exports.StyledMetaBlockWrapper = styled_components_1.default.div(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n color: ", ";\n font-family: ", ";\n padding-top: 0.2rem;\n"], ["\n color: ", ";\n font-family: ", ";\n padding-top: 0.2rem;\n"])), grey50, Typo2_1.UI_CAPTION);
|
|
45
45
|
var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9;
|