import { FC } from 'react'
import { SIDEBAR_SIZE_LEFT } from '../../../config/Const'
import { useTranslation } from 'react-i18next'
import { ArrowLeft } from 'iconsax-react'
import CoverImage from '../../../assets/images/banner.png'

const DanakLearning: FC = () => {

    const { t } = useTranslation('global')

    return (
        <div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white text-xs hidden 2xl:block h-fit px-5 py-7 rounded-3xl'>
            <div className='flex justify-between items-center'>
                <div>
                    {t('home.danak_learning')}
                </div>
                <div className='flex gap-2 items-center text-[10px]'>
                    <div>{t('home.see_all')}</div>
                    <ArrowLeft size={12} color='black' />
                </div>
            </div>

            <div className='mt-7'>
                <div className='flex gap-3'>
                    <div>
                        <img src={CoverImage} alt='danak-learning-1' className='w-36 h-24 object-cover rounded-2xl' />
                    </div>

                    <div className='text-xs'>
                        <div>
                            لورم ایپسوم متن ساختگی با تولید سادگی
                        </div>
                        <div className='flex gap-1 mt-2'>
                            <div>دیزاین ,</div>
                            <div>۲۴ دقیقه</div>
                        </div>
                        <div>
                            آذر ماه 1403
                        </div>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default DanakLearning