diff --git a/src/components/HomeSearchBox/index.scss b/src/components/HomeSearchBox/index.scss index 019bcce..e6c2ffb 100644 --- a/src/components/HomeSearchBox/index.scss +++ b/src/components/HomeSearchBox/index.scss @@ -77,15 +77,18 @@ form { width: 850px; input { - font-size: calc(100vw / 65); + font-size: calc(100vw / 85); padding-right: 20px; &::placeholder { - font-size: calc(100vw / 75); + font-size: calc(100vw / 95); } } button { - width: 80px; - height: 60px; + width: 65px; + height: 55px; + & img{ + width: 30px; + } } } ul { @@ -94,7 +97,7 @@ li { color: #a2b4cb; margin-left: 25px; - font-size: calc(100vw / 90); + font-size: calc(100vw / 110); } } } diff --git a/src/components/Navbar/index.scss b/src/components/Navbar/index.scss index e98e0a3..7155cd7 100644 --- a/src/components/Navbar/index.scss +++ b/src/components/Navbar/index.scss @@ -84,13 +84,6 @@ li{ padding: 0px 20px; font-size: calc(100vw / 115); - span{ - width: 2px; - height: 15px; - background-color: #3F3F3F; - margin-right: 15px; - // transform: translateY(-1px); - } } } &--buttons{ @@ -105,6 +98,13 @@ } &___logo{ padding-right: 0px !important; + span{ + width: 2px; + height: 15px; + background-color: #3F3F3F; + margin-right: 15px; + // transform: translateY(-1px); + } } &___share{ margin-left: 12px; diff --git a/src/components/StyledRating/index.tsx b/src/components/StyledRating/index.tsx index 0e0ecf1..c9fcd0f 100644 --- a/src/components/StyledRating/index.tsx +++ b/src/components/StyledRating/index.tsx @@ -4,16 +4,15 @@ import Rating from '@mui/material/Rating'; -export default function StyledRating(props : any) { - const {rate} = props; +export default function StyledRating({rate} : any) { return ( <> } - emptyIcon={} + icon={} + emptyIcon={} /> ) diff --git a/src/custom.scss b/src/custom.scss index 56a0209..13d137d 100644 --- a/src/custom.scss +++ b/src/custom.scss @@ -238,6 +238,7 @@ p { } .MuiPaper-root { + transform : translateX(50%) !important; .MuiList-root { display: flex !important; width: 200px !important; @@ -247,11 +248,12 @@ p { display: flex !important; justify-content: center !important; text-align: center !important; - padding: 10px 0px !important; + padding: 0px !important; a{ color: white; width: 100%; height: 100%; + padding: 5px 0px; } &:nth-child(even) { border-right: 1px solid #555 !important; @@ -335,6 +337,16 @@ p { } } + .MuiPaper-root { + .MuiList-root { + width : 160px !important; + li { + width : 80px !important; + font-size: calc(100vw / 110) !important; + } + } + } + .MuiOutlinedInput-input { font-size: calc(100vw / 80) !important; } diff --git a/src/redux/actions-type/book.tsx b/src/redux/actions-type/book.tsx index 65002c2..8b66b67 100644 --- a/src/redux/actions-type/book.tsx +++ b/src/redux/actions-type/book.tsx @@ -3,11 +3,6 @@ interface list { data: any; } -interface info { - type: "public/bookVOD"; - data: any; -} - interface setLessonActive { type: "book/lesson/active"; data: any; @@ -40,7 +35,6 @@ interface loading { type BookAction = | list - | info | setVideoActive | setLessonActive | gradeFilter diff --git a/src/redux/actions-type/public.tsx b/src/redux/actions-type/public.tsx index 371135b..2a51ab6 100644 --- a/src/redux/actions-type/public.tsx +++ b/src/redux/actions-type/public.tsx @@ -8,6 +8,11 @@ interface getBlogList { data: any; } +interface bookInfo { + type: "public/vod/bookCourse" + data: any +} + interface getBlogInfo { type: "public/blogInfo"; data: any; @@ -44,7 +49,7 @@ interface selectMenu { } interface getHeader{ - type: "public/homePageVOD"; + type: "public/VOD/homePage"; data: any; } @@ -65,6 +70,7 @@ interface loading { type PublicAction = | getBlogList | getBlogInfo + | bookInfo | setSubscribe | getHomeData | setFaqActive diff --git a/src/redux/actions/book.tsx b/src/redux/actions/book.tsx index c78db45..ce43ee0 100644 --- a/src/redux/actions/book.tsx +++ b/src/redux/actions/book.tsx @@ -5,10 +5,6 @@ const book = { (data = {}) => async (dispatch: Dispatch) => await proxy.get("book/list", data, { dispatch }), - info: - (data = {}) => - async (dispatch: Dispatch) => - await proxy.get("public/bookVOD", data, { dispatch }), setLessonActive: (data: undefined) => async (dispatch: Dispatch) => await dispatch({ type: "book/lesson/active", data: data }), setVideoActive: (data: undefined) => async (dispatch: Dispatch) => diff --git a/src/redux/actions/public.tsx b/src/redux/actions/public.tsx index 192d8d5..051bca6 100644 --- a/src/redux/actions/public.tsx +++ b/src/redux/actions/public.tsx @@ -6,7 +6,10 @@ const publicApi = { setFaqActive: (data: {}) => async (dispatch: Dispatch) => await dispatch({ type: "public/faq/activate", data: data }), - + bookInfo: + (data = {}) => + async (dispatch: Dispatch) => + await proxy.get("public/vod/bookCourse", data, { dispatch }), getContactData: (data = {}) => async (dispatch: Dispatch) => @@ -32,7 +35,7 @@ const publicApi = { getHeader: (data = {}) => async (dispatch: Dispatch) => - await proxy.get("public/homePageVOD", data, { dispatch }), + await proxy.get("public/VOD/homePage", data, { dispatch }), }; export default publicApi; diff --git a/src/redux/reducers/book.tsx b/src/redux/reducers/book.tsx index 4248b84..b5ef59a 100644 --- a/src/redux/reducers/book.tsx +++ b/src/redux/reducers/book.tsx @@ -336,14 +336,6 @@ export default function book(state = initialState, action: BookAction) { filterResult: data, error: null, }; - case "public/bookVOD": - return { - ...state, - loading: false, - info: data, - selectedVideo: data.vods[0], - error: null, - }; case "book/lesson/active": return { ...state, diff --git a/src/redux/reducers/public.tsx b/src/redux/reducers/public.tsx index 0231b0f..1f3c84a 100644 --- a/src/redux/reducers/public.tsx +++ b/src/redux/reducers/public.tsx @@ -28,7 +28,9 @@ const initialState = { ], header : [], selectedMenu : null, - contactData: null + contactData: null, + selectedVideo: null, + bookInfo : null, }; const grades = [ @@ -49,6 +51,14 @@ const grades = [ export default function publicApi(state = initialState, action: PublicAction) { let { type, data } = action; switch (type) { + case "public/vod/bookCourse": + return { + ...state, + loading: false, + bookInfo: data, + selectedVideo: data.vods[0], + error: null, + }; case "public/homePage": let itemsLevel; if (window.innerWidth > 1000) { @@ -176,7 +186,7 @@ export default function publicApi(state = initialState, action: PublicAction) { return { ...state, loading: false, error: null, city: data }; case "public/selectMenu": return { ...state, loading: false, error: null, selectedMenu : data }; - case "public/homePageVOD": + case "public/VOD/homePage": return { ...state, loading: false, error: null, header : data }; case "loading": return { ...state, loading: true }; diff --git a/src/views/Course/Lesson/index.scss b/src/views/Course/Lesson/index.scss index f8da933..c063b34 100644 --- a/src/views/Course/Lesson/index.scss +++ b/src/views/Course/Lesson/index.scss @@ -1,5 +1,7 @@ .lesson { - transition: all 0.5 ease-in; + transition: all 0.3s; + overflow : hidden; + border-bottom: 1px solid #b3b3b3; &__active{ border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; @@ -26,11 +28,12 @@ border-left: 1px solid #b3b3b3; border-right: 1px solid #b3b3b3; transition: all 0.4s ease-in; + overflow: hidden; & img{ - width: 40px; + width: 30px; + margin-right: 15px; } &--sample{ - margin-bottom: 15px; color: white; li{ text-align: center; @@ -41,7 +44,6 @@ } } &--active{ - padding : 30px 15px 20px !important; border-bottom: 1px solid #b3b3b3; } } @@ -54,25 +56,25 @@ margin-right: 5px; } h4 { - font-size: 21px; + font-size: 18px; margin-right: 30px; } div { - font-size: 18px; + font-size: 16px; } } &__duration{ - width: 260px; + width: 175px; text-align: center; } &__files{ &--sample{ li{ width : 120px; - font-size: 19px; + font-size: 16px; } h5{ - font-size: 19px; + font-size: 16px; } } } @@ -84,32 +86,33 @@ header { img{ margin-right: 5px; + width : 30px; } h4 { - font-size: calc(100vw / 75); + font-size: calc(100vw / 95); margin-right: 30px; } div { - font-size: calc(100vw / 80); + font-size: calc(100vw / 95); } } &__duration{ - width: 250px; + width: 170px; text-align: center; } &__files{ &--sample{ li{ width : 120px; - font-size: calc(100vw / 75); + font-size: calc(100vw / 95); } h5{ - font-size: calc(100vw/ 75); + font-size: calc(100vw/ 100); } } &--active{ - padding: 15px 5px !important; + padding: 5px !important; } } diff --git a/src/views/Course/Lesson/index.tsx b/src/views/Course/Lesson/index.tsx index 5b2c613..eba3d26 100644 --- a/src/views/Course/Lesson/index.tsx +++ b/src/views/Course/Lesson/index.tsx @@ -42,7 +42,7 @@ function Lesson(props: any) {
    1007 - ? window.innerWidth / 75 + 45 + ? window.innerWidth / 33 + 20 : window.innerWidth / 33 + 45) : "0px", }} > - {lesson.files.map((data: any, i: any) => ( + {lesson.map((data: any, i: any) => (
  • {data.type !== "document" && data.duration}
  • {data.view && "مشاهده"}
  • -
  • {data.download ? "دانلود" : }
  • + {/*
  • {data.download ? "دانلود" : }
  • */}
))} diff --git a/src/views/Course/index.scss b/src/views/Course/index.scss index 0ad2f8a..8426ab5 100644 --- a/src/views/Course/index.scss +++ b/src/views/Course/index.scss @@ -181,35 +181,29 @@ &--image{ img{ // width: 250px; - height: 380px; + height: 350px; } } &--description{ - a{ - font-size: calc(100vw / 90); - } - li{ - font-size: calc(100vw / 90); - } h1{ - font-size: calc(100vw / 40); + font-size: calc(100vw / 50); } p{ - font-size: calc(100vw / 80);; + font-size: calc(100vw / 100);; } .course-info-items{ width: 45%; margin-top: 20px; & img{ margin-left: 10px; - width : 45px; + width : 40px; } i{ - font-size: calc(100vw / 95); + font-size: calc(100vw / 120); font-family: numeralLight; } p{ - font-size: calc(100vw / 100); + font-size: calc(100vw / 130); margin: 0px; } } diff --git a/src/views/Course/index.tsx b/src/views/Course/index.tsx index e7b761d..385d133 100644 --- a/src/views/Course/index.tsx +++ b/src/views/Course/index.tsx @@ -11,10 +11,9 @@ import play from "../../assets/icons/play.png"; import bookmark from "../../assets/icons/bookmark.png"; import StyledRating from "../../components/StyledRating"; import { connect } from "react-redux"; -import { book } from "../../redux/actions"; +import { publicApi } from "../../redux/actions"; import scroll from "../../util/scroll"; - function Course({ lessons, getInfo, info }: any) { const [links, setLinks] = useState([ { link: "/", name: "صفحه اصلی" }, @@ -25,14 +24,23 @@ function Course({ lessons, getInfo, info }: any) { useEffect(() => { scroll.goToTop(); getInfo({ - bookId: 1 + bookId: 18, // window.location.pathname.slice( // window.location.pathname.lastIndexOf("/") + 1, // window.location.pathname.length // ), }); }, []); - + let allCats; + let cats = []; + if (info?.vods) { + allCats = Array.from( + new Set(info?.vods.map((item: any) => item.categoryId && item.categoryId)) + ); + cats = allCats.map((item: any) => + info?.vods.filter((item1: any) => item1.categoryId === item) + ); + } return (
@@ -40,12 +48,16 @@ function Course({ lessons, getInfo, info }: any) {
- +

{info?.name}

+

{info?.text}

@@ -69,12 +81,12 @@ function Course({ lessons, getInfo, info }: any) {
- 10 - /2 + {Number(info?.rate) * 2 || 10} + /10
از 288 رای
- +

میانگین رای کاربران

@@ -139,7 +154,7 @@ function Course({ lessons, getInfo, info }: any) {

سر فصل دوره

در این قسمت شاید یک متن جهت زیباسازی قرار بگیرد

- {lessons.map((lesson: any, i: any) => ( + {cats?.map((lesson: any, i: any) => ( ))} @@ -152,7 +167,7 @@ function Course({ lessons, getInfo, info }: any) { export default connect( (state: any) => ({ lessons: state.book.mockLessons, - info : state.book.info, + info: state.publicApi.bookInfo, }), - { getInfo: book.info } + { getInfo: publicApi.bookInfo } )(Course); diff --git a/src/views/Courses/Course/index.tsx b/src/views/Courses/Course/index.tsx index 9bf09aa..a153f65 100644 --- a/src/views/Courses/Course/index.tsx +++ b/src/views/Courses/Course/index.tsx @@ -13,6 +13,7 @@ export default function Course({ data }: any) { لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه روزنامه و مجله در ستون و

+
); diff --git a/src/views/Home/Blogs/Blog/index.scss b/src/views/Home/Blogs/Blog/index.scss index b51a54a..c6b2150 100644 --- a/src/views/Home/Blogs/Blog/index.scss +++ b/src/views/Home/Blogs/Blog/index.scss @@ -30,7 +30,6 @@ } h2 { color: white; - font-family: numeralBold; } } @@ -60,7 +59,7 @@ transform : scale(0.9); } h2 { - font-size: calc(100vw / 80); + font-size: calc(100vw / 100); } p { font-size: calc(100vw / 130); diff --git a/src/views/Home/Courses/Course/index.scss b/src/views/Home/Courses/Course/index.scss index 4b969bb..0109720 100644 --- a/src/views/Home/Courses/Course/index.scss +++ b/src/views/Home/Courses/Course/index.scss @@ -64,7 +64,7 @@ height: 280px; } h2{ - font-size: calc(100vw / 80); + font-size: calc(100vw / 90); } p{ font-size: calc(100vw / 130); diff --git a/src/views/Home/Courses/index.scss b/src/views/Home/Courses/index.scss index 15466fa..744e73b 100644 --- a/src/views/Home/Courses/index.scss +++ b/src/views/Home/Courses/index.scss @@ -63,10 +63,10 @@ max-width: 1250px; header{ h1{ - font-size: calc(100vw / 60); + font-size: calc(100vw / 75); } span{ - font-size: calc(100vw / 100); + font-size: calc(100vw / 120); } } &__more{ diff --git a/src/views/VideoTube/index.tsx b/src/views/VideoTube/index.tsx index 089e39c..554e2e0 100644 --- a/src/views/VideoTube/index.tsx +++ b/src/views/VideoTube/index.tsx @@ -12,7 +12,7 @@ import "./index.scss"; import listIcon from "../../assets/icons/list.png"; import { connect } from "react-redux"; import scroll from "../../util/scroll.js"; -import { book } from "../../redux/actions"; +import { book, publicApi } from "../../redux/actions"; function VodTube({ videoList, @@ -25,15 +25,16 @@ function VodTube({ }: any) { useEffect(() => { getBookList(); - getInfo({ - bookId: 1, - // window.location.pathname.slice( - // window.location.pathname.lastIndexOf("/") + 1, - // window.location.pathname.length - // ), - }); + // getInfo({ + // bookId: 1, + // // window.location.pathname.slice( + // // window.location.pathname.lastIndexOf("/") + 1, + // // window.location.pathname.length + // // ), + // }); scroll.goToTop(); }, []); + return (
@@ -131,5 +132,5 @@ export default connect( comments: state.book.comments, info: state.book.info, }), - { getInfo: book.info, getBookList : book.list } + { getInfo: publicApi.bookInfo, getBookList : book.list } )(VodTube);