Copilot Alınacak
This commit is contained in:
Şahan Hasret
145
app/sss/page.tsx
Normal file
145
app/sss/page.tsx
Normal file
@@ -0,0 +1,145 @@
|
||||
'use client';
|
||||
|
||||
import { useState } from 'react';
|
||||
import Header from "@/components/Header";
|
||||
import Footer from "@/components/Footer";
|
||||
|
||||
export default function FAQ() {
|
||||
const [openFAQ, setOpenFAQ] = useState<number | null>(null);
|
||||
|
||||
const faqs = [
|
||||
{
|
||||
id: 1,
|
||||
question: 'A2 Metro Hattı projesi ne zaman tamamlanacak?',
|
||||
answer: 'A2 Metro Hattı projesinin 2026 yılı sonunda tamamlanması planlanmaktadır. Proje, Dikimevi-Natoyolu güzergâhında 6.5 kilometre uzunluğunda ve 5 istasyonlu bir metro hattı inşasını kapsamaktadır.'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
question: 'Metro hattı hangi istasyonları kapsayacak?',
|
||||
answer: 'A2 Metro Hattı aşağıdaki istasyonları içerecektir: Dikimevi İstasyonu, Tuzluçayır İstasyonu, Natoyolu İstasyonu ve diğer ara istasyonlar. Toplam 5 istasyon bulunacaktır.'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
question: 'İnşaat çalışmaları sırasında trafik nasıl etkilenecek?',
|
||||
answer: 'İnşaat çalışmaları sırasında geçici trafik düzenlemeleri uygulanacaktır. Alternatif güzergâhlar belirlenecek ve yönlendirme levhaları yerleştirilecektir. Vatandaşlarımızın anlayışına sığınıyoruz.'
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
question: 'Proje maliyeti ne kadar?',
|
||||
answer: 'A2 Metro Hattı projesinin toplam maliyeti yaklaşık 2.5 milyar TL olarak belirlenmiştir. Bu maliyet, tünel kazısı, istasyon inşaatı, ray döşeme ve elektrik-elektronik sistemleri kapsamaktadır.'
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
question: 'Çevreye etkisi ne olacak?',
|
||||
answer: 'Proje, çevre dostu teknolojiler kullanılarak gerçekleştirilmektedir. Çevresel Etki Değerlendirme (ÇED) raporu hazırlanmış ve gerekli izinler alınmıştır. İnşaat sırasında toz kontrolü ve gürültü önleme tedbirleri uygulanacaktır.'
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
question: 'İstasyonlar hangi özelliklere sahip olacak?',
|
||||
answer: 'İstasyonlar modern mimari tasarımla, enerji verimliliği, erişilebilirlik ve güvenlik ön planda tutularak inşa edilecektir. Güneş enerjisi panelleri, LED aydınlatma ve akıllı havalandırma sistemleri kullanılacaktır.'
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
question: 'İnşaatta hangi teknolojiler kullanılacak?',
|
||||
answer: 'Proje kapsamında TBM (Tunnel Boring Machine) tünel açma makinesi kullanılacaktır. Bu teknoloji sayesinde kazı çalışmaları daha hızlı ve güvenli şekilde gerçekleştirilecektir.'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
question: 'Proje ilerleme durumu nasıl takip edilebilir?',
|
||||
answer: 'Bu web sitesi üzerinden canlı yayın, haberler ve medya galerisi bölümlerinden proje ilerleme durumunu takip edebilirsiniz. Ayrıca aylık ilerleme raporları yayınlanmaktadır.'
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
question: 'İş güvenliği nasıl sağlanacak?',
|
||||
answer: 'İnşaat alanında uluslararası standartlarda iş güvenliği tedbirleri uygulanmaktadır. Düzenli güvenlik eğitimleri verilir ve acil durum prosedürleri hazırlanmıştır.'
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
question: 'Vatandaşlar proje hakkında nasıl bilgi alabilir?',
|
||||
answer: 'Bu web sitesi, sosyal medya hesapları ve tanıtım etkinlikleri aracılığıyla proje hakkında detaylı bilgi alınabilir. Ayrıca iletişim bölümünden sorularınızı iletebilirsiniz.'
|
||||
}
|
||||
];
|
||||
|
||||
const toggleFAQ = (id: number) => {
|
||||
setOpenFAQ(openFAQ === id ? null : id);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="min-h-screen bg-[#003366]">
|
||||
<Header />
|
||||
|
||||
<main className="pt-32 pb-16">
|
||||
<div className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
{/* Başlık */}
|
||||
<div className="text-center mb-12">
|
||||
<h1 className="text-4xl font-bold text-white mb-4">
|
||||
Sıkça Sorulan Sorular
|
||||
</h1>
|
||||
<p className="text-lg text-[#F8F9FA] max-w-2xl mx-auto">
|
||||
A2 Metro Hattı projesi hakkında merak ettiğiniz soruların cevapları
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{/* SSS Listesi */}
|
||||
<div className="space-y-4">
|
||||
{faqs.map((faq) => (
|
||||
<div
|
||||
key={faq.id}
|
||||
className="bg-white rounded-xl shadow-lg overflow-hidden"
|
||||
>
|
||||
<button
|
||||
onClick={() => toggleFAQ(faq.id)}
|
||||
className="w-full px-6 py-4 text-left flex items-center justify-between hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<h3 className="text-lg font-semibold text-[#004B87] pr-4">
|
||||
{faq.question}
|
||||
</h3>
|
||||
<svg
|
||||
className={`w-6 h-6 text-[#00B4D8] transform transition-transform duration-200 ${
|
||||
openFAQ === faq.id ? 'rotate-180' : ''
|
||||
}`}
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 9l-7 7-7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
{openFAQ === faq.id && (
|
||||
<div className="px-6 pb-4">
|
||||
<div className="border-t border-gray-200 pt-4">
|
||||
<p className="text-gray-700 leading-relaxed">
|
||||
{faq.answer}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* İletişim CTA */}
|
||||
<div className="mt-12 text-center">
|
||||
<div className="bg-white/10 backdrop-blur-sm rounded-2xl p-8 border border-white/20">
|
||||
<h3 className="text-xl font-bold text-white mb-4">
|
||||
Başka Sorunuz Mu Var?
|
||||
</h3>
|
||||
<p className="text-[#F8F9FA] mb-6">
|
||||
Yukarıdaki sorular dışında merak ettiğiniz konular için bizimle iletişime geçebilirsiniz.
|
||||
</p>
|
||||
<a
|
||||
href="/#iletisim"
|
||||
className="inline-block bg-[#00B4D8] text-white px-8 py-3 rounded-lg font-semibold hover:bg-[#0099B8] transition-colors"
|
||||
>
|
||||
İletişime Geç
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<Footer />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user