You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
84 lines
3.3 KiB
84 lines
3.3 KiB
3 years ago
|
import React, { Component, Fragment } from "react";
|
||
|
|
import Navbar from "../Home/Navbar/index";
|
||
|
|
import Footer from "../Home/Footer/index";
|
||
|
|
|
||
|
|
import pic from "../../assets/images/pic.png";
|
||
|
|
|
||
|
|
import "./index.scss";
|
||
|
|
export default class About extends Component {
|
||
|
|
state = {
|
||
|
|
fury: {
|
||
|
|
title: "ماموریت ما در دانوین",
|
||
|
|
text: "لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت",
|
||
|
|
},
|
||
|
|
|
||
|
|
keywords: {
|
||
|
|
title: "کلمات کلیدی ماموریت",
|
||
|
|
list: [
|
||
|
|
"کیفیت آموزش",
|
||
|
|
"جذابیت",
|
||
|
|
"سازگار با نظام آموزش و پرورش",
|
||
|
|
"در راستای نیل به سند تحول",
|
||
|
|
],
|
||
|
|
},
|
||
|
|
advantages: {
|
||
|
|
title: "مزیت رقابت اصلی",
|
||
|
|
list: [
|
||
|
|
"بکارگیری بروزترین تکنولوژی های تولید و مدیریت محتوای آموزشی-تربیتی (مانند واقعیت افزوده)",
|
||
|
|
"دارای رویکرد آموزش سرگرم کننده",
|
||
|
|
"بستر تعاملی و اشتراک گذاری فیلم و محتوای آموزشی",
|
||
|
|
"رویکرد معرفتی - ارزشی",
|
||
|
|
"ویدیوهای منحصر بفرد",
|
||
|
|
"متن گفتگو محور - روایی- قابل فهم - جذاب و سرگرم کننده",
|
||
|
|
],
|
||
|
|
},
|
||
|
|
};
|
||
|
|
render() {
|
||
|
|
const { fury, advantages, keywords } = this.state;
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
<div className="about d-flex flex-column align-items-center">
|
||
|
|
<Navbar />
|
||
|
|
<div className="about__fury d-flex">
|
||
|
|
<div className="about__fury--right d-flex flex-column justify-content-center">
|
||
|
|
<div className="right-top align-self-start">
|
||
|
|
<h1>{fury.title}</h1>
|
||
|
|
<p>{fury.text}</p>
|
||
|
|
</div>
|
||
|
|
<div className="right-bottom align-self-end">
|
||
|
|
<h1>{keywords.title}</h1>
|
||
|
|
<ul>
|
||
|
|
{keywords.list.map((item, i) => (
|
||
|
|
<Fragment key={i}>
|
||
|
|
<li>{item}</li><br/>
|
||
|
|
</Fragment>
|
||
|
|
|
||
|
|
))}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div className="about__fury--left d-flex align-items-center"></div>
|
||
|
|
</div>
|
||
|
|
<div className="about__advantages d-flex">
|
||
|
|
<div className="about__advantages--right d-flex">
|
||
|
|
<img src={pic} alt={'عکس'} />
|
||
|
|
</div>
|
||
|
|
<div className="about__advantages--left">
|
||
|
|
<h1>{advantages.title}</h1>
|
||
|
|
<ul>
|
||
|
|
{advantages.list.map((item, i) => (
|
||
|
|
<Fragment key={i}>
|
||
|
|
<li>{item}</li><br/>
|
||
|
|
</Fragment>
|
||
|
|
|
||
|
|
))}
|
||
|
|
</ul>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<Footer />
|
||
|
|
</>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
}
|