104 lines
3.7 KiB
TypeScript
104 lines
3.7 KiB
TypeScript
|
|
import {FC} from 'react'
|
|
import {KTIcon, toAbsoluteUrl} from '../../../helpers'
|
|
|
|
const Item1: FC = () => {
|
|
return (
|
|
<div className='timeline-item'>
|
|
<div className='timeline-line w-40px'></div>
|
|
|
|
<div className='timeline-icon symbol symbol-circle symbol-40px me-4'>
|
|
<div className='symbol-label bg-light'>
|
|
<KTIcon iconName='message-text-2' className='fs-2 text-gray-500' />
|
|
</div>
|
|
</div>
|
|
|
|
<div className='timeline-content mb-10 mt-n1'>
|
|
<div className='pe-3 mb-5'>
|
|
<div className='fs-5 fw-bold mb-2'>
|
|
There are 2 new tasks for you in “AirPlus Mobile APp” project:
|
|
</div>
|
|
|
|
<div className='d-flex align-items-center mt-1 fs-6'>
|
|
<div className='text-muted me-2 fs-7'>Added at 4:23 PM by</div>
|
|
|
|
<div
|
|
className='symbol symbol-circle symbol-25px'
|
|
data-bs-toggle='tooltip'
|
|
data-bs-boundary='window'
|
|
data-bs-placement='top'
|
|
title='Nina Nilson'
|
|
>
|
|
<img src={toAbsoluteUrl('media/avatars/300-14.jpg')} alt='img' />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className='overflow-auto pb-5'>
|
|
<div className='d-flex align-items-center border border-dashed border-gray-300 rounded min-w-750px px-7 py-3 mb-5'>
|
|
<a href='#' className='fs-5 text-gray-900 text-hover-primary fw-bold w-375px min-w-200px'>
|
|
Meeting with customer
|
|
</a>
|
|
|
|
<div className='min-w-175px pe-2'>
|
|
<span className='badge badge-light text-muted'>Application Design</span>
|
|
</div>
|
|
|
|
<div className='symbol-group symbol-hover flex-nowrap flex-grow-1 min-w-100px pe-2'>
|
|
<div className='symbol symbol-circle symbol-25px'>
|
|
<img src={toAbsoluteUrl('media/avatars/300-2.jpg')} alt='img' />
|
|
</div>
|
|
|
|
<div className='symbol symbol-circle symbol-25px'>
|
|
<img src={toAbsoluteUrl('media/avatars/300-14.jpg')} alt='img' />
|
|
</div>
|
|
|
|
<div className='symbol symbol-circle symbol-25px'>
|
|
<div className='symbol-label fs-8 fw-bold bg-primary text-inverse-primary'>A</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className='min-w-125px pe-2'>
|
|
<span className='badge badge-light-primary'>In Progress</span>
|
|
</div>
|
|
|
|
<a href='#' className='btn btn-sm btn-light btn-active-light-primary'>
|
|
View
|
|
</a>
|
|
</div>
|
|
|
|
<div className='d-flex align-items-center border border-dashed border-gray-300 rounded min-w-750px px-7 py-3 mb-0'>
|
|
<a href='#' className='fs-5 text-gray-900 text-hover-primary fw-bold w-375px min-w-200px'>
|
|
Project Delivery Preparation
|
|
</a>
|
|
|
|
<div className='min-w-175px'>
|
|
<span className='badge badge-light text-muted'>CRM System Development</span>
|
|
</div>
|
|
|
|
<div className='symbol-group symbol-hover flex-nowrap flex-grow-1 min-w-100px'>
|
|
<div className='symbol symbol-circle symbol-25px'>
|
|
<img src={toAbsoluteUrl('media/avatars/300-20.jpg')} alt='img' />
|
|
</div>
|
|
|
|
<div className='symbol symbol-circle symbol-25px'>
|
|
<div className='symbol-label fs-8 fw-bold bg-success text-inverse-primary'>B</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className='min-w-125px'>
|
|
<span className='badge badge-light-success'>Completed</span>
|
|
</div>
|
|
|
|
<a href='#' className='btn btn-sm btn-light btn-active-light-primary'>
|
|
View
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export {Item1}
|