124-webapp/templates/about.html
2025-10-07 17:48:55 +02:00

119 lines
No EOL
5 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<!-- templates/about.html -->
{% extends "base.html" %}
{% block title %}Über uns studio einszwovier{% endblock %}
{% block content %}
<div class="container">
<section>
<h2>Über den Makerspace</h2>
<p>Seit Dezember 2024 trägt unser Maker Space den Namen <strong>studio einszwovier</strong>. Er ist ein
innovativer, digitaler Lernraum, der Kreativität, Technik und Bildungsgerechtigkeit verbindet. Hier wird
„Making“ erlebbar: Lernende gestalten ihren Lernprozess aktiv, entdecken individuelle Stärken und erleben
durch Selbstwirksamkeit besondere Motivation.
Betreut wird der Maker Space von <strong>Aron Petau</strong> und <strong>Friedrich Weber</strong>. Einfach vorbeischauen, Ideen vorstellen und loslegen!
</p>
</section>
<section>
<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>
Wenn du mehr über unsere Ausstattung erfahren möchtest oder spezielle Geräte suchst, schau in unsere
<a href="{{ bookstack_url }}" target="_blank">Wissenssammlung</a> oder frag uns direkt im Studio!
</section>
<section>
<h2>Öffnungszeiten + Kontakt</h2>
<p>Dienstag bis Donnerstag: 11:00 16:00 Uhr<br>
Raum 124, Gabriele-von-Bülow-Gymnasium</p>
<p>E-Mail: <a href="mailto:einszwovier@gvb-gymnasium.de">einszwovier@gvb-gymnasium.de</a></p>
<h2>Standort</h2>
<p>Gabriele-von-Bülow-Gymnasium<br>
Tile-Brügge-Weg 63, 13509 Berlin (Tegel)<br>
Telefon: 030 21 00 52 460<br>
E-Mail: <a href="mailto:info@gvb-gymnasium.de">info@gvb-gymnasium.de</a></p>
</section>
<section>
<h2>Aktuelle Kurse</h2>
{% 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>
</div>
{% endblock %}