Initial commit for iiEasy: all files included

components/AcceleratorAboutSection.tsx

@@ -0,0 +1,114 @@
+import React from 'react';
+import { SECTION_IDS, mockAcceleratorFeatures, ACCELERATOR_ABOUT_CONTENT } from '../constants'; // Import constants
+import { AcceleratorFeature } from '../types'; // Import AcceleratorFeature type
+import BoldIdeasCarousel from './BoldIdeasCarousel'; // Import the new component
+// Icons for contact methods are now part of ACCELERATOR_ABOUT_CONTENT.contactMethods
+
+interface FeatureCardProps {
+  icon: React.ElementType;
+  title: string;
+  description: string;
+}
+
+const FeatureCard: React.FC<FeatureCardProps> = ({ icon: Icon, title, description }) => (
+  <div className="bg-white p-6 rounded-xl">
+    <div className="flex items-center text-slate-700 mb-4">
+      <Icon className="w-8 h-8 mr-3" />
+      <h3 className="font-quicksand text-xl font-semibold text-slate-800">{title}</h3>
+    </div>
+    <p className="font-inter text-slate-600 leading-relaxed">
+      {description}
+    </p>
+  </div>
+);
+
+const BOLD_IDEAS_1 = [
+  "Создать ИИ-систему для мониторинга экологии Башкортостана",
+  "Разработать приложение для изучения башкирского языка с ИИ-помощником",
+  "Автоматизировать документооборот в государственных учреждениях",
+  "Платформа для предиктивной аналитики в сельском хозяйстве региона",
+];
+
+const BOLD_IDEAS_2 = [
+  "ИИ-ассистент для туристов, путешествующих по Уфе и окрестностям",
+  "Система компьютерного зрения для контроля качества на производстве",
+  "Адаптивная образовательная платформа для школьников",
+  "Разработать ИИ для оптимизации городской логистики в Уфе"
+];
+
+
+const AcceleratorAboutSection: React.FC = () => {
+  return (
+    <section 
+      id={SECTION_IDS.acceleratorAboutPage} 
+      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-12 md:mb-16">
+          <h1 className="font-quicksand text-4xl sm:text-5xl md:text-6xl font-bold text-slate-900">
+            {ACCELERATOR_ABOUT_CONTENT.title}
+          </h1>
+          <p className="mt-4 text-lg md:text-xl text-slate-700 max-w-3xl">
+            {ACCELERATOR_ABOUT_CONTENT.subtitle}
+          </p>
+        </header>
+        
+        <div className="prose prose-lg max-w-none font-inter text-slate-700 mb-12">
+          <h2 className="font-quicksand text-2xl sm:text-3xl font-semibold mt-0 mb-4 text-slate-800">{ACCELERATOR_ABOUT_CONTENT.whatWeOfferTitle}</h2>
+          <p>
+            {ACCELERATOR_ABOUT_CONTENT.whatWeOfferParagraph}
+          </p>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16">
+          {mockAcceleratorFeatures.map((feature: AcceleratorFeature) => (
+            <FeatureCard 
+              key={feature.title} 
+              icon={feature.icon} 
+              title={feature.title} 
+              description={feature.description} 
+            />
+          ))}
+        </div>
+
+        {/* New "Bold Ideas" Section */}
+        <div className="my-16 md:my-20">
+          <h2 className="text-center font-quicksand text-3xl sm:text-4xl font-semibold text-slate-700 mb-10">
+            У вас есть смелые идеи?
+          </h2>
+          <div className="space-y-3">
+            <BoldIdeasCarousel ideas={BOLD_IDEAS_1} direction="reverse" duration="80s" />
+            <BoldIdeasCarousel ideas={BOLD_IDEAS_2} direction="normal" duration="90s" />
+          </div>
+        </div>
+
+        <div className="text-center bg-white p-8 md:p-12 rounded-xl">
+            <h2 className="text-3xl font-quicksand font-semibold text-slate-800 mb-6">
+                {ACCELERATOR_ABOUT_CONTENT.ctaTitle}
+            </h2>
+            <p className="font-inter text-lg text-slate-600 mb-8 max-w-xl mx-auto">
+                {ACCELERATOR_ABOUT_CONTENT.ctaSubtitle}
+            </p>
+            <div className="flex flex-col sm:flex-row flex-wrap justify-center items-center gap-4 sm:gap-6">
+              {ACCELERATOR_ABOUT_CONTENT.contactMethods.map((method) => (
+                <a 
+                  key={method.id}
+                  href={method.href}
+                  target="_blank" 
+                  rel="noopener noreferrer"
+                  className={`group inline-flex items-center justify-center px-6 py-3 text-base font-medium text-slate-800 ${method.bgColor} ${method.hoverBgColor} rounded-full focus:outline-none focus:ring-2 ${method.ringColor} focus:ring-offset-2 transition-all duration-150 ease-in-out font-quicksand w-full sm:w-auto sm:min-w-[180px]`}
+                  aria-label={method.ariaLabel}
+                >
+                  <method.icon className="w-5 h-5" />
+                  <span className="ml-2.5">{method.name}</span>
+                </a>
+              ))}
+            </div>
+        </div>
+
+      </div>
+    </section>
+  );
+};
+
+export default AcceleratorAboutSection;