@b2bfinance/products-embed/es/ProductFeaturedPoint.js

products-embed React component

import { Grid, Typography } from "@material-ui/core";
import { pink } from "@material-ui/core/colors";
import GradeOutline from "@material-ui/icons/GradeOutlined";
import { makeStyles } from "@material-ui/styles";
import React from "react";

var useStyles = makeStyles(function (theme) {
  return {
    productFeaturePointWrapper: {
      backgroundColor: theme.palette.grey[200],
      padding: theme.spacing(1, 2),
      lineHeight: 0
    },
    productFeaturePointIcon: {
      color: pink[300]
    },
    productFeatureDescription: {
      marginLeft: theme.spacing(0.5)
    }
  };
});

var ProductFeaturePoint = function ProductFeaturePoint(_ref) {
  var description = _ref.description;

  var classes = useStyles();

  return React.createElement(
    Grid,
    {
      className: classes.productFeaturePointWrapper,
      container: true,
      alignItems: "center"
    },
    React.createElement(
      Grid,
      { item: true },
      React.createElement(
        "div",
        { className: classes.productFeaturePointIcon },
        React.createElement(GradeOutline, { fontSize: "small" })
      )
    ),
    React.createElement(
      Grid,
      { item: true },
      React.createElement(
        Typography,
        { variant: "subtitle1" },
        React.createElement(
          "div",
          { className: classes.productFeatureDescription },
          description
        )
      )
    )
  );
};

export default ProductFeaturePoint;