@stokr/components-library 0.6.7 → 0.6.9

package/dist/components/Layout/Layout-func-no-work.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ProgressStatusConsumer = exports.Layout = void 0;
+var _styledComponents = require("styled-components");
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _global = _interopRequireDefault(require("../../styles/global"));
+var _theme = _interopRequireDefault(require("../../styles/theme"));
+var _Header = _interopRequireDefault(require("../Header/Header"));
+var _Footer = _interopRequireDefault(require("../Footer/Footer"));
+var _Grid = require("../Grid/Grid.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+//import updateProgressStatus from 'actions/progress-status'
+
+var ProgressStatusContext = /*#__PURE__*/_react.default.createContext();
+var Layout = function Layout(props) {
+  var title = props.title,
+    progress = props.progress,
+    loginHandler = props.loginHandler,
+    signupHandler = props.signupHandler,
+    signupFlow = props.signupFlow,
+    children = props.children,
+    footerColor = props.footerColor,
+    noFooter = props.noFooter,
+    noLogout = props.noLogout,
+    updateProgressStatusAC = props.updateProgressStatusAC;
+  var handleProgressStatusChange = function handleProgressStatusChange(page, status) {
+    updateProgressStatusAC(page, status);
+  };
+  return /*#__PURE__*/_react.default.createElement(_styledComponents.ThemeProvider, {
+    theme: _objectSpread({}, _theme.default)
+  }, /*#__PURE__*/_react.default.createElement(_Grid.PageWrapper, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_Header.default, {
+    progress: progress,
+    signupFlow: signupFlow,
+    loginHandler: loginHandler,
+    signupHandler: signupHandler,
+    siteTitle: title,
+    noLogout: noLogout
+  }), /*#__PURE__*/_react.default.createElement(ProgressStatusContext.Provider, {
+    value: {
+      onProgressStatusChange: handleProgressStatusChange
+    }
+  }, children), !noFooter && /*#__PURE__*/_react.default.createElement(_Footer.default, {
+    color: footerColor
+  })));
+};
+exports.Layout = Layout;
+Layout.propTypes = {
+  title: _propTypes.default.string,
+  signupFlow: _propTypes.default.bool,
+  loginHandler: _propTypes.default.func,
+  signupHandler: _propTypes.default.func,
+  progress: _propTypes.default.bool,
+  footerColor: _propTypes.default.string,
+  children: _propTypes.default.node.isRequired
+};
+Layout.defaultProps = {
+  title: '',
+  progress: null,
+  signupFlow: false,
+  footerColor: 'red',
+  loginHandler: function loginHandler() {},
+  signupHandler: function signupHandler() {}
+};
+var ProgressStatusConsumer = ProgressStatusContext.Consumer;
+
+// doublecheck: _ref undefined. no state..
+// doesn't have export deafsult?....
+exports.ProgressStatusConsumer = ProgressStatusConsumer;

package/dist/components/Layout/Layout.js

@@ -0,0 +1,103 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ProgressStatusConsumer = exports.Layout = void 0;
+var _styledComponents = require("styled-components");
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _global = _interopRequireDefault(require("../../styles/global"));
+var _theme = _interopRequireDefault(require("../../styles/theme"));
+var _Header = _interopRequireDefault(require("../Header/Header"));
+var _Footer = _interopRequireDefault(require("../Footer/Footer"));
+var _Grid = require("../Grid/Grid.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); Object.defineProperty(subClass, "prototype", { writable: false }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+//import updateProgressStatus from 'actions/progress-status'
+
+var ProgressStatusContext = /*#__PURE__*/_react.default.createContext();
+var Layout = /*#__PURE__*/function (_React$PureComponent) {
+  _inherits(Layout, _React$PureComponent);
+  var _super = _createSuper(Layout);
+  function Layout() {
+    var _this;
+    _classCallCheck(this, Layout);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _super.call.apply(_super, [this].concat(args));
+    _defineProperty(_assertThisInitialized(_this), "handleProgressStatusChange", function (page, status) {
+      var updateProgressStatusAC = _this.props.updateProgressStatusAC;
+      updateProgressStatusAC(page, status);
+    });
+    return _this;
+  }
+  _createClass(Layout, [{
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        title = _this$props.title,
+        progress = _this$props.progress,
+        loginHandler = _this$props.loginHandler,
+        signupHandler = _this$props.signupHandler,
+        signupFlow = _this$props.signupFlow,
+        children = _this$props.children,
+        footerColor = _this$props.footerColor,
+        noFooter = _this$props.noFooter,
+        noLogout = _this$props.noLogout;
+      return /*#__PURE__*/_react.default.createElement(_styledComponents.ThemeProvider, {
+        theme: _objectSpread({}, _theme.default)
+      }, /*#__PURE__*/_react.default.createElement(_Grid.PageWrapper, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_Header.default, {
+        progress: progress,
+        signupFlow: signupFlow,
+        loginHandler: loginHandler,
+        signupHandler: signupHandler,
+        siteTitle: title,
+        noLogout: noLogout
+      }), /*#__PURE__*/_react.default.createElement(ProgressStatusContext.Provider, {
+        value: {
+          onProgressStatusChange: this.handleProgressStatusChange
+        }
+      }, children), !noFooter && /*#__PURE__*/_react.default.createElement(_Footer.default, {
+        color: footerColor
+      })));
+    }
+  }]);
+  return Layout;
+}(_react.default.PureComponent);
+exports.Layout = Layout;
+Layout.propTypes = {
+  title: _propTypes.default.string,
+  signupFlow: _propTypes.default.bool,
+  loginHandler: _propTypes.default.func,
+  signupHandler: _propTypes.default.func,
+  progress: _propTypes.default.bool,
+  footerColor: _propTypes.default.string,
+  children: _propTypes.default.node.isRequired
+};
+Layout.defaultProps = {
+  title: '',
+  progress: null,
+  signupFlow: false,
+  footerColor: 'red',
+  loginHandler: function loginHandler() {},
+  signupHandler: function signupHandler() {}
+};
+var ProgressStatusConsumer = ProgressStatusContext.Consumer;
+exports.ProgressStatusConsumer = ProgressStatusConsumer;

package/dist/components/Layout/Layout.stories.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.LayoutDefault = exports.LatestUpdateFull = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Layout = require("./Layout");
+var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _default = {
+  title: 'Components Library/Layout',
+  component: _Layout.Layout,
+  argTypes: {
+    title: {
+      type: 'string',
+      defaultValue: ''
+    },
+    progress: {
+      type: 'boolean',
+      defaultValue: null
+    },
+    signupFlow: {
+      type: 'boolean',
+      defaultValue: false
+    },
+    loginHandler: {
+      type: 'function',
+      action: 'loginHandler'
+      //   defaultValue: () => {},
+    },
+
+    signupHandler: {
+      type: 'function',
+      action: 'signupHandler'
+      //   defaultValue: () => {},
+    },
+
+    children: {
+      type: 'node',
+      defaultValue: [],
+      required: true
+    },
+    footerColor: {
+      type: 'string',
+      defaultValue: 'red'
+    }
+  }
+};
+exports.default = _default;
+var Template = function Template(args) {
+  return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Layout.Layout, args));
+};
+var LayoutDefault = Template.bind({});
+exports.LayoutDefault = LayoutDefault;
+LayoutDefault.args = {};
+var LatestUpdateFull = Template.bind({});
+exports.LatestUpdateFull = LatestUpdateFull;
+LatestUpdateFull.args = {
+  title: 'A Title',
+  //   progress: true,
+  signupFlow: true,
+  footerColor: 'blue'
+};
+
+// doublecheck:
+// ref to header not found...

package/dist/components/LearnMoreCarousel/LearnMoreCarousel.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.LearnMoreCarousel = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactSlick = _interopRequireDefault(require("react-slick"));
+require("slick-carousel/slick/slick.css");
+require("slick-carousel/slick/slick-theme.css");
+var _LearnMoreCarousel = require("./LearnMoreCarousel.styles");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var LearnMoreCarousel = function LearnMoreCarousel(_ref) {
+  var children = _ref.children,
+    autoplay = _ref.autoplay,
+    dots = _ref.dots,
+    arrows = _ref.arrows,
+    isMobile = _ref.isMobile;
+  var settings = {
+    dots: dots,
+    arrows: arrows,
+    infinite: false,
+    speed: 600,
+    autoplay: !!autoplay,
+    autoplaySpeed: autoplay,
+    slidesToShow: isMobile ? 1 : 2,
+    slidesToScroll: isMobile ? 1 : 1
+  };
+  return /*#__PURE__*/_react.default.createElement(_LearnMoreCarousel.Container, null, /*#__PURE__*/_react.default.createElement(_LearnMoreCarousel.Offset, null, /*#__PURE__*/_react.default.createElement(_LearnMoreCarousel.Wrapper, null, /*#__PURE__*/_react.default.createElement(_reactSlick.default, settings, children))));
+};
+exports.LearnMoreCarousel = LearnMoreCarousel;
+LearnMoreCarousel.propTypes = {
+  children: _propTypes.default.node.isRequired,
+  autoplay: _propTypes.default.number,
+  dots: _propTypes.default.bool,
+  arrows: _propTypes.default.bool,
+  isMobile: _propTypes.default.bool
+};
+LearnMoreCarousel.defaultProps = {
+  autoplay: 0,
+  dots: false,
+  arrows: false,
+  isMobile: false
+};
+var _default = LearnMoreCarousel;
+exports.default = _default;

package/dist/components/LearnMoreCarousel/LearnMoreCarousel.stories.js

@@ -0,0 +1,70 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.LearnMoreCarousel4VD = exports.LearnMoreCarousel3 = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _LearnMoreCarousel = require("./LearnMoreCarousel");
+var _Number = require("../Number/Number");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+// import { OneSvg, TwoSvg, ThreeSvg, FourSvg } from '../SvgIcons'
+var _default = {
+  title: 'Components Library/LearnMoreCarousel',
+  component: _LearnMoreCarousel.LearnMoreCarousel,
+  argTypes: {
+    children: {
+      type: 'node',
+      defaultValue: [],
+      required: true
+    },
+    autoplay: {
+      type: 'number',
+      defaultValue: 600
+    },
+    dots: {
+      type: 'boolean',
+      defaultValue: false
+    },
+    arrows: {
+      type: 'boolean',
+      defaultValue: false
+    },
+    infinite: {
+      type: 'boolean',
+      defaultValue: false
+    },
+    isMobile: {
+      type: 'boolean',
+      defaultValue: false
+    },
+    settings: [{}]
+  }
+};
+exports.default = _default;
+var Template = function Template(args) {
+  return /*#__PURE__*/_react.default.createElement(_LearnMoreCarousel.LearnMoreCarousel, args);
+};
+var LearnMoreCarousel3 = Template.bind({});
+exports.LearnMoreCarousel3 = LearnMoreCarousel3;
+LearnMoreCarousel3.args = {
+  children: [/*#__PURE__*/_react.default.createElement(_Number.Number, null), /*#__PURE__*/_react.default.createElement(_Number.Number, null), /*#__PURE__*/_react.default.createElement(_Number.Number, null)],
+  autoplay: 600,
+  dots: true,
+  arrows: true,
+  infinite: true
+};
+var LearnMoreCarousel4VD = Template.bind({});
+exports.LearnMoreCarousel4VD = LearnMoreCarousel4VD;
+LearnMoreCarousel4VD.args = {
+  children: [/*#__PURE__*/_react.default.createElement(_Number.Number, null), /*#__PURE__*/_react.default.createElement(_Number.Number, null), /*#__PURE__*/_react.default.createElement(_Number.Number, null), /*#__PURE__*/_react.default.createElement(_Number.Number, null)],
+  autoplay: 800,
+  dots: true,
+  arrows: true,
+  styleVD: true,
+  infinite: true
+};
+
+//doublecheck:
+// autoplay is autoplayspeed
+// why is autoplay stopping in SB?

package/dist/components/LearnMoreCarousel/LearnMoreCarousel.styles.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Wrapper = exports.Offset = exports.LearnMoreSlide = exports.Container = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _rwd = _interopRequireDefault(require("../../styles/rwd"));
+var _theme = _interopRequireDefault(require("../../styles/theme"));
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+var Container = _styledComponents.default.div.withConfig({
+  displayName: "LearnMoreCarouselstyles__Container",
+  componentId: "sc-auw5a4-0"
+})(["overflow:hidden;"]);
+exports.Container = Container;
+var Offset = _styledComponents.default.div.withConfig({
+  displayName: "LearnMoreCarouselstyles__Offset",
+  componentId: "sc-auw5a4-1"
+})(["position:relative;padding-top:28px;padding-bottom:76px;margin-right:0;", " ", ""], _rwd.default.Medium(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    padding-top: 32px;\n    padding-bottom: 72px;\n    margin-right: 64px;\n  "]))), _rwd.default.Large(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    padding-top: 64px;\n    padding-bottom: 88px;\n    margin-right: 128px;\n  "]))));
+exports.Offset = Offset;
+var Wrapper = _styledComponents.default.div.withConfig({
+  displayName: "LearnMoreCarouselstyles__Wrapper",
+  componentId: "sc-auw5a4-2"
+})(["margin-right:0;", " .slick-list{z-index:0;}.slick-arrow{z-index:1;width:32px;height:48px;background-color:", ";transition:background-color 0.2s;", " &.slick-prev,&.slick-next{top:100%;right:50%;margin-top:40px;transform:none;", " ", " &:before{font-family:'Ionicons';speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:20px;line-height:24px;text-align:center;opacity:1;color:", ";}&:focus,&:hover{background-color:", ";}}&.slick-prev{left:auto;margin-right:-32px;", " &:before{content:'\f3cf';}}&.slick-next{border-left:1px solid ", ";margin-right:-64px;", " &:before{content:'\f3d1';}}}.slick-dots{z-index:1;height:auto;top:100%;margin-left:8px;text-align:center;width:100%;margin-top:28px;", " ", " li{display:inline-block;width:24px;height:24px;margin:0;button{display:block;padding:8px;width:24px;height:24px;&:before{position:relative;content:'';display:block;width:8px;height:8px;border-radius:4px;background-color:#eee;opacity:1;transition:background-color 0.2s;}&:hover{&:before{background-color:#0050ca;}}}&.slick-active{button{&:before{background-color:#ee220d;}}}}}.slick-track{display:flex;align-items:stretch;}.slick-slide{height:auto;& > div{height:100%;}}"], _rwd.default.Medium(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    margin-right: -100%;\n  "]))), function (props) {
+  return _theme.default.cWarning;
+}, _rwd.default.Large(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n      width: 64px;\n    "]))), _rwd.default.Medium(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n        margin-top: 24px;\n      "]))), _rwd.default.Large(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n        margin-top: 40px;\n      "]))), function (props) {
+  return _theme.default.cWhite;
+}, function (props) {
+  return _theme.default.cWarningDark;
+}, _rwd.default.Large(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n        margin-right: -64px;\n      "]))), function (props) {
+  return _theme.default.cWarningDark;
+}, _rwd.default.Large(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n        margin-right: -128px;\n      "]))), _rwd.default.Medium(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n      margin-top: 36px;\n      width: 50%;\n      padding-right: 32px;\n      text-align: right;\n      "]))), _rwd.default.Large(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n      margin-top: 52px;\n      padding-right: 36px;\n    "]))));
+exports.Wrapper = Wrapper;
+var LearnMoreSlide = _styledComponents.default.div.withConfig({
+  displayName: "LearnMoreCarouselstyles__LearnMoreSlide",
+  componentId: "sc-auw5a4-3"
+})(["outline:0;height:100%;padding-left:32px;padding-right:32px;", " ", ""], _rwd.default.Medium(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n    padding-left: 32px;\n    padding-right: 0;\n  "]))), _rwd.default.Large(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n    padding-left: 64px;\n    padding-right: 0;\n  "]))));
+
+// Before Merge
+// VD had white #fff dots with: box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
+exports.LearnMoreSlide = LearnMoreSlide;