Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.
 
 

45 řádky
1.5 KiB

  1. import React from "react";
  2. // @material-ui/core components
  3. import { makeStyles } from "@material-ui/core/styles";
  4. import GridContainer from "components/Grid/GridContainer.js";
  5. import Grid from '@material-ui/core/Grid';
  6. import Paper from '@material-ui/core/Paper';
  7. import Card from "components/Card/Card.js";
  8. import styles from "assets/jss/nextjs-material-kit/pages/componentsSections/notificationsStyles.js";
  9. const useStyles = makeStyles(styles);
  10. const DataService = function ({ backend, service, ...props }) {
  11. const classes = useStyles();
  12. const services = service.map((data, index) => (
  13. <Card style={{width: "20rem"}}>
  14. <div align="center">
  15. <img
  16. style={{height: "180px", width: "300px", display: "block"}} className={classes.imgCardTop} src={`${backend}${data.img[0]["url"]}`}/>
  17. </div>
  18. </Card>
  19. ));
  20. return (
  21. <div className={classes.section} id="notifications">
  22. <div align="center">
  23. <h2>Our Service</h2>
  24. </div>
  25. <div>
  26. <GridContainer justify="center">
  27. <Grid align="center" style={{padding:"40px", marginTop:"-50px"}}>
  28. {services[0]}
  29. </Grid>
  30. <Grid align="center" style={{padding:"40px", marginTop:"-50px"}}>
  31. {services[1]}
  32. </Grid>
  33. <Grid align="center" style={{padding:"40px", marginTop:"-50px"}}>
  34. {services[2]}
  35. </Grid>
  36. </GridContainer>
  37. </div>
  38. </div>
  39. );
  40. }
  41. export default DataService;