@megafon/ui-shared 2.0.0-beta.24 → 2.0.0-beta.240

package/dist/es/components/ProductCard/ProductCardInfo.js

@@ -1,169 +0,0 @@
-import "core-js/modules/es.symbol";
-import "core-js/modules/es.symbol.description";
-import "core-js/modules/es.array.concat";
-import "core-js/modules/es.array.map";
-import "core-js/modules/es.date.to-string";
-import "core-js/modules/es.object.to-string";
-import "core-js/modules/es.reflect.construct";
-import "core-js/modules/es.regexp.to-string";
-import "core-js/modules/es.string.link";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-
-function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
-
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { cnCreate, Header, BubbleHint, TextLink } from '@megafon/ui-core';
-import "./ProductCardInfo.css";
-var cn = cnCreate('mfui-beta-product-card-info');
-
-var ProductCardInfo = /*#__PURE__*/function (_React$Component) {
-  _inherits(ProductCardInfo, _React$Component);
-
-  var _super = _createSuper(ProductCardInfo);
-
-  function ProductCardInfo() {
-    var _this;
-
-    _classCallCheck(this, ProductCardInfo);
-
-    _this = _super.apply(this, arguments);
-
-    _this.handleClickMoreInfo = function (e) {
-      var onClickMoreInfo = _this.props.onClickMoreInfo;
-      onClickMoreInfo && onClickMoreInfo(e);
-    };
-
-    return _this;
-  }
-
-  _createClass(ProductCardInfo, [{
-    key: "renderBadges",
-    value: function renderBadges() {
-      var _this2 = this;
-
-      var badgeTitle = function badgeTitle(badge) {
-        return /*#__PURE__*/React.createElement("div", {
-          className: cn('badge-title')
-        }, badge.title);
-      };
-
-      return /*#__PURE__*/React.createElement("div", {
-        className: cn('badges')
-      }, this.props.badges.map(function (badge, key) {
-        return /*#__PURE__*/React.createElement("div", {
-          key: "".concat(badge.title).concat(key),
-          className: cn('badge', {
-            type: badge.code
-          })
-        }, badge.hint ? _this2.renderBubbleHint(badgeTitle(badge), badge.hint) : badgeTitle(badge));
-      }));
-    }
-  }, {
-    key: "renderBubbleHint",
-    value: function renderBubbleHint(title, hint) {
-      return /*#__PURE__*/React.createElement(BubbleHint, {
-        popupWidth: "small",
-        placement: "right",
-        trigger: title
-      }, /*#__PURE__*/React.createElement("div", {
-        dangerouslySetInnerHTML: {
-          __html: hint
-        }
-      }));
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          badges = _this$props.badges,
-          description = _this$props.description,
-          descriptionIcon = _this$props.descriptionIcon,
-          link = _this$props.link,
-          linkText = _this$props.linkText,
-          title = _this$props.title,
-          additionalParams = _this$props.additionalParams,
-          className = _this$props.className,
-          classNameDescription = _this$props.classNameDescription,
-          classNameDescriptionText = _this$props.classNameDescriptionText,
-          classNameParams = _this$props.classNameParams,
-          classNameParamsItem = _this$props.classNameParamsItem,
-          linkTarget = _this$props.linkTarget;
-      return /*#__PURE__*/React.createElement("div", {
-        className: cn('', {}, className)
-      }, /*#__PURE__*/React.createElement("div", {
-        className: cn('description', {}, classNameDescription)
-      }, /*#__PURE__*/React.createElement(Header, {
-        className: cn('description-title'),
-        as: "h2",
-        margin: false
-      }, title), badges && this.renderBadges(), description && /*#__PURE__*/React.createElement("div", {
-        className: cn('description-wrap')
-      }, descriptionIcon && React.cloneElement(descriptionIcon, {
-        className: cn('description-icon')
-      }), typeof description === 'string' ? /*#__PURE__*/React.createElement("div", {
-        className: cn('description-text', {}, classNameDescriptionText),
-        dangerouslySetInnerHTML: {
-          __html: description
-        }
-      }) : /*#__PURE__*/React.createElement("div", {
-        className: cn('description-text', {}, classNameDescriptionText)
-      }, description)), /*#__PURE__*/React.createElement(TextLink, {
-        className: cn('description-more'),
-        href: link,
-        target: linkTarget,
-        onClick: this.handleClickMoreInfo
-      }, linkText)), /*#__PURE__*/React.createElement("div", {
-        className: cn('params', {}, classNameParams)
-      }, /*#__PURE__*/React.createElement("ul", {
-        className: cn('params-list')
-      }, additionalParams.map(function (param, key) {
-        return /*#__PURE__*/React.createElement("li", {
-          key: param.title + key,
-          className: cn('params-item', {}, classNameParamsItem)
-        }, /*#__PURE__*/React.createElement("span", {
-          "data-amount": param.value
-        }, param.value), " ", param.unit);
-      }))));
-    }
-  }]);
-
-  return ProductCardInfo;
-}(React.Component);
-
-ProductCardInfo.propTypes = {
-  title: PropTypes.string.isRequired,
-  link: PropTypes.string.isRequired,
-  linkTarget: PropTypes.oneOf(['_self', '_blank', '_parent', '_top']),
-  linkText: PropTypes.string,
-  description: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
-  descriptionIcon: PropTypes.element,
-  badges: PropTypes.arrayOf(PropTypes.shape({
-    title: PropTypes.string.isRequired,
-    code: PropTypes.string.isRequired,
-    hint: PropTypes.string
-  })),
-  additionalParams: PropTypes.arrayOf(PropTypes.shape({
-    title: PropTypes.string.isRequired,
-    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-    unit: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired
-  })),
-  className: PropTypes.string,
-  classNameDescription: PropTypes.string,
-  classNameDescriptionText: PropTypes.string,
-  classNameParams: PropTypes.string,
-  classNameParamsItem: PropTypes.string,
-  onClickMoreInfo: PropTypes.func
-};
-ProductCardInfo.defaultProps = {
-  linkTarget: '_self',
-  linkText: 'Подробнее',
-  additionalParams: []
-};
-export default ProductCardInfo;

package/dist/es/components/ProductCard/ProductCardTotal.css

@@ -1,113 +0,0 @@
-h1,
-h2,
-h3,
-h4,
-h5 {
-  margin: 0;
-}
-.mfui-beta-product-card-total {
-  font-family: inherit;
-  -ms-flex-negative: 0;
-      flex-shrink: 0;
-}
-.mfui-beta-product-card-total__wrap {
-  text-align: center;
-}
-.mfui-beta-product-card-total__cost {
-  font-size: 18px;
-  line-height: 24px;
-  font-weight: 500;
-  letter-spacing: 0.5px;
-  margin-bottom: 8px;
-}
-@media screen and (min-width: 1280px) {
-  .mfui-beta-product-card-total__cost {
-    font-size: 20px;
-    line-height: 28px;
-  }
-}
-.mfui-beta-product-card-total__cost_old-value .mfui-beta-product-card-total__price {
-  font-size: 28px;
-  font-weight: bold;
-}
-.mfui-beta-product-card-total__old-price {
-  position: relative;
-}
-.mfui-beta-product-card-total__old-price:before {
-  content: '';
-  position: absolute;
-  left: 0;
-  right: 0;
-  top: 10px;
-  border-bottom: 2px solid #F62434;
-}
-.mfui-beta-product-card-total__buttons .b-link {
-  width: 100% !important;
-  margin-bottom: 0 !important;
-  margin-right: 0 !important;
-  padding-left: 0 !important;
-  padding-right: 0 !important;
-}
-.mfui-beta-product-card-total__buttons .b-link + .b-link {
-  margin-top: 12px;
-}
-.mfui-beta-product-card-total__buttons .b-link_view_with-subtitle {
-  padding-top: 0;
-}
-.mfui-beta-product-card-total__buttons .b-link_view_with-subtitle .b-link__title {
-  margin-bottom: 0;
-}
-.mfui-beta-product-card-total__connect-button {
-  cursor: pointer;
-  height: 48px;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  display: -webkit-inline-box;
-  display: -ms-inline-flexbox;
-  display: inline-flex;
-  -webkit-box-align: center;
-      -ms-flex-align: center;
-          align-items: center;
-  -webkit-box-pack: center;
-      -ms-flex-pack: center;
-          justify-content: center;
-  width: 100%;
-  vertical-align: top;
-}
-.mfui-beta-product-card-total__connect-text-block {
-  -ms-flex-negative: 1;
-      flex-shrink: 1;
-}
-.mfui-beta-product-card-total__connect-text-words {
-  display: inline-block;
-  width: 100%;
-  color: #34AAF2;
-}
-.product-card-wrapper_theme_default .mfui-beta-product-card-total {
-  width: 200px;
-}
-@media screen and (max-width: 479px) {
-  .product-card-wrapper_theme_default .mfui-beta-product-card-total {
-    margin: 0 auto;
-  }
-}
-@media screen and (min-width: 768px) and (max-width: 1023px) {
-  .product-card-wrapper_theme_default .mfui-beta-product-card-total {
-    width: 165px;
-  }
-}
-@media screen and (min-width: 1024px) {
-  .product-card-wrapper_theme_default .mfui-beta-product-card-total {
-    width: 196px;
-  }
-}
-@media screen and (min-width: 1280px) {
-  .product-card-wrapper_theme_default .mfui-beta-product-card-total {
-    width: 268px;
-  }
-}
-@media screen and (min-width: 1280px) {
-  .product-card-wrapper_theme_default .mfui-beta-product-card-total__wrap {
-    width: 200px;
-  }
-}

package/dist/es/components/ProductCard/ProductCardTotal.d.ts

@@ -1,86 +0,0 @@
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import './ProductCardTotal.less';
-export declare type TLinkTargetType = '_self' | '_blank' | '_parent' | '_top';
-export interface IProductCardTotalProps {
-    /** Payment
-     * Object with args: value: string(required), unit: string(required), oldValue: string
-     */
-    payment?: {
-        value: string | number;
-        unit: string;
-        oldValue?: string;
-    };
-    /** Info - any type - return with onSubmit, onClickConnect, onClickMore */
-    info?: {};
-    /** Submit text */
-    submitText?: string;
-    /** Submit link,
-     * show button if included
-     */
-    submitLink?: string;
-    /** Submit link target */
-    submitLinkTarget?: TLinkTargetType;
-    /** More text */
-    moreText?: string;
-    /** More link,
-     *  show button if included
-     */
-    moreLink?: string;
-    /** More link target */
-    moreLinkTarget?: TLinkTargetType;
-    /** Connect text */
-    connectText?: string;
-    className?: string;
-    classNameWrap?: string;
-    classNameCost?: string;
-    classNameButtons?: string;
-    classNameSubmit?: string;
-    classNameMore?: string;
-    classNameConnect?: string;
-    /** Submit hander,
-     * show button if included
-     */
-    onSubmit?: (e: React.SyntheticEvent<EventTarget>, info: {}) => void;
-    /** Connect hander,
-     * show button if included
-     */
-    onClickConnect?: (e: React.SyntheticEvent<EventTarget>, info: {}) => void;
-    /** More hander,
-     * show button if included
-     */
-    onClickMore?: (e: React.SyntheticEvent<EventTarget>, info: {}) => void;
-}
-declare class ProductCardTotal extends React.Component<IProductCardTotalProps, {}> {
-    static propTypes: {
-        payment: PropTypes.Requireable<PropTypes.InferProps<{
-            value: PropTypes.Validator<string | number>;
-            unit: PropTypes.Validator<string>;
-            oldValue: PropTypes.Requireable<string>;
-        }>>;
-        info: PropTypes.Requireable<object>;
-        submitText: PropTypes.Requireable<string>;
-        submitLink: PropTypes.Requireable<string>;
-        submitLinkTarget: PropTypes.Requireable<string>;
-        moreText: PropTypes.Requireable<string>;
-        moreLink: PropTypes.Requireable<string>;
-        moreLinkTarget: PropTypes.Requireable<string>;
-        connectText: PropTypes.Requireable<string>;
-        className: PropTypes.Requireable<string>;
-        classNameWrap: PropTypes.Requireable<string>;
-        classNameCost: PropTypes.Requireable<string>;
-        classNameButtons: PropTypes.Requireable<string>;
-        classNameSubmit: PropTypes.Requireable<string>;
-        classNameMore: PropTypes.Requireable<string>;
-        classNameConnect: PropTypes.Requireable<string>;
-        onSubmit: PropTypes.Requireable<(...args: any[]) => any>;
-        onClickConnect: PropTypes.Requireable<(...args: any[]) => any>;
-        onClickMore: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    static defaultProps: Partial<IProductCardTotalProps>;
-    handleSubmit: (e: React.SyntheticEvent<EventTarget, Event>) => void;
-    handleClickConnect: (e: React.SyntheticEvent<EventTarget, Event>) => void;
-    handleClickMore: (e: React.SyntheticEvent<EventTarget, Event>) => void;
-    render(): JSX.Element;
-}
-export default ProductCardTotal;

package/dist/es/components/ProductCard/ProductCardTotal.js

@@ -1,161 +0,0 @@
-import "core-js/modules/es.date.to-string";
-import "core-js/modules/es.object.to-string";
-import "core-js/modules/es.reflect.construct";
-import "core-js/modules/es.regexp.to-string";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-
-function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
-
-import * as React from 'react';
-import * as PropTypes from 'prop-types';
-import { cnCreate, Button } from '@megafon/ui-core';
-import "./ProductCardTotal.css";
-var LinkTargetType = PropTypes.oneOf(['_self', '_blank', '_parent', '_top']);
-var cn = cnCreate('mfui-beta-product-card-total');
-
-var ProductCardTotal = /*#__PURE__*/function (_React$Component) {
-  _inherits(ProductCardTotal, _React$Component);
-
-  var _super = _createSuper(ProductCardTotal);
-
-  function ProductCardTotal() {
-    var _this;
-
-    _classCallCheck(this, ProductCardTotal);
-
-    _this = _super.apply(this, arguments);
-
-    _this.handleSubmit = function (e) {
-      var _this$props = _this.props,
-          onSubmit = _this$props.onSubmit,
-          info = _this$props.info;
-      onSubmit && onSubmit(e, info || {});
-    };
-
-    _this.handleClickConnect = function (e) {
-      var _this$props2 = _this.props,
-          onClickConnect = _this$props2.onClickConnect,
-          info = _this$props2.info;
-      onClickConnect && onClickConnect(e, info || {});
-    };
-
-    _this.handleClickMore = function (e) {
-      var _this$props3 = _this.props,
-          onClickMore = _this$props3.onClickMore,
-          info = _this$props3.info;
-      onClickMore && onClickMore(e, info || {});
-    };
-
-    return _this;
-  }
-
-  _createClass(ProductCardTotal, [{
-    key: "render",
-    value: function render() {
-      var _this$props4 = this.props,
-          payment = _this$props4.payment,
-          onSubmit = _this$props4.onSubmit,
-          submitLink = _this$props4.submitLink,
-          submitText = _this$props4.submitText,
-          onClickMore = _this$props4.onClickMore,
-          moreLink = _this$props4.moreLink,
-          onClickConnect = _this$props4.onClickConnect,
-          moreText = _this$props4.moreText,
-          connectText = _this$props4.connectText,
-          className = _this$props4.className,
-          classNameCost = _this$props4.classNameCost,
-          classNameButtons = _this$props4.classNameButtons,
-          classNameSubmit = _this$props4.classNameSubmit,
-          classNameMore = _this$props4.classNameMore,
-          classNameConnect = _this$props4.classNameConnect,
-          classNameWrap = _this$props4.classNameWrap,
-          moreLinkTarget = _this$props4.moreLinkTarget,
-          submitLinkTarget = _this$props4.submitLinkTarget;
-      var isSubmit = onSubmit || submitLink;
-      var isMore = onClickMore || moreLink;
-      return /*#__PURE__*/React.createElement("div", {
-        className: cn('', {}, className)
-      }, /*#__PURE__*/React.createElement("div", {
-        className: cn('wrap', {}, classNameWrap)
-      }, payment && /*#__PURE__*/React.createElement("div", {
-        className: cn('cost', {
-          'old-value': !!payment.oldValue
-        }, classNameCost)
-      }, /*#__PURE__*/React.createElement("span", {
-        className: cn('price')
-      }, payment.value), "\xA0", payment.oldValue && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", {
-        className: cn('old-price')
-      }, payment.oldValue), /*#__PURE__*/React.createElement("br", null)), /*#__PURE__*/React.createElement("span", {
-        className: cn('unit')
-      }, payment.unit)), /*#__PURE__*/React.createElement("div", {
-        className: cn('buttons', classNameButtons)
-      }, isSubmit && /*#__PURE__*/React.createElement(Button, {
-        classes: {
-          root: cn('button', classNameSubmit)
-        },
-        fullWidth: true,
-        href: submitLink,
-        onClick: this.handleSubmit,
-        target: submitLinkTarget
-      }, submitText), !isSubmit && isMore && /*#__PURE__*/React.createElement(Button, {
-        classes: {
-          root: cn('description-more', classNameMore)
-        },
-        type: "outline",
-        fullWidth: true,
-        href: moreLink,
-        target: moreLinkTarget,
-        onClick: this.handleClickMore
-      }, moreText), onClickConnect && /*#__PURE__*/React.createElement("div", {
-        className: cn('connect-button', classNameConnect),
-        onClick: this.handleClickConnect
-      }, /*#__PURE__*/React.createElement("div", {
-        className: cn('connect-text-block')
-      }, /*#__PURE__*/React.createElement("span", {
-        className: cn('connect-text-words')
-      }, connectText), "\u0430\u0431\u043E\u043D\u0435\u043D\u0442\u0430\u043C \u041C\u0435\u0433\u0430\u0424\u043E\u043D\u0430")))));
-    }
-  }]);
-
-  return ProductCardTotal;
-}(React.Component);
-
-ProductCardTotal.propTypes = {
-  payment: PropTypes.shape({
-    value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-    unit: PropTypes.string.isRequired,
-    oldValue: PropTypes.string
-  }),
-  info: PropTypes.object,
-  submitText: PropTypes.string,
-  submitLink: PropTypes.string,
-  submitLinkTarget: LinkTargetType,
-  moreText: PropTypes.string,
-  moreLink: PropTypes.string,
-  moreLinkTarget: LinkTargetType,
-  connectText: PropTypes.string,
-  className: PropTypes.string,
-  classNameWrap: PropTypes.string,
-  classNameCost: PropTypes.string,
-  classNameButtons: PropTypes.string,
-  classNameSubmit: PropTypes.string,
-  classNameMore: PropTypes.string,
-  classNameConnect: PropTypes.string,
-  onSubmit: PropTypes.func,
-  onClickConnect: PropTypes.func,
-  onClickMore: PropTypes.func
-};
-ProductCardTotal.defaultProps = {
-  submitText: 'Выбрать',
-  moreText: 'Подробнее',
-  connectText: 'Подключить',
-  moreLinkTarget: '_self',
-  submitLinkTarget: '_self'
-};
-export default ProductCardTotal;

package/dist/es/components/ProductCard/ProductCardWrapper.css

@@ -1,162 +0,0 @@
-h1,
-h2,
-h3,
-h4,
-h5 {
-  margin: 0;
-}
-.mfui-beta-product-card-wrapper {
-  font-family: inherit;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  position: relative;
-}
-.mfui-beta-product-card-wrapper_bt {
-  border-top: 1px solid #D8D8D8;
-}
-.mfui-beta-product-card-wrapper_bt_sky {
-  border-top: 1px solid #EDEDED;
-}
-.mfui-beta-product-card-wrapper_bb {
-  border-bottom: 1px solid #D8D8D8;
-}
-.mfui-beta-product-card-wrapper_bb_sky {
-  border-bottom: 1px solid #EDEDED;
-}
-@media screen and (max-width: 767px) {
-  .mfui-beta-product-card-wrapper_bl {
-    border-left: 1px solid #D8D8D8;
-  }
-  .mfui-beta-product-card-wrapper_bl_sky {
-    border-left: 1px solid #EDEDED;
-  }
-  .mfui-beta-product-card-wrapper_br {
-    border-right: 1px solid #D8D8D8;
-  }
-  .mfui-beta-product-card-wrapper_br_sky {
-    border-right: 1px solid #EDEDED;
-  }
-}
-.no-touchevents .mfui-beta-product-card-wrapper:hover {
-  z-index: 3;
-  -webkit-box-shadow: 0 1px 5px 2px #D8D8D8;
-          box-shadow: 0 1px 5px 2px #D8D8D8;
-}
-.mfui-beta-product-card-wrapper_hint_green {
-  border-color: #00B956 !important;
-}
-.mfui-beta-product-card-wrapper_hint_green .mfui-beta-product-card-wrapper__hint-box {
-  background: #00B956 !important;
-}
-.mfui-beta-product-card-wrapper_hint_orange .mfui-beta-product-card-wrapper__hint-box {
-  background: #FFA717 !important;
-}
-.mfui-beta-product-card-wrapper_hint_black .mfui-beta-product-card-wrapper__hint-box {
-  background: #333333 !important;
-}
-@media screen and (max-width: 767px) {
-  .mfui-beta-product-card-wrapper_theme_default {
-    border-left: 1px solid #D8D8D8;
-    border-right: 1px solid #D8D8D8;
-  }
-}
-.mfui-beta-product-card-wrapper_theme_default .mfui-beta-product-card-wrapper__inner {
-  padding: 40px 20px 40px 20px;
-}
-@media screen and (min-width: 768px) {
-  .mfui-beta-product-card-wrapper_theme_default .mfui-beta-product-card-wrapper__inner {
-    padding: 36px 24px 36px 24px;
-  }
-}
-@media screen and (min-width: 1024px) {
-  .mfui-beta-product-card-wrapper_theme_default .mfui-beta-product-card-wrapper__inner {
-    padding-left: 32px;
-    padding-right: 32px;
-  }
-}
-@media screen and (min-width: 1280px) {
-  .mfui-beta-product-card-wrapper_theme_default .mfui-beta-product-card-wrapper__inner {
-    padding-left: 40px;
-  }
-}
-.mfui-beta-product-card-wrapper__hint-box {
-  display: block;
-  position: absolute;
-  color: #FFFFFF;
-}
-@media screen and (max-width: 767px) {
-  .mfui-beta-product-card-wrapper__hint-box {
-    top: 0;
-    right: 0;
-    left: 0;
-    padding: 6px 0;
-    text-align: center;
-  }
-}
-@media screen and (min-width: 768px) {
-  .mfui-beta-product-card-wrapper__hint-box {
-    top: -1px;
-    right: 100%;
-    bottom: -1px;
-  }
-}
-@media screen and (min-width: 768px) and (max-width: 1023px) {
-  .mfui-beta-product-card-wrapper__hint-box {
-    width: 24px;
-  }
-}
-@media screen and (min-width: 1024px) and (max-width: 1279px) {
-  .mfui-beta-product-card-wrapper__hint-box {
-    width: 32px;
-  }
-}
-@media screen and (min-width: 1280px) {
-  .mfui-beta-product-card-wrapper__hint-box {
-    width: 40px;
-  }
-}
-@media screen and (min-width: 768px) {
-  .mfui-beta-product-card-wrapper__hint-text {
-    -webkit-transform-origin: 0 0;
-            transform-origin: 0 0;
-    -webkit-transform: translateY(-50%) rotate(-90deg);
-            transform: translateY(-50%) rotate(-90deg);
-    position: absolute;
-    top: 50%;
-    width: 100px;
-    margin-top: 60px;
-  }
-}
-@media screen and (min-width: 768px) and (max-width: 1023px) {
-  .mfui-beta-product-card-wrapper__hint-text {
-    margin-left: -2px;
-  }
-}
-@media screen and (min-width: 1024px) and (max-width: 1279px) {
-  .mfui-beta-product-card-wrapper__hint-text {
-    margin-left: 2px;
-  }
-}
-@media screen and (min-width: 1280px) {
-  .mfui-beta-product-card-wrapper__hint-text {
-    margin-left: 6px;
-  }
-}
-@media screen and (min-width: 768px) {
-  .mfui-beta-product-card-wrapper__container {
-    display: -webkit-box;
-    display: -ms-flexbox;
-    display: flex;
-    -webkit-box-align: baseline;
-        -ms-flex-align: baseline;
-            align-items: baseline;
-    -webkit-box-pack: justify;
-        -ms-flex-pack: justify;
-            justify-content: space-between;
-  }
-}
-@media screen and (max-width: 767px) {
-  .mfui-beta-product-card-wrapper_hint .mfui-beta-product-card-wrapper__container {
-    margin-top: 40px;
-  }
-}