60 lines
2.4 KiB
TypeScript
60 lines
2.4 KiB
TypeScript
import './demos.css'
|
|
import "../../styles/styles.css";
|
|
import building1 from './building1.png'
|
|
import building2 from './building2.png'
|
|
|
|
|
|
import iconButton from "./iconButton.svg"
|
|
|
|
|
|
export const Demos: React.FC<any> = ({ text }) => {
|
|
const { card, card1 } = text;
|
|
console.log(text)
|
|
|
|
return (<div className=" demo__container_mobile main-block__container width demo__container">
|
|
<h3 className='demos__tittle'>
|
|
{text.title}
|
|
</h3>
|
|
<a href='https://stream.graff.tech/' target='_blank' rel="noreferrer" data-aos="fade-up"
|
|
data-aos-delay="100" className='demos_container'>
|
|
<div className="main-block__icon_container demo__icon">
|
|
<img alt='icon' src={iconButton} className="main-block__icon"></img>
|
|
</div>
|
|
<div className='demo'>
|
|
<img alt='buildingImg' src={building1} className='demo_image'></img>
|
|
<div className='demo_info'>
|
|
<div className='title__block'>
|
|
<h4 className='title__demo'>{card.title}</h4>
|
|
<p className='caption'>{card.subTitle}</p>
|
|
</div>
|
|
<div className='body__block'>
|
|
<p className='caption1'>{card.caption}</p>
|
|
<p className='caption2'>{card.caption1}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
<a href='https://stream.graff.tech/' target='_blank' rel="noreferrer" data-aos="fade-up"
|
|
data-aos-delay="150" className='demos_container'>
|
|
<div className="main-block__icon_container demo__icon">
|
|
<img alt='icon' src={iconButton} className="main-block__icon"></img>
|
|
</div>
|
|
<div className='demo'>
|
|
<img alt='buildingImg' src={building2} className='demo_image'></img>
|
|
<div className='demo_info'>
|
|
<div className='title__block'>
|
|
<h4 className='title__demo'>{card1.title}</h4>
|
|
<p className='caption'>{card1.subTitle}</p>
|
|
</div>
|
|
<div className='body__block'>
|
|
<p className='caption1'>{card1.caption}</p>
|
|
<p className='caption2'>{card1.caption1}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
)
|
|
|
|
} |