design final

This commit is contained in:
Aron Petau 2025-10-07 13:02:29 +02:00
parent a0d2188f6f
commit 99a690972e
1414 changed files with 2389 additions and 1455 deletions

View file

@ -18,17 +18,21 @@
<h2>Ausstattung</h2>
<ul>
<li><strong>3D-Drucker:</strong> Für Modelle und Prototypen.</li>
<li><strong>Großformatdrucker (A0):</strong> Präzisionsdruck für große Formate.</li>
<li><strong>Lasercutter:</strong> Präzises Schneiden und Gravieren von Materialien.</li>
<li><strong>Stickmaschine:</strong> Professionelle Textilveredelung.</li>
<li><strong>Microcontroller:</strong> Elektronik und Programmierung.</li>
<li><strong>Holzbearbeitung:</strong> Handwerkliche Projekte.</li>
<li><strong>Textildruckgeräte:</strong> Kreative Designs auf Stoffen.</li>
<li><strong>Drohnen:</strong> Flugexperimente und Luftbildfotografie.</li>
<li><strong>LEGO SPIKE Roboter:</strong> Spielerisches Erlernen von Robotik und Programmierung.</li>
</ul>
</section>
<section>
<h2>Betreuungsteam</h2>
<p>Betreut wird der Maker Space von <strong>Aron Petau</strong> und <strong>Friedrich Weber</strong>. Sie sind
montags bis mittwochs von 11:00 bis 15:00 Uhr vor Ort. Einfach vorbeischauen, Ideen vorstellen und loslegen!
von Dienstag bis Donnerstag von 11:00 bis 16:00 Uhr vor Ort. Einfach vorbeischauen, Ideen vorstellen und loslegen!
</p>
</section>
@ -45,13 +49,72 @@
<section>
<h2>Aktuelle Kurse</h2>
<ul>
<li><strong>Löten und Leuchten:</strong> Herstellung von Nachttischleuchten mit 3D-Design und Löttechnik.
</li>
<li><strong>Die Vogelvilla:</strong> Bau von Vogelhäusern mit Lasercutter und Holzbearbeitung.</li>
</ul>
{% if courses %}
<div class="courses-grid">
{% for course in courses %}
<div class="course-card">
{% if course.image %}
<div class="course-image" onclick="openImageModal('{{ course.image }}', '{{ course.title }}')">
<img src="{{ course.image }}" alt="{{ course.title }}">
</div>
{% endif %}
<div class="course-content">
<h3 class="course-title">{{ course.title }}</h3>
{% if course.description %}
<p class="course-description">{{ course.description }}</p>
{% endif %}
<div class="course-meta">
{% if course.dates %}
<div class="course-dates">📅 {{ course.dates }}</div>
{% endif %}
{% if course.offen_fuer %}
<div class="course-audience">👥 {{ course.offen_fuer }}</div>
{% endif %}
</div>
</div>
</div>
{% endfor %}
</div>
{% else %}
<p>Aktuell sind keine Kurse geplant. Schaut bald wieder vorbei!</p>
{% endif %}
</section>
<!-- Image Modal -->
<div id="imageModal" class="image-modal" onclick="closeImageModal()">
<span class="modal-close">&times;</span>
<img class="modal-content" id="modalImage">
<div id="modalCaption"></div>
</div>
<script>
function openImageModal(imageSrc, caption) {
const modal = document.getElementById('imageModal');
const modalImg = document.getElementById('modalImage');
const modalCaption = document.getElementById('modalCaption');
modal.style.display = 'flex';
modalImg.src = imageSrc;
modalCaption.textContent = caption;
// Prevent body scroll when modal is open
document.body.style.overflow = 'hidden';
}
function closeImageModal() {
const modal = document.getElementById('imageModal');
modal.style.display = 'none';
document.body.style.overflow = 'auto';
}
// Close modal with Escape key
document.addEventListener('keydown', function(event) {
if (event.key === 'Escape') {
closeImageModal();
}
});
</script>
<section>
<h2>Standort</h2>
<p>Gabriele-von-Bülow-Gymnasium<br>

View file

@ -30,7 +30,7 @@
<div class="status-card">
<div class="status-header">Hinweis</div>
<div class="status-body">
Diese Website ist ein gemeinschaftliches Projekt. Jede*r ist eingeladen, Verbesserungen beizutragen.
Diese Website ist ein gemeinschaftliches Projekt. Jede*r ist eingeladen, Verbesserungen beizutragen:
<a href="https://forgejo.petau.net/aron/124-webapp" target="_blank">Quellcode ansehen</a>.
</div>
</div>
@ -49,13 +49,13 @@
<div class="tagline">Berechne einfach Druck- und Materialkosten für Posterprints und andere Großformate.</div>
</a>
<a class="link-card" href="http://einszwovier.local:3000" target="_blank">
<a class="link-card" href="http://{{ server_hostname }}:{{ bookstack_port }}" target="_blank">
<div class="title">Wissenssammlung</div>
<div class="tagline">Zugriff auf geteilte Anleitungen und Dokumente innerhalb von Docmost ideal für die
Zusammenarbeit.</div>
<div class="tagline">Zugriff auf geteilte Anleitungen und Dokumente innerhalb von BookStack ideal für die
Zusammenarbeit. Schreib uns eine kurze E-Mail, um einen Login zu erhalten.</div>
</a>
<a class="link-card" href="http://einszwovier.local:8080" target="_blank">
<a class="link-card" href="http://{{ server_hostname }}:{{ openwebui_port }}" target="_blank">
<div class="title">Lokaler Chatbot</div>
<div class="tagline">Teste unsere schulischen Large Language Models direkt über die Weboberfläche.</div>
</a>
@ -70,7 +70,7 @@
<!-- Footer with Admin Panel and Source Link -->
<footer class="footer">
<div class="footer-container">
<a href="http://einszwovier.local:9000" target="_blank" class="admin-link">Admin Panel (Portainer)</a>
<a href="http://{{ server_hostname }}:{{ portainer_port }}" target="_blank" class="admin-link">Admin Panel (Portainer)</a>
<span class="footer-source">
| <a href="https://forgejo.petau.net/aron/124-webapp" target="_blank">Quellcode der Website</a>
</span>

View file

@ -70,7 +70,7 @@
<input type="text" id="name" name="name" required placeholder="Dein Name">
<label for="comment"><strong>Zusätzliche Hinweise:</strong></label>
<textarea id="comment" name="comment" rows="4" placeholder="z. B. doppelseitig oder spezielles Papier"></textarea>
<textarea id="comment" name="comment" rows="4" placeholder="z.&nbsp;B. doppelseitig oder spezielles Papier"></textarea>
<button type="submit">Auftrag senden</button>
</form>