124-webapp/templates/about.html

119 lines
5 KiB
HTML
Raw Normal View History

2025-10-02 12:20:11 +02:00
<!DOCTYPE html>
2025-09-11 16:01:32 +02:00
<!-- templates/about.html -->
2025-09-17 20:26:44 +02:00
{% extends "base.html" %}
2025-09-11 16:01:32 +02:00
2025-10-02 12:20:11 +02:00
{% block title %}Über uns studio einszwovier{% endblock %}
2025-09-17 20:26:44 +02:00
{% block content %}
<div class="container">
2025-09-11 16:01:32 +02:00
<section>
2025-10-02 12:20:11 +02:00
<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
2025-10-07 17:48:55 +02:00
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>
2025-09-11 16:01:32 +02:00
</section>
<section>
2025-09-17 20:26:44 +02:00
<h2>Ausstattung</h2>
<ul>
<li><strong>3D-Drucker:</strong> Für Modelle und Prototypen.</li>
2025-10-07 13:02:29 +02:00
<li><strong>Großformatdrucker (A0):</strong> Präzisionsdruck für große Formate.</li>
2025-09-17 20:26:44 +02:00
<li><strong>Lasercutter:</strong> Präzises Schneiden und Gravieren von Materialien.</li>
2025-10-07 13:02:29 +02:00
<li><strong>Stickmaschine:</strong> Professionelle Textilveredelung.</li>
2025-09-17 20:26:44 +02:00
<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>
2025-10-07 13:02:29 +02:00
<li><strong>Drohnen:</strong> Flugexperimente und Luftbildfotografie.</li>
<li><strong>LEGO SPIKE Roboter:</strong> Spielerisches Erlernen von Robotik und Programmierung.</li>
2025-09-17 20:26:44 +02:00
</ul>
2025-09-11 16:01:32 +02:00
2025-10-07 17:48:55 +02:00
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!
2025-09-11 16:01:32 +02:00
</section>
<section>
2025-10-07 17:48:55 +02:00
<h2>Öffnungszeiten + Kontakt</h2>
2025-09-17 20:26:44 +02:00
<p>Dienstag bis Donnerstag: 11:00 16:00 Uhr<br>
2025-10-02 12:20:11 +02:00
Raum 124, Gabriele-von-Bülow-Gymnasium</p>
2025-09-17 20:26:44 +02:00
<p>E-Mail: <a href="mailto:einszwovier@gvb-gymnasium.de">einszwovier@gvb-gymnasium.de</a></p>
2025-10-07 17:48:55 +02:00
<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>
2025-09-11 16:01:32 +02:00
</section>
2025-10-07 17:48:55 +02:00
2025-09-11 16:01:32 +02:00
<section>
2025-09-17 20:26:44 +02:00
<h2>Aktuelle Kurse</h2>
2025-10-07 13:02:29 +02:00
{% 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 %}
2025-09-11 16:01:32 +02:00
</section>
2025-10-07 13:02:29 +02:00
<!-- 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>
2025-09-17 20:26:44 +02:00
</div>
2025-10-02 12:20:11 +02:00
{% endblock %}