add: added animations for the buttonsand text

This commit is contained in:
khadiatullo 2025-04-26 21:04:46 +03:00
parent 68a8d3e228
commit e587c1690d
3 changed files with 8 additions and 6 deletions

View File

@ -16,7 +16,7 @@ export const CtaSection = () => {
<p className='mb-8 max-w-2xl'>{t('home.cta.description')}</p> <p className='mb-8 max-w-2xl'>{t('home.cta.description')}</p>
<div className='flex flex-col gap-4 sm:flex-row'> <div className='flex flex-col gap-4 sm:flex-row'>
<Button variant='outline'>{t('common.buttons.downloadApp')}</Button> <Button variant='outline'>{t('common.buttons.downloadApp')}</Button>
<Button className='bg-white text-red-600 hover:bg-gray-100'> <Button variant='secondary'>
{t('common.buttons.getLoyaltyCard')} {t('common.buttons.getLoyaltyCard')}
</Button> </Button>
</div> </div>

View File

@ -134,7 +134,7 @@ export const Footer = () => {
placeholder={t('common.footer.yourEmail')} placeholder={t('common.footer.yourEmail')}
className='w-full rounded-md border border-gray-700 bg-gray-800 px-4 py-2 text-white' className='w-full rounded-md border border-gray-700 bg-gray-800 px-4 py-2 text-white'
/> />
<Button className='w-full bg-red-600 hover:bg-red-700'> <Button className='w-full bg-red-600 hover:bg-red-700 heartbeat'>
Подписаться Подписаться
</Button> </Button>
</form> </form>

View File

@ -24,9 +24,11 @@ export const HeroSection = () => {
<div className='absolute inset-0 flex items-center bg-gradient-to-r from-black/70 to-black/30'> <div className='absolute inset-0 flex items-center bg-gradient-to-r from-black/70 to-black/30'>
<div className='container mx-auto'> <div className='container mx-auto'>
<div className='max-w-lg space-y-4 text-white'> <div className='max-w-lg space-y-4 text-white'>
<div className='tracking-in-expand'>
<h1 className='text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl'> <h1 className='text-4xl font-bold tracking-tight sm:text-5xl md:text-6xl'>
Сеть современных заправок в Таджикистане Сеть современных заправок в Таджикистане
</h1> </h1>
</div>
<p className='text-lg text-gray-200'> <p className='text-lg text-gray-200'>
{t('home.hero.description')} {t('home.hero.description')}
</p> </p>
@ -35,7 +37,7 @@ export const HeroSection = () => {
{t('common.buttons.findStation')}{' '} {t('common.buttons.findStation')}{' '}
<MapPin className='ml-2 h-4 w-4' /> <MapPin className='ml-2 h-4 w-4' />
</Button> </Button>
<Button variant='outline' <Button variant='outline' className='animate-pulse'
> >
Узнать больше Узнать больше
</Button> </Button>