44 lines
1.5 KiB
TypeScript
Executable File
44 lines
1.5 KiB
TypeScript
Executable File
|
||
import React from 'react';
|
||
import ChatInput from './ChatInput';
|
||
import { CurrentView } from '../types';
|
||
import { ArrowDownTrayIcon } from './icons';
|
||
import { SECTION_IDS } from '../constants';
|
||
|
||
interface HeroSectionProps {
|
||
setCurrentView: (view: CurrentView) => void;
|
||
isChatHidden?: boolean;
|
||
}
|
||
|
||
const HeroSection: React.FC<HeroSectionProps> = ({ setCurrentView, isChatHidden = false }) => {
|
||
return (
|
||
<section
|
||
id="hero"
|
||
className="relative min-h-screen flex items-center justify-center overflow-hidden bg-white p-4"
|
||
>
|
||
<div className="w-full max-w-3xl text-center">
|
||
<h1 className="mb-6 mx-auto text-4xl sm:text-5xl font-semibold leading-tight tracking-tight text-slate-900 font-quicksand">
|
||
Чем мы можем помочь?
|
||
</h1>
|
||
<div className={`transition-opacity duration-300 ${isChatHidden ? 'opacity-0' : 'opacity-100'}`}>
|
||
<ChatInput setCurrentView={setCurrentView} />
|
||
</div>
|
||
</div>
|
||
|
||
<a
|
||
href={`#${SECTION_IDS.story}`}
|
||
onClick={(e) => {
|
||
e.preventDefault();
|
||
document.getElementById(SECTION_IDS.story)?.scrollIntoView({ behavior: 'smooth' });
|
||
}}
|
||
className="absolute bottom-8 left-1/2 -translate-x-1/2 z-10"
|
||
aria-label="Прокрутить вниз"
|
||
>
|
||
<ArrowDownTrayIcon className="h-8 w-8 text-slate-500 animate-bounce hover:text-slate-700 transition-colors" />
|
||
</a>
|
||
</section>
|
||
);
|
||
};
|
||
|
||
export default HeroSection;
|