Spaces:
Running
Running
Ctrl+K
(Multi-Page & Bilingual): Objective: Create a complete, professional, and bilingual (German/English) multi-page website for the cybersecurity architecture "SentinelSecureSuite". The website must be fully navigable with a consistent header and footer across all pages and feature a language switcher. It serves as an interactive architectural blueprint for CISOs, CTOs, and security architects. Global Design System (for all pages): Theme: Dark Mode. Palette: deep blues (#0A192F), dark grays (#112240), light gray text (#CCD6F6). Accent Color: Vibrant electric blue (#64FFDA) for interactive elements. Typography: "Inter" or "Roboto", clean and modern. Imagery: Abstract, high-tech visuals (plexus networks, HUD elements, data streams). Consistent style across all pages. Responsiveness: All pages must be fully responsive for desktop, tablet, and mobile. Global Components (to appear on every page): 1. Main Header / Navigation: A sticky header that stays visible on scroll. Logo: On the left, a stylized text logo: SentinelSecureSuite. Navigation Links (Center): DE: Home | Prinzipien | Plattform | Vision | Kontakt EN: Home | Principles | Platform | Vision | Contact Language Switcher (Right): A clean toggle DE / EN. It must switch the language on the current page instantly. Default language is German. 2. Footer: A simple, three-column footer. Column 1: Logo (SentinelSecureSuite) and copyright (© 2025 | Architektur von T. Baumann / Architecture by T. Baumann). Column 2: Sitemap with links to all pages (Home, Prinzipien/Principles, etc.). Column 3: Placeholder for contact info or a legal notice link (Impressum/Legal). Page-by-Page Breakdown: PAGE 1: Home (/) Purpose: A powerful landing page that summarizes the project's essence and directs users to the detailed subpages. Content: Full-Screen Hero Section: H1: SentinelSecureSuite Sub-Headline (DE/EN): "Ein autonomes, konvergentes und resilientes Sicherheits-Ökosystem für die Industrie 4.0." / "An Autonomous, Converged, and Resilient Security Ecosystem for Industry 4.0." Architect Credit (DE/EN): "Finaler Architektur-Entwurf von T. Baumann..." / "Final Architectural Blueprint by T. Baumann..." Introduction to Principles (Teaser Section): H2 (DE/EN): Unsere Leitprinzipien / Our Core Principles Layout: A simple grid showing the icons and titles of the 7 principles (Integration, Autonomie, etc.). CTA Button (DE/EN): Erfahren Sie mehr über die Architektur / Learn More About the Architecture. This button links to the /principles page. Introduction to the Platform (Teaser Section): H2 (DE/EN): Die integrierte Plattform / The Integrated Platform Text (DE/EN): A short paragraph summarizing that SentinelSecureSuite is a holistic ecosystem of interconnected modules. CTA Button (DE/EN): Entdecken Sie die Module / Explore the Modules. This button links to the /platform page. PAGE 2: Architectural Principles (/principles) Purpose: To provide a detailed, focused explanation of the 7 foundational principles. Content: Page Header: H1 (DE/EN): Die 7 Architektonischen Leitprinzipien / The 7 Core Architectural Principles. Intro Text (DE/EN): A sentence explaining that these principles are the foundation of the entire system's resilience and intelligence. Principles List: Layout: Use a spacious list or two-column layout where each principle gets its own dedicated section with an icon, title, and full description. This should be more detailed than the cards on the single-page version. For each of the 7 principles, provide the DE and EN title and full description as specified in the source document. Example: Integration DE: "Alle Module agieren als ein synergetisches Ganzes..." EN: "All modules act as a synergistic whole..." PAGE 3: The Platform (/platform) Purpose: A deep dive into the technical components and code examples for the technical audience. Content: Page Header: H1 (DE/EN): Die System-Module im Detail / The System Modules in Detail. Module Explorer: Layout: Use a clean and functional tabbed interface to present the modules. The tabs should be SentinelCore, SentinelMail, SentinelEndpoint, SentinelAI, SentinelVirt, SentinelChain, OT-Infrastruktur. Inside each tab: Display the module's full title, its detailed description, and the corresponding syntax-highlighted code snippet (if available). All text content must be bilingual. Example for SentinelAI Tab: Title (DE/EN): SentinelAI: Das künstlich-intelligente Abwehrzentrum / SentinelAI: The AI-Powered Defense Center Description (DE/EN): "Die künstliche Intelligenz der Plattform..." / "The artificial intelligence of the platform..." Code Block: The autoencoder Python code. PAGE 4: Vision (/vision) Purpose: To build trust and authority by presenting the architect's philosophy and motivation. Content: Page Header: H1 (DE/EN): Vision des Architekten / The Architect's Vision Introduction Block: Content: Use the full two paragraphs from the "Vision & Einleitung des Architekten" (DE/EN). Visual Separator: An elegant, full-width horizontal line or a subtle graphic element. Final Words Block: H2 (DE/EN): Abschließende Worte / Final Words Content: Use the full paragraph from "Abschließende Worte des Architekten" (DE/EN). Signature: Below the text, display T. Baumann and his title, stylized and italicized. PAGE 5: Contact (/contact) Purpose: A clear call-to-action for interested parties to get in touch. Content: Page Header: H1 (DE/EN): Kontakt & Demo anfordern / Contact & Request a Demo Intro Text (DE/EN): "Kontaktieren Sie uns, um mehr über die SentinelSecureSuite zu erfahren oder eine persönliche Demonstration zu vereinbaren." / "Contact us to learn more about SentinelSecureSuite or to schedule a personal demonstration." Contact Form: Layout: A clean, professional form centered on the page. Fields (with DE/EN labels): Name, Firma/Company, E-Mail, Nachricht/Message. Button (DE/EN): Anfrage senden / Send Request. Please generate a multi-page application based on this structure using React/Next.js and Tailwind CSS. Ensure all navigation links, buttons, and the language switcher are fully functional across all pages. - Initial Deployment
9e8d51b
verified