diff --git a/src/App.css b/src/App.css index 9a0b061..be60c82 100644 --- a/src/App.css +++ b/src/App.css @@ -5,4 +5,7 @@ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; +} +*{ + transition: all 0.3s; } \ No newline at end of file diff --git a/src/view/services/index.js b/src/view/services/index.js index eafb414..a1cdfb9 100644 --- a/src/view/services/index.js +++ b/src/view/services/index.js @@ -4,6 +4,14 @@ import { book, publicApi } from "../../redux/actions"; import { connect } from 'react-redux'; import { Link } from "react-router-dom"; import Product from '../../components/Product'; + +import img1 from "../../assets/img/Group 1344.svg"; +import img2 from "../../assets/img/Group 1345.svg"; +import img3 from "../../assets/img/Group 1349.svg"; +import img4 from "../../assets/img/Group 1364.svg"; +import img5 from "../../assets/img/Group 1357.svg"; +import img6 from "../../assets/img/Group 1362.svg"; + const Services = ({ isMobile, books, getList, @@ -15,7 +23,8 @@ const Services = ({ isMobile, headerOptions, videos, }) => { - + const [checked, setChecked] = useState([false, false, false, false, false, false]); + const [filterCheck, setFilterCheck] = useState([false, false, false, false]); const [filter, setFilter] = useState({ search: "", grade: "", @@ -36,30 +45,200 @@ const Services = ({ isMobile, gradeFilter(filter.grade); }, [filter]); + const services = [ + { + title: 'کلاس های آموزشی', + image: img1, + role: '' + }, + { + title: 'پیش ثبت نام مدارس', + image: img2, + role: '' + }, + { + title: 'بسته های آزمون', + image: img3, + role: '' + }, + { + title: 'کتاب های آموزشی', + image: img4, + role: '' + }, + { + title: 'دوره های مجازی', + image: img5, + role: '' + }, + { + title: 'سایر خدمات', + image: img6, + role: '' + }, + ]; + + return ( -
-
- {books?.map((product, index) => ( - - - - - ))} +
+
+
+ { + services.map((item, index) => ( +
setChecked(prevState => [...prevState, checked[index] = !checked[index]])} + > + + { + checked[index] ?
+
+ + + + + + +
+
:
+ } + + + + + +

{item.title}

+
+ )) + } +
+ {/* filters */} +
+
+ + + + + + + + + + + + + +
+
+
setFilterCheck([...prevState, filterCheck[0] = !filterCheck[0]])} + > + +

آنلاین

+ { + filterCheck[0] &&
+
+ + + + + + +
+
+ } +
+
+ +

حضوری

+ { + filterCheck[1] &&
+
+ + + + + + +
+
+ } +
+
+
+
+ +

دختران

+ { + filterCheck[2] &&
+
+ + + + + + +
+
+ } +
+
+ +

پسران

+ { + filterCheck[3] &&
+
+ + + + + + +
+
+ } +
+
+
+ +
+ +
+ +
+ {books?.map((product, index) => ( + + + + + ))} +
+
+
+ Cart
);