您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符
 
 

83 行
3.8 KiB

  1. import React from "react";
  2. import { makeStyles } from "@material-ui/core/styles";
  3. // core components
  4. import GridContainer from "components/Grid/GridContainer.js";
  5. import Button from "components/CustomButtons/Button.js";
  6. import GridItem from "components/Grid/GridItem.js";
  7. import Card from "components/Card/Card.js";
  8. import Icon from "@material-ui/core/Icon";
  9. import styles from "assets/jss/nextjs-material-kit/pages/landingPageSections/workStyle.js";
  10. import Paper from '@material-ui/core/Paper';
  11. import Grid from '@material-ui/core/Grid';
  12. //image
  13. import img1 from "assets/img/gallery/1.jpg";
  14. import img2 from "assets/img/gallery/2.jpg";
  15. import img3 from "assets/img/gallery/3.jpg";
  16. import img4 from "assets/img/gallery/4.jpg";
  17. import img5 from "assets/img/gallery/5.jpg";
  18. import img6 from "assets/img/gallery/6.jpg";
  19. import img7 from "assets/img/gallery/7.jpg";
  20. import img8 from "assets/img/gallery/8.jpg";
  21. const useStyles = makeStyles(styles);
  22. export default function WorkSection() {
  23. const classes = useStyles();
  24. return (
  25. <div><br/>
  26. <h3 className={classes.title}>Thamrin Group Gallery</h3>
  27. <div className={classes.section} id="notifications" style={{marginTop:"-150px"}}>
  28. <div className={classes.section}>
  29. <div className={classes.container} align="center">
  30. <Grid container style={{padding:"10px"}}>
  31. <Grid item xs={3} style={{padding:"10px"}}>
  32. <Card>
  33. <img src={img1} alt="First slide" className="slick-image"/>
  34. </Card>
  35. </Grid>
  36. <Grid item xs={3} style={{padding:"10px"}}>
  37. <Card>
  38. <img src={img2} alt="First slide" className="slick-image"/>
  39. </Card>
  40. </Grid>
  41. <Grid item xs={3} style={{padding:"10px"}}>
  42. <Card>
  43. <img src={img3} alt="First slide" className="slick-image" />
  44. </Card>
  45. </Grid>
  46. <Grid item xs={3} style={{padding:"10px"}}>
  47. <Card>
  48. <img src={img4} alt="First slide" className="slick-image"/>
  49. </Card>
  50. </Grid>
  51. </Grid>
  52. <Grid container style={{padding:"10px", marginTop:"-80px"}}>
  53. <Grid item xs={3} style={{padding:"10px"}}>
  54. <Card>
  55. <img src={img5} alt="First slide" className="slick-image"/>
  56. </Card>
  57. </Grid>
  58. <Grid item xs={3} style={{padding:"10px"}}>
  59. <Card>
  60. <img src={img6} alt="First slide" className="slick-image"/>
  61. </Card>
  62. </Grid>
  63. <Grid item xs={3} style={{padding:"10px"}}>
  64. <Card>
  65. <img src={img7} alt="First slide" className="slick-image" />
  66. </Card>
  67. </Grid>
  68. <Grid item xs={3} style={{padding:"10px"}}>
  69. <Card>
  70. <img src={img8} alt="First slide" className="slick-image"/>
  71. </Card>
  72. </Grid>
  73. </Grid>
  74. </div>
  75. </div>
  76. </div>
  77. </div>
  78. );
  79. }