Reza_ashrafi
/
danovin_vod
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

reza added aniamtion

Browse Source
master
RezaAshrafi77 3 years ago
parent c0bb31ac48
commit e01cd1b911
17 changed files with 143 additions and 166 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 28
      src/components/GradeFilter/index.scss
  2. 11
      src/components/GradeFilter/index.tsx
  3. 2
      src/components/HomeSearchBox/index.scss
  4. 9
      src/components/JolPlayer/index.js
  5. 4
      src/custom.scss
  6. 6
      src/redux/actions-type/public.tsx
  7. 8
      src/redux/actions/public.tsx
  8. 100
      src/redux/reducers/public.tsx
  9. 11
      src/views/Auth/SignUp/index.scss
  10. 23
      src/views/Contact/index.scss
  11. 56
      src/views/Contact/index.tsx
  12. 1
      src/views/Course/Lesson/index.scss
  13. 38
      src/views/Course/index.scss
  14. 6
      src/views/Course/index.tsx
  15. 3
      src/views/Home/Courses/index.scss
  16. 2
      src/views/VideoTube/Comment/index.scss
  17. 1
      src/views/VideoTube/index.scss

28
src/components/GradeFilter/index.scss
Unescape View File

@ -5,7 +5,6 @@
font-family: numeralLight; font-family: numeralLight;
background-color: #383838; background-color: #383838;
border-radius: 6px; border-radius: 6px;
height: 36px;
&__box{ &__box{
display: none !important; display: none !important;
} }
@ -22,16 +21,27 @@
} }
ul{ ul{
flex: 1; flex: 1;
figure{
position: absolute;
top: 0px;
right: 0px;
height: 100%;
width : calc(100% / 12);
transition: right 0.5s;
background-color: #9CDF52;
box-shadow: 0px 0px 20px #9CDF52;
z-index: 50;
}
li{ li{
width: calc(100% / 12); width: calc(100% / 12);
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;
padding: 6px 0px; padding: 6px 0px;
// box-shadow: 0px 0px 20px #9CDF52;
// background-color: #9CDF52;
} }
} }
&__active{ &__active{
background-color: #9CDF52;
box-shadow: 0px 0px 20px #9CDF52;
border-radius: 5px; border-radius: 5px;
} }
} }
@ -39,11 +49,17 @@
@media screen and (min-width: 1441px){ @media screen and (min-width: 1441px){
.grade-filter{ .grade-filter{
max-width: 1350px; max-width: 1350px;
ul{
position: relative;
}
h1{ h1{
font-size: calc(100vw / 120); font-size: calc(100vw / 120);
} }
li{ li{
font-size: calc(100vw / 90); font-size: calc(100vw / 90);
background-color: rgba(255, 255, 255, 0) ;
z-index: 100;
padding: 10px 0px !important;
} }
} }
} }
@ -51,11 +67,17 @@
@media screen and (min-width: 1008px) and (max-width: 1440px){ @media screen and (min-width: 1008px) and (max-width: 1440px){
.grade-filter{ .grade-filter{
max-width: 1250px; max-width: 1250px;
ul{
position: relative;
}
h1{ h1{
font-size: calc(100vw / 120); font-size: calc(100vw / 120);
} }
li{ li{
font-size: calc(100vw / 90); font-size: calc(100vw / 90);
background-color: inherit !important;
z-index: 100;
padding: 10px 0px;
} }
} }

11
src/components/GradeFilter/index.tsx
Unescape View File

@ -1,16 +1,20 @@
import React, { useState, useEffect } from "react"; import React, { useState, useEffect, useRef } from "react";
import { connect } from "react-redux"; import { connect } from "react-redux";
import { book } from "../../redux/actions"; import { book } from "../../redux/actions";
import "./index.scss"; import "./index.scss";
import dropdown from "../../assets/icons/dropdown.png"; import dropdown from "../../assets/icons/dropdown.png";
function GradeFilter({selectedGrade, gradeFilter, grades}: any) { function GradeFilter({selectedGrade, gradeFilter, grades}: any) {
const [arrowTop, setArrowTop] = useState(false); const [arrowTop, setArrowTop] = useState(false);
useEffect(() => { useEffect(() => {
setArrowTop(false); setArrowTop(false);
}, [selectedGrade]); }, [selectedGrade]);
const mobileList = useRef<HTMLUListElement>(null);
return ( return (
<section className="grade-filter d-flex align-items-center"> <section className="grade-filter d-flex align-items-center">
<h1 className="d-flex align-items-center"> <h1 className="d-flex align-items-center">
@ -47,12 +51,13 @@ function GradeFilter({selectedGrade, gradeFilter, grades}: any) {
</ul> </ul>
) : null} ) : null}
<ul className="desktop align-items-center"> <ul className="desktop align-items-center" ref={mobileList}>
{ selectedGrade && <figure style={{ right : (mobileList as any).current?.offsetWidth / 12 * (selectedGrade - 1) }}></figure> }
{grades.map((item: any, i: any) => ( {grades.map((item: any, i: any) => (
<li <li
key={i} key={i}
onClick={(e) => gradeFilter(item.value)} onClick={(e) => gradeFilter(item.value)}
className={selectedGrade === item.value ? "grade-filter__active" : ""} // className={selectedGrade === item.value ? "grade-filter__active" : ""}
> >
{item.name} {item.name}
</li> </li>

2
src/components/HomeSearchBox/index.scss
Unescape View File

@ -135,7 +135,7 @@
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
.home-search-box { .home-search-box {
max-width: 500px; max-width: 500px;
padding: 10px 0px; padding: 10px 0px 0px;
flex: 1; flex: 1;
&__voice { &__voice {
display: flex !important; display: flex !important;

9
src/components/JolPlayer/index.js
Unescape View File

@ -3,18 +3,19 @@ import file from "../../assets/videos/sea.mp4";
const Video = ({fileIds}) => { const Video = ({fileIds}) => {
return ( return (
<div style={{direction: 'ltr', textAlign: 'left'}}> <div style={{direction: 'ltr', textAlign: 'left', marginBottom: 10,}}>
<JoLPlayer <JoLPlayer
option={{ option={{
videoSrc: `https://dnvn.ir/api/v1/file/${fileIds}`, videoSrc: `https://dnvn.ir/api/v1/file/${fileIds}`,
width: '100%', width: '100%',
height: 400, height: window.innerWidth > 1000 ? 450 : 250,
theme : '#4dd35b', theme : '#4dd35b',
language : 'en', language : 'en',
isShowMultiple: true, isShowMultiple: window.innerWidth > 700,
hideMouseTime : 10000, hideMouseTime : 10000,
isShowPicture : true, isShowPicture : true,
isShowScreenshot : true, isShowScreenshot : window.innerWidth > 700,
isShowSet : window.innerWidth > 700,
isShowPauseButton : false, isShowPauseButton : false,
quality: [{ quality: [{
name: "SD", url : `https://dnvn.ir/api/v1/file/${fileIds}`, name: "SD", url : `https://dnvn.ir/api/v1/file/${fileIds}`,

4
src/custom.scss
Unescape View File

@ -10,6 +10,10 @@
display: flex; display: flex;
} }
p{
line-height: 1.5;
}
.submit-large { .submit-large {
padding: 12px 24px; padding: 12px 24px;
} }

6
src/redux/actions-type/public.tsx
Unescape View File

@ -33,6 +33,11 @@ interface getCity {
data: any; data: any;
} }
interface getContactData{
type : 'public/contact'
data: any;
}
interface error { interface error {
type: "error"; type: "error";
data: undefined; data: undefined;
@ -55,6 +60,7 @@ type PublicAction =
| setFaqActive | setFaqActive
| getProvince | getProvince
| getCity | getCity
|getContactData
| loading | loading
| error; | error;

8
src/redux/actions/public.tsx
Unescape View File

@ -13,10 +13,10 @@ const publicApi = {
// searchFaq: (data: String) => async (dispatch: Dispatch) => // searchFaq: (data: String) => async (dispatch: Dispatch) =>
// await dispatch({ type: "public/faq/search", data: data }), // await dispatch({ type: "public/faq/search", data: data }),
// getContactData: getContactData:
// (data = {}) => (data = {}) =>
// async (dispatch: Dispatch) => async (dispatch: Dispatch) =>
// await proxy.get("public/contact", data, { dispatch }), await proxy.get("public/contact", data, { dispatch }),
// getArList: (data: undefined) => async (dispatch: Dispatch) => // getArList: (data: undefined) => async (dispatch: Dispatch) =>
// await proxy.get("public/ar", data, { dispatch }), // await proxy.get("public/ar", data, { dispatch }),

100
src/redux/reducers/public.tsx
Unescape View File

@ -12,43 +12,6 @@ const initialState = {
blog: null, blog: null,
province : null, province : null,
city : null, city : null,
mockSubscribes: [
{
id: 0,
name: "اشتراک 3 ماهه",
finalPrice: "19.000",
offPercent: 0,
off: 0,
},
{
id: 1,
name: "اشتراک 3 ماهه",
finalPrice: "19.000",
offPercent: 0,
off: 0,
},
{
id: 2,
name: "اشتراک 6 ماهه",
finalPrice: "30.000",
offPercent: 30,
off: "10.000",
},
{
id: 3,
name: "اشتراک 6 ماهه",
finalPrice: "40.000",
offPercent: 0,
off: 0,
},
],
selectedSubscribe: {
id: 0,
name: "اشتراک 3 ماهه",
finalPrice: "19.000",
offPercent: 0,
off: 0,
},
departmans: [ departmans: [
{ {
id: 0, id: 0,
@ -63,53 +26,7 @@ const initialState = {
name: "برنامه نویسی", name: "برنامه نویسی",
}, },
], ],
contactData: [ contactData: null
{
name: "آدرس ما",
value: "تهران خیابان انقلاب بین ابوریحان و فلسطین بن بست سروش پلاک 2",
},
{
name: "شماره تماس",
value: "02163462405 - 02163462406",
},
{
name: "شماره پیامک",
value: "300000000008762144",
},
{
name: "ایمیل سازمانی",
value: "Info@Danovin.ir",
},
],
faqList: [
{
id : 0,
name: "نحوه خرید از سایت دانوین چگونه است ؟",
active: true,
value:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی ",
},
{
id : 1,
name: "در این قسمت متن جدید خواهد آمد؟",
active: false,
value:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی ",
},
{
id : 2,
name: "چرا باید در این قسمت پرسش های متداول طرح شود؟",
active: false,
value:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی ",
},
{
id : 3,
name : 'این متن جهت سردرگرمی شما نوشته شده و کاربرد دیگری ندارد',
active : false,
value : 'لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی '
}
],
}; };
const grades = [ const grades = [
@ -230,17 +147,6 @@ export default function publicApi(state = initialState, action: PublicAction) {
// }; // };
// case "faq/list": // case "faq/list":
// return { ...state, loading: false, error: null, faqList: data }; // return { ...state, loading: false, error: null, faqList: data };
case "public/faq/activate":
return {
...state,
loading: false,
error: null,
faqList: state.faqList.map((item : any) =>
item.id === data
? { ...item, active: !item.active }
: { ...item, active: false }
),
};
// case "public/faq/search": // case "public/faq/search":
// return { // return {
// ...state, // ...state,
@ -252,8 +158,8 @@ export default function publicApi(state = initialState, action: PublicAction) {
// item.description.indexOf(data) !== -1 // item.description.indexOf(data) !== -1
// ), // ),
// }; // };
// case "public/contact": case "public/contact":
// return { ...state, loading: false, error: null, contactData: data }; return { ...state, loading: false, error: null, contactData: data };
// case "public/ar": // case "public/ar":
// return { ...state, loading: false, error: null, arList: data }; // return { ...state, loading: false, error: null, arList: data };
case "public/blogList": case "public/blogList":

11
src/views/Auth/SignUp/index.scss
Unescape View File

@ -258,7 +258,7 @@
justify-content: center; justify-content: center;
b { b {
color: white; color: white;
font-size: calc(100vw / 20); font-size: calc(100vw / 25);
margin-bottom: 30px; margin-bottom: 30px;
font-weight: 500; font-weight: 500;
p{ p{
@ -270,7 +270,7 @@
background-color: #2a2a2a; background-color: #2a2a2a;
border: 1px solid #a2a2a2; border: 1px solid #a2a2a2;
border-radius: 8px; border-radius: 8px;
font-size: calc(100vw / 20); font-size: calc(100vw / 22);
padding: 10px 14px; padding: 10px 14px;
color: white; color: white;
direction: ltr; direction: ltr;
@ -286,18 +286,19 @@
margin-top: 20px; margin-top: 20px;
background-color: #84de56; background-color: #84de56;
color: white; color: white;
font-size: calc(100vw / 20); font-size: calc(100vw / 24);
padding: 10px 0px; padding: 12px 0px;
border: 0px; border: 0px;
border-radius: 10px; border-radius: 10px;
} }
} }
&__info { &__info {
width: 300px; width: 300px;
margin: 20px auto 0px; margin: 30px auto 0px;
text-align: center; text-align: center;
color: white; color: white;
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
line-height: 1.5;
a { a {
color: #84de56; color: #84de56;
} }

23
src/views/Contact/index.scss
Unescape View File

@ -31,19 +31,34 @@
} }
} }
&__tab{ &__tab{
margin-bottom: 30px; margin-bottom: 15px;
border-radius: 10px !important; border-radius: 10px !important;
border: 1px solid #4DD35B; border: 1px solid #4DD35B;
position: relative;
figure{
z-index: 1 !important;
border-radius: 10px;
position: absolute;
background-color: #4DD35B !important;
width : 50%;
height: 100%;
left: 50%;
top: 0px;
transition: left 0.5s;
}
button{ button{
width: 50%; width: 50%;
padding: 10px 0px; padding: 10px 0px;
border: none; border: none;
background-color: inherit; background-color: rgba(255, 255, 255, 0);
border-radius: 10px !important; border-radius: 10px !important;
color: #4DD35B; color: #4DD35B;
z-index: 200;
}
&--figureactive{
left: 0px !important;
} }
&--active{ &--active{
background-color: #4DD35B !important;
color: white !important; color: white !important;
} }
} }
@ -173,6 +188,7 @@
padding: 40px 10px; padding: 40px 10px;
header{ header{
padding-bottom: 20px; padding-bottom: 20px;
border: none;
h1{ h1{
font-size: calc(100vw / 18); font-size: calc(100vw / 18);
} }
@ -197,6 +213,7 @@
background-color: #83de564b; background-color: #83de564b;
padding: 10px; padding: 10px;
border-radius: 10px; border-radius: 10px;
margin-bottom: 15px;
h2{ h2{
font-size: calc(100vw / 27); font-size: calc(100vw / 27);
color: #4DD35B; color: #4DD35B;

56
src/views/Contact/index.tsx
Unescape View File

@ -8,7 +8,8 @@ import Textarea from "../../components/Textarea/index";
import Select from "../../components/Select/index"; import Select from "../../components/Select/index";
import Location from "../../components/Location/index"; import Location from "../../components/Location/index";
import { connect } from "react-redux"; import { connect } from "react-redux";
import scroll from '../../util/scroll'; import scroll from "../../util/scroll";
import { publicApi } from "../../redux/actions";
interface FormData { interface FormData {
name?: string; name?: string;
@ -17,7 +18,7 @@ interface FormData {
text?: string; text?: string;
} }
function Contact({ departmans, selectedDepartman, contactData }: any) { function Contact({ departmans, selectedDepartman, contactData, getContactData }: any) {
const [formData, setFormData] = useState<FormData | undefined>(undefined); const [formData, setFormData] = useState<FormData | undefined>(undefined);
const [unit, setUnit] = useState("info"); const [unit, setUnit] = useState("info");
const onChange = (e: any) => { const onChange = (e: any) => {
@ -26,7 +27,8 @@ function Contact({ departmans, selectedDepartman, contactData }: any) {
useEffect(() => { useEffect(() => {
scroll.goToTop(); scroll.goToTop();
},[]) getContactData();
}, []);
return ( return (
<div className="contact main d-flex flex-column"> <div className="contact main d-flex flex-column">
@ -36,7 +38,8 @@ function Contact({ departmans, selectedDepartman, contactData }: any) {
<h1>تماس با ما</h1> <h1>تماس با ما</h1>
</header> </header>
<div className="mobile flex-column"> <div className="mobile flex-column">
<div className="d-flex contact__tab"> <div className="d-flex contact__tab">
<figure className={unit !== "info" ? "contact__tab--figureactive" : ""}></figure>
<button <button
className={unit === "info" ? "contact__tab--active" : ""} className={unit === "info" ? "contact__tab--active" : ""}
onClick={() => setUnit("info")} onClick={() => setUnit("info")}
@ -53,15 +56,18 @@ function Contact({ departmans, selectedDepartman, contactData }: any) {
{unit === "info" && ( {unit === "info" && (
<section className="contact__info d-flex flex-column py-3"> <section className="contact__info d-flex flex-column py-3">
<div className="d-flex flex-column"> <div className="d-flex flex-column">
{contactData.map((item: any, i: any) => ( <div className="contact__info--data d-flex flex-column">
<div <h2>آدرس</h2>
className="contact__info--data d-flex flex-column" <p>{contactData?.address}</p>
key={i} </div>
> <div className="contact__info--data d-flex flex-column">
<h2>{item.name}</h2> <h2>شماره تماس</h2>
<p>{item.value}</p> <p>{contactData?.cellphone}</p>
</div> </div>
))} <div className="contact__info--data d-flex flex-column">
<h2>ایمیل</h2>
<p>{contactData?.email}</p>
</div>
</div> </div>
<div className="contact__info--map d-flex"> <div className="contact__info--map d-flex">
<Location /> <Location />
@ -76,7 +82,7 @@ function Contact({ departmans, selectedDepartman, contactData }: any) {
name="name" name="name"
label="نام" label="نام"
align="right" align="right"
onInput={onInput.persianOnly()} onInput={onInput.persianOnly}
onChange={onChange} onChange={onChange}
/> />
</div> </div>
@ -112,7 +118,7 @@ function Contact({ departmans, selectedDepartman, contactData }: any) {
name="name" name="name"
label="نام" label="نام"
align="right" align="right"
onInput={onInput.persianOnly()} onInput={onInput.persianOnly}
onChange={onChange} onChange={onChange}
/> />
</div> </div>
@ -140,12 +146,18 @@ function Contact({ departmans, selectedDepartman, contactData }: any) {
</section> </section>
<section className="contact__info d-flex flex-column py-3"> <section className="contact__info d-flex flex-column py-3">
<div className="d-flex flex-wrap justify-content-between"> <div className="d-flex flex-wrap justify-content-between">
{contactData.map((item: any, i: any) => ( <div className="contact__info--data d-flex flex-column">
<div className="contact__info--data d-flex flex-column" key={i}> <h2>آدرس</h2>
<h2>{item.name}</h2> <p>{contactData?.address}</p>
<p>{item.value}</p> </div>
</div> <div className="contact__info--data d-flex flex-column">
))} <h2>شماره تماس</h2>
<p>{contactData?.cellphone}</p>
</div>
<div className="contact__info--data d-flex flex-column">
<h2>ایمیل</h2>
<p>{contactData?.email}</p>
</div>
</div> </div>
<div className="contact__info--map d-flex"> <div className="contact__info--map d-flex">
<Location /> <Location />
@ -162,4 +174,4 @@ export default connect((state: any) => ({
departmans: state.publicApi.departmans, departmans: state.publicApi.departmans,
selectedDepartman: state.publicApi.selectedDepartman, selectedDepartman: state.publicApi.selectedDepartman,
contactData: state.publicApi.contactData, contactData: state.publicApi.contactData,
}))(Contact); }), {getContactData : publicApi.getContactData})(Contact);

1
src/views/Course/Lesson/index.scss
Unescape View File

@ -169,6 +169,7 @@
header { header {
border-top-right-radius: 10px; border-top-right-radius: 10px;
border-top-left-radius: 10px; border-top-left-radius: 10px;
padding: 15px 5px !important;
h4 { h4 {
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
} }

38
src/views/Course/index.scss
Unescape View File

@ -1,9 +1,7 @@
.course{ .course{
main{ &__header{
header{ padding: 30px 0px 45px;
padding: 30px 0px 45px; border-bottom:2px solid #4a4a4a;
border-bottom:2px solid #4a4a4a;
}
} }
&__info{ &__info{
&--image{ &--image{
@ -65,7 +63,7 @@
margin-bottom: 30px; margin-bottom: 30px;
border-radius: 10px; border-radius: 10px;
header{ &--header{
padding: 20px 0px 20px !important; padding: 20px 0px 20px !important;
border: 0px !important; border: 0px !important;
h2{ h2{
@ -160,7 +158,7 @@
} }
} }
&__list{ &__list{
header{ &--header{
h2{ h2{
font-size: 25px; font-size: 25px;
} }
@ -252,7 +250,7 @@
} }
} }
&__list{ &__list{
header{ &--header{
h2{ h2{
font-size: calc(100vw / 65); font-size: calc(100vw / 65);
} }
@ -270,17 +268,17 @@
main { main {
max-width: 900px; max-width: 900px;
padding: 0px 20px; padding: 0px 20px;
header{
padding: 0px;
padding-bottom: 20px;
padding-top: 20px;
}
p{ p{
margin-top: 20px; margin-top: 20px;
color: #d3d3d3; color: #d3d3d3;
font-size: calc(100vw / 45); font-size: calc(100vw / 45);
} }
} }
&__header{
padding: 0px;
padding-bottom: 20px;
padding-top: 20px;
}
&__info{ &__info{
flex: 3; flex: 3;
&--image{ &--image{
@ -348,7 +346,7 @@
} }
} }
&__list{ &__list{
header{ &--header{
h2{ h2{
font-size: calc(100vw / 35); font-size: calc(100vw / 35);
margin-top: 20px; margin-top: 20px;
@ -366,13 +364,15 @@
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
.course{ .course{
background : black; background : black;
margin-top: 20px;
&__header{
padding: 0px;
padding-bottom: 20px;
}
main { main {
max-width: 500px; max-width: 500px;
padding: 0px 10px; padding: 0px 10px;
header{
padding: 0px;
padding-bottom: 20px;
}
p{ p{
margin-top: 20px; margin-top: 20px;
color: #d3d3d3; color: #d3d3d3;
@ -445,7 +445,7 @@
} }
} }
&__list{ &__list{
header{ &--header{
h2{ h2{
font-size: calc(100vw / 25); font-size: calc(100vw / 25);
margin-top: 20px; margin-top: 20px;

6
src/views/Course/index.tsx
Unescape View File

@ -38,7 +38,7 @@ function Course({ lessons, getInfo, info }: any) {
<div className="course main d-flex flex-column"> <div className="course main d-flex flex-column">
<Navbar /> <Navbar />
<main> <main>
<header className="desktop align-items-end"> <header className="course__header desktop align-items-end">
<div className="course__info d-flex"> <div className="course__info d-flex">
<div className="course__info--image d-flex align-items-end"> <div className="course__info--image d-flex align-items-end">
<img src={`https://dnvn.ir/api/v1/file/${info?.fileIds}`} alt="" /> <img src={`https://dnvn.ir/api/v1/file/${info?.fileIds}`} alt="" />
@ -94,7 +94,7 @@ function Course({ lessons, getInfo, info }: any) {
<header className="mobile flex-column"> <header className="mobile flex-column">
<div className="course__info d-flex"> <div className="course__info d-flex">
<div className="course__info--image d-flex align-items-end"> <div className="course__info--image d-flex align-items-end">
<img src={course?.thumbnailUrl} alt="" /> <img src={`https://dnvn.ir/api/v1/file/${info?.fileIds}`} alt="" />
</div> </div>
<div className="course__info--description d-flex flex-column justify-content-between"> <div className="course__info--description d-flex flex-column justify-content-between">
<BreadCrumbs links={links} /> <BreadCrumbs links={links} />
@ -136,7 +136,7 @@ function Course({ lessons, getInfo, info }: any) {
</header> </header>
<section className="course__list d-flex flex-column"> <section className="course__list d-flex flex-column">
<header> <header className="course__list--header">
<h2>سر فصل دوره</h2> <h2>سر فصل دوره</h2>
<p>در این قسمت شاید یک متن جهت زیباسازی قرار بگیرد </p> <p>در این قسمت شاید یک متن جهت زیباسازی قرار بگیرد </p>
</header> </header>

3
src/views/Home/Courses/index.scss
Unescape View File

@ -12,7 +12,6 @@
h1{ h1{
font-family: numeralMedium; font-family: numeralMedium;
color: white; color: white;
margin: 0px;
} }
span{ span{
color: #aaa; color: #aaa;
@ -102,9 +101,11 @@
max-width: 500px; max-width: 500px;
border: 0px !important; border: 0px !important;
padding: 0px !important; padding: 0px !important;
margin-top: 15px;
header{ header{
h1{ h1{
font-size: calc(100vw / 25); font-size: calc(100vw / 25);
margin-bottom: 10px;
} }
span{ span{
font-size: calc(100vw / 34); font-size: calc(100vw / 34);

2
src/views/VideoTube/Comment/index.scss
Unescape View File

@ -75,7 +75,7 @@
.video-tube-comment{ .video-tube-comment{
width: 95%; width: 95%;
p{ p{
font-size: calc(100vw / 42); font-size: calc(100vw / 38);
strong{ strong{
font-size: calc(100vw / 35); font-size: calc(100vw / 35);
margin-left: 5px; margin-left: 5px;

1
src/views/VideoTube/index.scss
Unescape View File

@ -453,6 +453,7 @@
@media screen and (max-width: 640px) { @media screen and (max-width: 640px) {
.video-tube { .video-tube {
background : black; background : black;
margin-top: 20px;
main { main {
max-width: 500px; max-width: 500px;
margin-top: 0px; margin-top: 0px;

Write Preview
Loading…
Cancel
Save