mahdi
/
danovinTasks
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

update 7 files

Browse Source
master
mahdi 3 years ago
parent f90014ba4e
commit 5ba1f2ec13
7 changed files with 36 additions and 38 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. 34
      src/components/CourseList/index.js
  2. 5
      src/components/CurrentDateTime/CurrentDateShamsi/index.js
  3. 5
      src/components/CurrentDateTime/CurrentTime/index.js
  4. 2
      src/components/CurrentDateTime/index.js
  5. 10
      src/components/DivideX/DistributedData/index.js
  6. 6
      src/components/DivideX/ReligiousTimes/index.js
  7. 12
      src/components/Features/index.js

34
src/components/CourseList/index.js
Unescape View File

@ -4,23 +4,23 @@ const CourseChapter = ({ courseTitle, lessonName, grade, chapters }) => {
const [selectedLesson, setSelectedLesson] = useState(null); const [selectedLesson, setSelectedLesson] = useState(null);
return ( return (
<div className="max-h-[444px] relative p-4 bg-[#196EC033] rounded overflow-y-auto scrollYDesign"> <div className="max-h-[444px] relative p-4 bg-surface border border-surfaceBorder rounded overflow-y-auto scrollYDesign">
{/* top */} {/* top */}
<div className="flex flex-row items-center justify-between"> <div className="flex flex-row items-center justify-between">
<h2 className="text-blue-800 text-base">{courseTitle}</h2> <h2 className="text-primaryText text-base">{courseTitle}</h2>
<div className="flex flex-row-reverse items-center divide-x"> <div className="flex flex-row-reverse items-center divide-x">
<span className="text-blue-800 text-sm px-2">{lessonName}</span> <span className="text-primaryText text-sm px-2">{lessonName}</span>
<span className="text-blue-800 text-sm px-2">{grade}</span> <span className="text-primaryText text-sm px-2">{grade}</span>
</div> </div>
</div> </div>
{/* divider */} {/* divider */}
<div className="border-b border-blue-300 my-5"></div> <div className="border-b border-surfaceBorder my-5"></div>
{/* course title */} {/* course title */}
{chapters.map((chapter, index) => ( {chapters.map((chapter, index) => (
<div className="flex flex-col mt-4" key={index}> <div className="flex flex-col mt-4" key={index}>
<div className="bg-blue-600 rounded-sm p-4 flex flex-row items-center justify-between"> <div className="bg-primary rounded p-4 flex flex-row items-center justify-between">
<p className="text-sm text-white">{chapter.title}</p> <p className="text-sm text-primaryText">{chapter.title}</p>
<span className="text-sm text-white">{chapter.duration}</span> <span className="text-sm text-primaryText">{chapter.duration}</span>
</div> </div>
{/* course lessons */} {/* course lessons */}
{chapter.lessons.map((lesson, i) => ( {chapter.lessons.map((lesson, i) => (
@ -35,22 +35,22 @@ const CourseChapter = ({ courseTitle, lessonName, grade, chapters }) => {
> >
<div <div
className={`w-4 h-4 flex justify-center items-center rounded-full className={`w-4 h-4 flex justify-center items-center rounded-full
${selectedLesson === lesson ? "bg-red-600" : "bg-blue-600"}, ${selectedLesson === lesson ? "bg-error" : "bg-success"},
${lesson.passed ? "bg-red-600" : "bg-blue-600"} ${lesson.passed ? "bg-error" : "bg-success"}
`} `}
></div> ></div>
{Number(i) !== chapter.lessons.length - 1 && ( {Number(i) !== chapter.lessons.length - 1 && (
<span <span
className={`h-[65px] border-r-2 border-dotted ${ className={`h-[65px] border-r-2 border-dotted ${
lesson.passed ? "border-green-400" : "border-purple-400" lesson.passed ? "border-success" : "border-error"
}`} }`}
></span> ></span>
)} )}
</div> </div>
{/* left div content */} {/* left div content */}
<div <div
className={`group flex-1 flex flex-col mt-2 bg-white hover:bg-blue-600 border border-blue-600 rounded-md cursor-pointer transition duration-200 ease-in-out className={`group flex-1 flex flex-col mt-2 bg-white hover:bg-primary border border-primary rounded cursor-pointer transition duration-200 ease-in-out
${selectedLesson === lesson ? "bg-blue-600" : ""}`} ${selectedLesson === lesson ? "bg-primary" : ""}`}
// onClick={() => setSelectedLesson(lesson)} // onClick={() => setSelectedLesson(lesson)}
onClick={() => onClick={() =>
setSelectedLesson(selectedLesson === lesson ? null : lesson) setSelectedLesson(selectedLesson === lesson ? null : lesson)
@ -60,13 +60,13 @@ const CourseChapter = ({ courseTitle, lessonName, grade, chapters }) => {
<div className="flex flex-row items-center justify-between p-2"> <div className="flex flex-row items-center justify-between p-2">
<p <p
className={`text-sm text-blue-500 group-hover:text-white className={`text-sm text-blue-500 group-hover:text-white
${selectedLesson === lesson ? "text-red-600" : ""}`} ${selectedLesson === lesson ? "primaryText" : ""}`}
> >
{lesson.title} {lesson.title}
</p> </p>
<span <span
className={`text-xs text-blue-500 group-hover:text-white border-r border-blue-200 pr-1 className={`text-xs text-blue-500 group-hover:text-white border-r border-blue-200 pr-1
${selectedLesson === lesson ? "text-red-600" : ""}`} ${selectedLesson === lesson ? "primaryText" : ""}`}
> >
{lesson.duration} {lesson.duration}
</span> </span>
@ -74,13 +74,13 @@ const CourseChapter = ({ courseTitle, lessonName, grade, chapters }) => {
{/* divider */} {/* divider */}
<div <div
className={`border-t border-blue-600 group-hover:border-white ${ className={`border-t border-blue-600 group-hover:border-white ${
selectedLesson === lesson ? "border-red-600" : "" selectedLesson === lesson ? "primaryText" : ""
}`} }`}
></div> ></div>
{/* bottom */} {/* bottom */}
<span <span
className={`text-xs text-center text-blue-500 group-hover:text-white p-2 className={`text-xs text-center text-blue-500 group-hover:text-white p-2
${selectedLesson === lesson ? "text-red-600" : ""}`} ${selectedLesson === lesson ? "primaryText" : ""}`}
> >
{lesson.play} {lesson.play}
</span> </span>

5
src/components/CurrentDateTime/CurrentDateShamsi/index.js
Unescape View File

@ -15,8 +15,8 @@ const CurrentDateShamsi = ({ color, fontSize }) => {
const weekday = date.toLocaleDateString("fa-IR", option2); const weekday = date.toLocaleDateString("fa-IR", option2);
return ( return (
<p className={`${color} ${fontSize}`}> <p className={`text-primaryDark ${fontSize}`}>
<span className="text-[#0F0543]">{weekday}</span> {todayDate} <span className="text-primaryText">{weekday}</span> {todayDate}
</p> </p>
); );
}; };
@ -24,6 +24,5 @@ const CurrentDateShamsi = ({ color, fontSize }) => {
export default CurrentDateShamsi; export default CurrentDateShamsi;
CurrentDateShamsi.defaultProps = { CurrentDateShamsi.defaultProps = {
color: "text-red-600",
fontSize: "text-lg", fontSize: "text-lg",
}; };

5
src/components/CurrentDateTime/CurrentTime/index.js
Unescape View File

@ -1,18 +1,17 @@
import React from "react"; import React from "react";
const CurrentTime = ({ color, fontSize }) => { const CurrentTime = ({ fontSize }) => {
const today = new Date(), const today = new Date(),
time = time =
today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds(); today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
{ {
console.log(time); console.log(time);
} }
return <p className={`${color} ${fontSize}`}>{time}</p>; return <p className={`text-primaryText ${fontSize}`}>{time}</p>;
}; };
export default CurrentTime; export default CurrentTime;
CurrentTime.defaultProps = { CurrentTime.defaultProps = {
color: "text-red-600",
fontSize: "text-lg", fontSize: "text-lg",
}; };

2
src/components/CurrentDateTime/index.js
Unescape View File

@ -15,7 +15,7 @@ function CurrentDateTime() {
return ( return (
<div className="w-full flex flex-col items-center"> <div className="w-full flex flex-col items-center">
<select <select
className="w-20 bg-gray-200 mb-10" className="w-20 m-10 bg-surface border border-surfaceBorder"
onChange={(e) => setType(e.target.value)} onChange={(e) => setType(e.target.value)}
> >
{Object.keys(list).map((option, index) => ( {Object.keys(list).map((option, index) => (

10
src/components/DivideX/DistributedData/index.js
Unescape View File

@ -2,25 +2,25 @@ import React from "react";
const DistributedData = ({ items }) => { const DistributedData = ({ items }) => {
return ( return (
<div className="w-[750px] flex flex-col items-center gap-y-4 mx-auto bg-white shadow-sm rounded-lg pt-3"> <div className="w-[750px] flex flex-col items-center gap-y-4 mx-auto bg-surface border border-surfaceBorder shadow-sm rounded pt-3">
{items.map((row, index) => ( {items.map((row, index) => (
<div <div
className={`flex flex-row items-center justify-around w-full border-[#9DACD344] pb-3 ${ className={`flex flex-row items-center justify-around w-full border-surfaceBorder pb-3 ${
index + 1 < items.length ? "border-b" : "" index + 1 < items.length ? "border-b" : ""
}`} }`}
key={index} key={index}
> >
{row.map((item, index) => ( {row.map((item, index) => (
<div <div
className={`flex items-center font-sansbold text-xs border-[#9DACD344] flex-1 justify-around ${ className={`flex items-center font-bold text-xs border-surfaceBorder flex-1 justify-around ${
index + 1 < row.length ? "border-l" : "" index + 1 < row.length ? "border-l" : ""
} ${item?.className || ""}`} } ${item?.className || ""}`}
> >
{item.name && <p className="text-[#0F0543]">{item.name}</p>} {item.name && <p className="text-primary">{item.name}</p>}
{item.number && ( {item.number && (
<span <span
className={` ${ className={` ${
item.remaining ? "text-[#E16524]" : "text-[#2483E1]" item.remaining ? "text-[#E16524]" : "text-primaryText"
}`} }`}
> >
{item.number} {item.number}

6
src/components/DivideX/ReligiousTimes/index.js
Unescape View File

@ -5,14 +5,14 @@ const ReligiousTimes = ({ hours }) => {
<div className="w-[550px] flex flex-row items-center justify-around bg-white shadow-sm rounded-lg py-3.5 px-0.5 mt-10 mr-10"> <div className="w-[550px] flex flex-row items-center justify-around bg-white shadow-sm rounded-lg py-3.5 px-0.5 mt-10 mr-10">
{hours.map((hour, index) => ( {hours.map((hour, index) => (
<div className="flex flex-row items-center" key={index}> <div className="flex flex-row items-center" key={index}>
<span className="text-xs text-[#0F0543] font-sansbold"> <span className="text-xs text-primaryText font-bold">
{hour.partOfDay} {hour.partOfDay}
</span> </span>
<span className="text-xs text-[#2483E1] font-sansbold mr-1"> <span className="text-xs text-primary font-bold mr-1">
{hour.time} {hour.time}
</span> </span>
{Number(index) !== hours.length - 1 && ( {Number(index) !== hours.length - 1 && (
<div className="h-[20px] w-0.5 bg-[#9DACD344] mx-2"></div> <div className="h-[20px] w-0.5 bg-surfaceBorder mx-2"></div>
)} )}
</div> </div>
))} ))}

12
src/components/Features/index.js
Unescape View File

@ -3,8 +3,8 @@ import Button from "../ButtonDesign/Button";
const Features = ({ featureTitle, features }) => { const Features = ({ featureTitle, features }) => {
return ( return (
<section className="bg-white border-2 border-gray-400 rounded"> <section className="bg-surface border border-surfaceBorder rounded">
<h2 className="mr-7 my-5 text-lg font-sansbold text-[#246E8A]"> <h2 className="mr-7 my-5 text-lg font-bold text-secondary">
{featureTitle} {featureTitle}
</h2> </h2>
<div className="w-full flex flex-wrap justify-around items-center"> <div className="w-full flex flex-wrap justify-around items-center">
@ -22,7 +22,7 @@ const Features = ({ featureTitle, features }) => {
<div className="flex items-center"> <div className="flex items-center">
<strong className="text-base">{feature.title}</strong> <strong className="text-base">{feature.title}</strong>
{feature.status && ( {feature.status && (
<span className="mr-4 text-xs px-2 py-1 rounded-lg bg-blue-100"> <span className="mr-4 text-xs px-2 py-1 rounded bg-primary">
{feature.status} {feature.status}
</span> </span>
)} )}
@ -35,7 +35,7 @@ const Features = ({ featureTitle, features }) => {
))} ))}
</div> </div>
{/* footer */} {/* footer */}
<div className="flex flex-col sm:flex-row items-center justify-between py-10 px-7 bg-blue-100 "> <div className="flex flex-col sm:flex-row items-center justify-between py-10 px-7 bg-primary ">
<div> <div>
<h2 className="text-base">هزاران درصد تحفیف</h2> <h2 className="text-base">هزاران درصد تحفیف</h2>
<p className="mt-4 text-sm"> <p className="mt-4 text-sm">
@ -46,8 +46,8 @@ const Features = ({ featureTitle, features }) => {
<Button <Button
text={"مشاهده امکانات"} text={"مشاهده امکانات"}
className="mt-5 sm:mt-0 px-7 py-3 bg-white className="mt-5 sm:mt-0 px-7 py-3 bg-white
hover:bg-blue-600 text-sm sm:text-base text-blue-600 hover:text-white rounded-md border-2 hover:bg-primaryDark text-sm sm:text-base text-primaryDark hover:text-white rounded border-2
border-blue-600 cursor-pointer border-primaryDark cursor-pointer
" "
/> />
</div> </div>

Write Preview
Loading…
Cancel
Save