@stokr/components-library 2.3.22-beta.3 → 2.3.22-beta.4

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.
Files changed (4) hide show
  1. package/dist/components/BlogPost/BlogPost.js +1 -2
  2. package/dist/components/BlogPost/BlogPost.stories.js +3 -4
  3. package/dist/components/BlogPost/BlogPost.styles.js +16 -10
  4. package/package.json +1 -1
package/dist/components/BlogPost/BlogPost.js CHANGED
@@ -7,7 +7,6 @@ exports.default = exports.BlogPost = void 0;
7
7
  var _react = _interopRequireDefault(require("react"));
8
8
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
9
  var _BlogPost = require("./BlogPost.styles");
10
- var _Text = _interopRequireDefault(require("../Text/Text.styles"));
11
10
  var _breakdown = _interopRequireDefault(require("../breakdown"));
12
11
  var _excluded = ["layout", "category", "title", "description", "image", "date", "link", "CTAText"];
13
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -35,7 +34,7 @@ var BlogPost = function BlogPost(_ref) {
35
34
  alt: title
36
35
  })), /*#__PURE__*/_react.default.createElement(_BlogPost.Content, {
37
36
  layout: layout
38
- }, /*#__PURE__*/_react.default.createElement(_BlogPost.Category, null, category), /*#__PURE__*/_react.default.createElement(_BlogPost.TextWrapper, null, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, title), description && /*#__PURE__*/_react.default.createElement("p", null, description))), /*#__PURE__*/_react.default.createElement(_BlogPost.BottomRow, null, date && /*#__PURE__*/_react.default.createElement(_breakdown.default, null, date), /*#__PURE__*/_react.default.createElement(_BlogPost.StyledButton, {
37
+ }, /*#__PURE__*/_react.default.createElement(_BlogPost.Category, null, category), /*#__PURE__*/_react.default.createElement(_BlogPost.TextWrapper, null, /*#__PURE__*/_react.default.createElement("h3", null, title), description && layout !== 'image-fullscreen' && layout !== 'image-cover' && /*#__PURE__*/_react.default.createElement("p", null, description)), /*#__PURE__*/_react.default.createElement(_BlogPost.BottomRow, null, date && /*#__PURE__*/_react.default.createElement(_breakdown.default, null, date), /*#__PURE__*/_react.default.createElement(_BlogPost.StyledButton, {
39
38
  transparent: true,
40
39
  onClick: function onClick() {
41
40
  return window.location.href = link;
package/dist/components/BlogPost/BlogPost.stories.js CHANGED
@@ -104,16 +104,15 @@ var samplePosts = [{
104
104
  }, {
105
105
  layout: 'image-left',
106
106
  category: 'BITCOIN MINING',
107
- title: 'BMN Now Open for Trade',
108
- description: 'Trading for the BMN token is now fully live and active on the Bitfinex Securities Exchange.',
107
+ title: 'What Is Portfolio Diversification and What Does A Diversified Portfolio Look Like? What Is Portfolio Diversification and What Does A Diversified Portfolio Look Like?What Is Portfolio Diversification and What Does A Diversified Portfolio Look Like?',
108
+ description: 'Trading for the BMN token is now fully live and active on the Bitfinex Securities Exchange.Trading for the BMN token is now fully live and active on the Bitfinex Securities Exchange.Trading for the BMN token is now fully live and active on the Bitfinex Securities Exchange.',
109
109
  image: 'https://res.cloudinary.com/stokr/image/upload/v1694077746/cld-sample-2.jpg',
110
110
  date: '02 MAR 2022',
111
111
  link: '/blog/post-2'
112
112
  }, {
113
113
  layout: 'image-right',
114
114
  category: 'BITCOIN MINING',
115
- title: "T8 REASONS TO ",
116
- //USE BTCPAY SERVER FOR YOUR WEBSITE'S BITCOIN PAYMENTS`,
115
+ title: "T8 REASONS TO USE BTCPAY SERVER FOR YOUR WEBSITE'S BITCOIN PAYMENTS",
117
116
  // description:
118
117
  // 'Learn about the journey of Bitcoin mining and its various phases.',
119
118
  image: 'https://res.cloudinary.com/stokr/image/upload/v1627569252/STOKE_POST/version1_yb4tck.png',
package/dist/components/BlogPost/BlogPost.styles.js CHANGED
@@ -10,7 +10,7 @@ var _Button = _interopRequireDefault(require("../Button/Button.styles"));
10
10
  var _breakdown = _interopRequireDefault(require("../breakdown"));
11
11
  var _rwd = _interopRequireDefault(require("../../styles/rwd"));
12
12
  var _theme = _interopRequireDefault(require("../../styles/theme"));
13
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
13
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
14
14
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
15
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
16
16
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -18,16 +18,16 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
18
18
  var Container = _styledComponents.default.div.withConfig({
19
19
  displayName: "BlogPoststyles__Container",
20
20
  componentId: "sc-16n0gty-0"
21
- })(["position:relative;display:flex;flex-direction:", ";background:", ";height:100%;min-height:300px;max-height:500px;", ""], function (_ref) {
21
+ })(["position:relative;display:flex;flex-direction:", ";background:", ";height:100%;min-height:400px;max-height:540px;", " ", ""], function (_ref) {
22
22
  var layout = _ref.layout;
23
23
  return layout === 'image-right' ? 'column-reverse' : 'column';
24
- }, _theme.default.cWhite, _rwd.default.Medium(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n flex-direction: ", ";\n\n ", "\n "])), function (_ref2) {
24
+ }, _theme.default.cWhite, _rwd.default.Medium(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\n flex-direction: ", ";\n min-height: 500px;\n\n ", "\n "])), function (_ref2) {
25
25
  var layout = _ref2.layout;
26
26
  return layout === 'image-cover' || layout === 'image-fullscreen' ? 'column' : layout === 'image-right' ? 'row-reverse' : 'row';
27
27
  }, function (_ref3) {
28
28
  var layout = _ref3.layout;
29
29
  return layout === 'image-fullscreen' && (0, _styledComponents.css)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n grid-column: 1 / -1;\n "])));
30
- }));
30
+ }), _rwd.default.XLarge(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n min-height: 540px;\n "]))));
31
31
  exports.Container = Container;
32
32
  var ImageWrapper = _styledComponents.default.div.withConfig({
33
33
  displayName: "BlogPoststyles__ImageWrapper",
@@ -37,7 +37,7 @@ var ImageWrapper = _styledComponents.default.div.withConfig({
37
37
  return layout === 'image-cover' || layout === 'image-fullscreen' ? '1' : '0 0 50%';
38
38
  }, function (_ref5) {
39
39
  var layout = _ref5.layout;
40
- return (layout === 'image-cover' || layout === 'image-fullscreen') && (0, _styledComponents.css)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n &:after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.4);\n transition: background 0.3s ease;\n }\n "])));
40
+ return (layout === 'image-cover' || layout === 'image-fullscreen') && (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n &:after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.4);\n transition: background 0.3s ease;\n }\n "])));
41
41
  });
42
42
  exports.ImageWrapper = ImageWrapper;
43
43
  var Image = _styledComponents.default.img.withConfig({
@@ -53,19 +53,25 @@ var Content = _styledComponents.default.div.withConfig({
53
53
  return layout === 'image-cover' || layout === 'image-fullscreen' ? '0' : '1';
54
54
  }, function (_ref7) {
55
55
  var layout = _ref7.layout;
56
- return layout === 'image-cover' || layout === 'image-fullscreen' ? '32px' : '32px 0';
56
+ return layout === 'image-cover' || layout === 'image-fullscreen' ? '24px' : '16px 0';
57
57
  }, function (_ref8) {
58
58
  var layout = _ref8.layout;
59
59
  return layout === 'image-cover' || layout === 'image-fullscreen' ? 'absolute' : 'relative';
60
60
  }, function (_ref9) {
61
61
  var layout = _ref9.layout;
62
- return (layout === 'image-cover' || layout === 'image-fullscreen') && (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n bottom: 0;\n left: 0;\n right: 0;\n color: ", ";\n "])), _theme.default.cWhite);
63
- }, _rwd.default.Medium(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n gap: 24px;\n padding: 32px; \n "]))));
62
+ return (layout === 'image-cover' || layout === 'image-fullscreen') && (0, _styledComponents.css)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n bottom: 0;\n left: 0;\n right: 0;\n color: ", ";\n "])), _theme.default.cWhite);
63
+ }, _rwd.default.Medium(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n gap: 24px;\n padding: 24px; \n\n ", ";\n\n ", ";\n \n "])), function (_ref10) {
64
+ var layout = _ref10.layout;
65
+ return layout === 'image-left' && (0, _styledComponents.css)(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n padding-right: 0;\n "])));
66
+ }, function (_ref11) {
67
+ var layout = _ref11.layout;
68
+ return layout === 'image-right' && (0, _styledComponents.css)(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n padding-left: 0;\n "])));
69
+ }));
64
70
  exports.Content = Content;
65
71
  var TextWrapper = _styledComponents.default.div.withConfig({
66
72
  displayName: "BlogPoststyles__TextWrapper",
67
73
  componentId: "sc-16n0gty-4"
68
- })(["flex:1;overflow:hidden;display:flex;flex-direction:column;max-height:70%;h3{margin:0;line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word;max-height:100%;-webkit-line-clamp:unset;}p{margin:8px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;", "}"], _rwd.default.Medium(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n -webkit-line-clamp: 3;\n "]))));
74
+ })(["flex:1;overflow:hidden;display:flex;flex-direction:column;h3{font-weight:800;font-size:20px;line-height:30px;letter-spacing:1.41px;text-transform:uppercase;margin:0;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-word;-webkit-line-clamp:3;", " ", " ", "}p{font-weight:300;font-size:16px;line-height:24px;letter-spacing:0.6px;margin:24px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:2;", " ", "}"], _rwd.default.Mobile(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n -webkit-line-clamp: 4;\n "]))), _rwd.default.Medium(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n font-size: 22px;\n -webkit-line-clamp: 6;\n "]))), _rwd.default.Large(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n -webkit-line-clamp: 8;\n "]))), _rwd.default.Medium(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n -webkit-line-clamp: 3;\n\n "]))), _rwd.default.XLarge(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n -webkit-line-clamp: 4;\n "]))));
69
75
  exports.TextWrapper = TextWrapper;
70
76
  var BottomRow = _styledComponents.default.div.withConfig({
71
77
  displayName: "BlogPoststyles__BottomRow",
@@ -75,7 +81,7 @@ exports.BottomRow = BottomRow;
75
81
  var Category = (0, _styledComponents.default)(_breakdown.default).withConfig({
76
82
  displayName: "BlogPoststyles__Category",
77
83
  componentId: "sc-16n0gty-6"
78
- })(["font-weight:500 !important;", ""], _rwd.default.Mobile(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n\n //margin-bottom: 24px;\n "]))));
84
+ })(["font-weight:500 !important;", ""], _rwd.default.Mobile(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n\n //margin-bottom: 24px;\n "]))));
79
85
  exports.Category = Category;
80
86
  var StyledButton = (0, _styledComponents.default)(_Button.default).withConfig({
81
87
  displayName: "BlogPoststyles__StyledButton",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stokr/components-library",
3
- "version": "2.3.22-beta.3",
3
+ "version": "2.3.22-beta.4",
4
4
  "description": "STOKR - Components Library",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",