Files
iiEasy/components/TermsOfUseSection.tsx

55 lines
1.9 KiB
TypeScript
Executable File

import React from 'react';
import { CurrentView } from '../types';
import { SECTION_IDS, TERMS_OF_USE_CONTENT } from '../constants';
import Button from './Button';
import { ArrowUturnLeftIcon } from './icons';
interface TermsOfUseSectionProps {
setCurrentView: (view: CurrentView) => void;
}
const TermsOfUseSection: React.FC<TermsOfUseSectionProps> = ({ setCurrentView }) => {
const handleBackClick = () => {
setCurrentView('main');
// Optional: Scroll to top or specific section if needed
window.scrollTo({ top: 0, behavior: 'smooth' });
};
return (
<section
id={SECTION_IDS.termsOfUsePage}
className="py-16 md:py-24 bg-white min-h-screen"
>
<div className="container mx-auto px-4 sm:px-6 lg:px-8">
<header className="mb-8 md:mb-12">
<Button
variant="outline"
size="sm"
onClick={handleBackClick}
className="mb-6"
leftIcon={<ArrowUturnLeftIcon />}
>
{TERMS_OF_USE_CONTENT.backButtonText}
</Button>
<h1 className="font-quicksand text-3xl sm:text-4xl md:text-5xl font-bold text-slate-900">
{TERMS_OF_USE_CONTENT.title}
</h1>
<p className="mt-3 text-sm text-slate-500 font-inter">
{TERMS_OF_USE_CONTENT.lastUpdated}
</p>
</header>
<article className="prose prose-lg max-w-none font-inter text-slate-700">
{TERMS_OF_USE_CONTENT.sections.map((section, index) => (
<div key={index} className="mb-6">
{section.heading && <h2 className="font-quicksand text-2xl font-semibold mt-0 mb-3 text-slate-700">{section.heading}</h2>}
{typeof section.content === 'string' ? <p>{section.content}</p> : section.content}
</div>
))}
</article>
</div>
</section>
);
};
export default TermsOfUseSection;