25'ten fazla konu seçemezsiniz Konular bir harf veya rakamla başlamalı, kısa çizgiler ('-') içerebilir ve en fazla 35 karakter uzunluğunda olabilir.
 
 

62 satır
2.1 KiB

  1. import React from "react";
  2. import classNames from "classnames";
  3. import { makeStyles } from "@material-ui/core/styles";
  4. import Button from "components/CustomButtons/Button.js";
  5. import Icon from "@material-ui/core/Icon";
  6. import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
  7. import Card from "components/Card/Card.js";
  8. import CardBody from "components/Card/CardBody.js";
  9. import GridContainer from "components/Grid/GridContainer.js";
  10. import GridItem from "components/Grid/GridItem.js";
  11. const useStyles = makeStyles(styles);
  12. const DataYamalube = function ({ backend, yamalube, ...props }) {
  13. const classes = useStyles();
  14. const { ...rest } = props;
  15. const imageClasses = classNames(
  16. classes.imgRaised,
  17. classes.imgRoundedCircle,
  18. classes.imgFluid
  19. );
  20. const navImageClasses = classNames(classes.imgRounded, classes.imgGallery);
  21. const ProductYamalube = yamalube.map((data) => {
  22. return (
  23. <div style={{padding:"40px"}}>
  24. <img
  25. alt="..."
  26. style={{ height: "150px", display: "block" }}
  27. src={`${backend}${data.img["url"]}`}
  28. className={navImageClasses}
  29. />
  30. <div align="center">
  31. <h3>{data.name}</h3>
  32. <h4>Rp.{data.price}</h4>
  33. <Button
  34. color="info" round
  35. href={"/product/yamalube_details?s="+data.id}
  36. >
  37. <Icon className={classes.icons}>open_in_new</Icon>Detail Product
  38. </Button>
  39. </div>
  40. </div>
  41. );
  42. })
  43. return (
  44. <div>
  45. <Card className={classes.textCenter} align="center" style={{padding:"5px"}}>
  46. <CardBody>
  47. <div align="center" style={{marginTop:"-50px"}}>
  48. <h2>Yamalube Oil</h2>
  49. <GridContainer justify="center" style={{padding:"40px", marginTop:"-50px"}}>
  50. {ProductYamalube}
  51. </GridContainer>
  52. </div>
  53. </CardBody>
  54. </Card>
  55. </div>
  56. );
  57. }
  58. export default DataYamalube;