scriptskit/jenaplan-eclipse-replica
0
1<!DOCTYPE html>2<html lang="de" class="dark">3<head>4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-scale=1.0">6 <title>Schulorganisation - Jenaplanschule Erfurt</title>7 <script src="https://cdn.tailwindcss.com"></script>8 <script src="https://unpkg.com/feather-icons"></script>9 <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>10</head>11<body class="bg-gray-900 text-gray-100 min-h-screen flex flex-col">12 <!-- Header (same as index.html) -->13 <header class="bg-gray-800 shadow-lg">14 <div class="container mx-auto px-4 py-6">15 <div class="flex flex-col md:flex-row justify-between items-center">16 <div class="flex items-center mb-4 md:mb-0">17 <img src="http://static.photos/education/200x200/1" alt="Schullogo" class="h-16 mr-4">18 <h1 class="text-2xl font-bold text-primary">Jenaplanschule Erfurt</h1>19 </div>20 <nav aria-label="Hauptnavigation">21 <ul class="flex flex-wrap justify-center gap-6">22 <li><a href="index.html" class="text-white hover:text-primary transition">Startseite</a></li>23 <li><a href="ueber-uns.html" class="text-white hover:text-primary transition">Über uns</a></li>24 <li><a href="#" class="text-white hover:text-primary transition font-bold">Schulorganisation</a></li>25 <li><a href="#" class="text-white hover:text-primary transition">Downloads</a></li>26 <li><a href="#" class="text-white hover:text-primary transition">Rechtliches</a></li>27 <li><a href="#" class="bg-primary px-4 py-2 rounded-lg hover:bg-opacity-90 transition">Login</a></li>28 </ul>29 </nav>30 </div>31 </div>32 </header>33 34 <!-- Main Content -->35 <main class="flex-grow container mx-auto px-4 py-8">36 <h1 class="text-3xl font-bold text-primary mb-8">Schulorganisation</h1>37 38 <!-- Stundenplan -->39 <section class="mb-12">40 <h2 class="text-2xl font-bold text-primary mb-6">Stundenpläne</h2>41 <div class="bg-gray-800 rounded-xl p-6 mb-6">42 <img src="http://static.photos/office/800x500/1" alt="Stundenplan Beispiel" class="w-full rounded-lg mb-4">43 <p class="mb-4">Die aktuellen Stundenpläne finden Sie im internen Bereich nach dem Login. Bei Fragen wenden Sie sich bitte an das Sekretariat.</p>44 <div class="flex flex-wrap gap-4">45 <button class="bg-primary px-4 py-2 rounded-lg hover:bg-opacity-90 transition">Login für Eltern</button>46 <button class="bg-secondary px-4 py-2 rounded-lg hover:bg-opacity-90 transition">Login für Schüler</button>47 </div>48 </div>49 </section>50 51 <!-- Termine -->52 <section class="mb-12">53 <h2 class="text-2xl font-bold text-primary mb-6">Schultermine</h2>54 <div class="overflow-x-auto">55 <table class="w-full bg-gray-800 rounded-xl overflow-hidden">56 <thead>57 <tr class="bg-gray-700">58 <th class="px-6 py-3 text-left">Datum</th>59 <th class="px-6 py-3 text-left">Veranstaltung</th>60 <th class="px-6 py-3 text-left">Ort</th>61 <th class="px-6 py-3 text-left">Uhrzeit</th>62 </tr>63 </thead>64 <tbody>65 <tr class="border-b border-gray-700 bg-gray-800 hover:bg-gray-750 transition">66 <td class="px-6 py-4">20.06.2024</td>67 <td class="px-6 py-4">Elternabend Stammgruppen 1-3</td>68 <td class="px-6 py-4">Haus 1, Aula</td>69 <td class="px-6 py-4">18:00 Uhr</td>70 </tr>71 <tr class="border-b border-gray-700 bg-gray-850 hover:bg-gray-750 transition">72 <td class="px-6 py-4">25.06.2024</td>73 <td class="px-6 py-4">Projektpräsentationen</td>74 <td class="px-6 py-4">Haus 2, Klassenräume</td>75 <td class="px-6 py-4">14:00 - 17:00 Uhr</td>76 </tr>77 <tr class="border-b border-gray-700 bg-gray-800 hover:bg-gray-750 transition">78 <td class="px-6 py-4">01.07.2024</td>79 <td class="px-6 py-4">Projektwoche</td>80 <td class="px-6 py-4">Schulgelände</td>81 <td class="px-6 py-4">ganztägig</td>82 </tr>83 <tr class="bg-gray-850 hover:bg-gray-750 transition">84 <td class="px-6 py-4">15.07.2024</td>85 <td class="px-6 py-4">Beginn Sommerferien</td>86 <td class="px-6 py-4">-</td>87 <td class="px-6 py-4">-</td>88 </tr>89 </tbody>90 </table>91 </div>92 </section>93 94 <!-- Schmähling Link -->95 <section class="bg-gray-800 rounded-xl p-6">96 <h2 class="text-2xl font-bold text-primary mb-4">Schulsozialarbeit Schmähling</h2>97 <div class="flex flex-col md:flex-row items-start">98 <img src="http://static.photos/people/300x200/1" alt="Schulsozialarbeit" class="w-full md:w-1/3 rounded-lg mb-4 md:mb-0 md:mr-6">99 <div>100 <p class="mb-4">Unsere Schule arbeitet eng mit der Schulsozialarbeit Schmähling zusammen. Diese bietet Beratung und Unterstützung für Schüler, Eltern und Lehrer bei verschiedenen Themen an.</p>101 <a href="#" class="inline-flex items-center bg-primary px-4 py-2 rounded-lg hover:bg-opacity-90 transition">102 <i data-feather="external-link" class="mr-2"></i>103 Zur Website der Schulsozialarbeit104 </a>105 </div>106 </div>107 </section>108 </main>109 110 <!-- Footer (same as index.html) -->111 <footer class="bg-gray-800 py-8">112 <div class="container mx-auto px-4">113 <div class="grid grid-cols-1 md:grid-cols-3 gap-8">114 <div>115 <h3 class="text-lg font-semibold mb-4">Kontakt</h3>116 <address class="text-gray-300 not-italic">117 Jenaplanschule Erfurt<br>118 Musterstraße 1<br>119 99085 Erfurt120 </address>121 </div>122 <div>123 <h3 class="text-lg font-semibold mb-4">Rechtliches</h3>124 <ul class="space-y-2">125 <li><a href="#" class="text-gray-300 hover:text-primary transition">Impressum</a></li>126 <li><a href="#" class="text-gray-300 hover:text-primary transition">Datenschutz</a></li>127 </ul>128 </div>129 <div>130 <h3 class="text-lg font-semibold mb-4">Social Media</h3>131 <div class="flex space-x-4">132 <a href="#" class="text-gray-300 hover:text-primary transition"><i data-feather="facebook"></i></a>133 <a href="#" class="text-gray-300 hover:text-primary transition"><i data-feather="instagram"></i></a>134 <a href="#" class="text-gray-300 hover:text-primary transition"><i data-feather="twitter"></i></a>135 </div>136 </div>137 </div>138 <div class="mt-8 pt-6 border-t border-gray-700 text-center text-gray-400">139 <p>© 2024 Jenaplanschule Erfurt. Alle Rechte vorbehalten.</p>140 </div>141 </div>142 </footer>143 144 <script>145 feather.replace();146 </script>147</body>148</html>149