934aac41dc
Early theme initialization to prevent flashing Proper component and script loading order Enhanced error handling and fallbacks Better theme state persistence System theme preference detection The theme system will now work correctly in the production environment when deployed through Coolify with Nixpacks build pack.
87 lines
4.3 KiB
HTML
87 lines
4.3 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="de">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>7SYS - Persönliche IT-Lösungen</title>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Open+Sans:wght@400;700&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
|
||
<link rel="stylesheet" href="css/variables.css">
|
||
<link rel="stylesheet" href="css/base.css">
|
||
<link rel="stylesheet" href="css/layout.css">
|
||
<link rel="stylesheet" href="css/header.css">
|
||
<link rel="stylesheet" href="css/components.css">
|
||
<link rel="stylesheet" href="css/animations.css">
|
||
<link rel="stylesheet" href="css/footer.css">
|
||
<link rel="stylesheet" href="css/responsive.css">
|
||
</head>
|
||
<body>
|
||
<main>
|
||
<div class="container">
|
||
<section id="intro">
|
||
<h1 class="h1-hero">Ihr Partner für Digitale Souveränität</h1>
|
||
<p class="welcome-quote">Als Ihr persönlicher IT-Experte entwickle ich maßgeschneiderte und zukunftssichere Systemarchitekturen. Mit Expertise und Leidenschaft gestalte ich IT-Lösungen, die Ihr Unternehmen nachhaltig stärken und schützen.</p>
|
||
<span class="logo-sub">Simplicity is a great virtue but it requires hard work to achieve it and education to appreciate it. And to make matters worse: complexity sells better.</span>
|
||
<div class="mission-vision">
|
||
<div>
|
||
<h3>Vision</h3>
|
||
<p>Digitale Souveränität</p>
|
||
</div>
|
||
<div>
|
||
<h3>Mission</h3>
|
||
<p>Sichere und nachhaltige IT-Lösungen</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="services">
|
||
<h2>Meine Expertise</h2>
|
||
|
||
<div class="service-card">
|
||
<h3>IT-Beratung</h3>
|
||
<p>Strategische IT-Beratung für Ihren Erfolg: Von der Analyse Ihrer bestehenden Systeme bis zur Entwicklung zukunftssicherer IT-Strategien. Ich begleite Sie persönlich bei jedem Schritt.</p>
|
||
</div>
|
||
|
||
<div class="service-card">
|
||
<h3>Systemadministration</h3>
|
||
<p>Professionelle Verwaltung und Wartung Ihrer IT-Systeme: Server-Management, Netzwerkadministration, Backup-Konzepte und Security-Lösungen für einen reibungslosen Betrieb.</p>
|
||
</div>
|
||
|
||
<div class="service-card">
|
||
<h3>Automatisierung</h3>
|
||
<p>Clevere automatisierte Lösungen für ausgewählte Prozesse, die Sie in Ihrer Organisation nutzen können, um Arbeiten sicher, effizient und konsistent zu gestalten.</p>
|
||
</div>
|
||
|
||
<div class="service-card">
|
||
<h3>Cloud Services</h3>
|
||
<p>Maßgeschneiderte Cloud-Lösungen: Migration, Implementierung und Management Ihrer Cloud-Infrastruktur. Skalierbar, sicher und kosteneffizient – optimal auf Ihre Bedürfnisse abgestimmt.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="contact">
|
||
<h2>Kontakt</h2>
|
||
<div class="contact-info">
|
||
<p>Ich freue mich darauf, Ihr Projekt kennenzulernen und Ihnen mein Wissen zu vermitteln.</p>
|
||
<a href="mailto:kontakt@7sys.de">E-Mail: kontakt@7sys.de</a>
|
||
<a href="tel:+49123456789">Tel: +49 123 456789</a>
|
||
<a href="https://signal.me/7sys">Signal: @7sys</a>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</main>
|
||
|
||
<!-- Load scripts at the end of body -->
|
||
<script src="js/components.js"></script>
|
||
<script>
|
||
// Initialize theme only after components are loaded
|
||
document.addEventListener('componentsLoaded', function() {
|
||
const themeScript = document.createElement('script');
|
||
themeScript.src = 'js/theme.js';
|
||
document.body.appendChild(themeScript);
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|