import React from 'react';
import { useTranslation } from 'react-i18next';
import LanguageSwitcher from './components/LanguageSwitcher';
import SiteFooter from './components/SiteFooter';

function About() {
  const { t } = useTranslation();

  return (
    <div className="registration-container">
      <header className="registration-header">
        <div className="container">
          <div className="header-content">
            <div className="logo">
              <h2>{t('home.title')}</h2>
            </div>
            <div className="header-actions">
              <LanguageSwitcher />
              <a href="/" className="btn-secondary">{t('common.backToHome')}</a>
            </div>
          </div>
        </div>
      </header>

      <main className="registration-main">
        <div className="container">
          <div className="registration-card">
            <h1>{t('navigation.about')}</h1>
            <p>Learn more about our project.</p>
          </div>
        </div>
      </main>

      <SiteFooter />
    </div>
  );
}

    export default About;