gallery, fixes, etc.

This commit is contained in:
Denys Konovalov 2023-03-03 17:18:54 +01:00
parent 091367b46c
commit 695daa70aa
7 changed files with 217 additions and 78 deletions

@ -457,3 +457,100 @@ details[open] summary {
.fb-tile-icon { .fb-tile-icon {
font-size: 96px; font-size: 96px;
} }
.img-slider{
position: relative;
margin: 10px;
width: 95%;
height: 500px;
background: #1D212B;
}
.img-slider .is-slide{
z-index: 1;
position: absolute;
width: 100%;
clip-path: circle(0% at 0 50%);
}
.img-slider .is-slide.active{
clip-path: circle(150% at 0 50%);
transition: 2s;
transition-property: clip-path;
}
.img-slider .is-slide img{
z-index: 1;
width: 100%;
border-radius: 5px;
}
.img-slider .is-navigation{
z-index: 2;
position: absolute;
display: flex;
bottom: 20px;
left: 50%;
border-radius: 10px;
transform: translateX(-50%);
background-color: #1a1a37;
}
.img-slider .is-navigation .is-btn{
background: rgba(255, 255, 255, 0.5);
width: 12px;
height: 12px;
margin: 10px;
border-radius: 50%;
cursor: pointer;
}
.img-slider .is-navigation .is-btn.active{
background: #2696E9;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
}
@media (max-width: 820px){
.img-slider{
width: 600px;
height: 375px;
}
.img-slider .is-navigation{
bottom: 25px;
}
.img-slider .is-navigation .is-btn{
width: 10px;
height: 10px;
margin: 8px;
}
}
@media (max-width: 620px){
.img-slider{
width: 400px;
height: 250px;
}
.img-slider .is-navigation{
bottom: 15px;
}
.img-slider .is-navigation .is-btn{
width: 8px;
height: 8px;
margin: 6px;
}
}
@media (max-width: 420px){
.img-slider{
width: 320px;
height: 200px;
}
.img-slider .is-navigation{
bottom: 10px;
}
}

@ -3,17 +3,10 @@ title: "2018"
draft: false draft: false
bg_image: media/backgrounds/page-title.webp bg_image: media/backgrounds/page-title.webp
type: schulchronik type: schulchronik
pretext: >+ pretext: >
2018 war sowohl für das GCG als auch für Georg Cantor selbst ein ganz 2018 war sowohl für das GCG als auch für Georg Cantor selbst ein ganz besonderes Jahr. Während der 100. Todestag von unserem Namensgeber gefeiert wurde, zelebrierte unser Gymnasium sein 30-jähriges Bestehen.
besonderes Jahr. Während der 100. Todestag von unserem Namensgeber gefeiert
wurde, zelebrierte unsere Gymnasium sein 30 jähriges Bestehen.
Im Rahmen dieser Festlichkeiten wurden vielfältige Aktionen geplant. Unter anderem wurde mit viel Mühe und Arbeit eine Rallye zum Thema Cantor zusammengestellt, ein Flashmob in Form eines Unendlichkeitszeichen organisiert und es fand ein fantastisches Schulfest statt, welches die damalige 10. Klasse zusammengestellt hat.
Im Rahmen dieser Festlichkeiten wurden vielfältige Aktionen geplant. Unter anderem wurde mit viel Mühe und Arbeit eine Rallye zum Thema Cantor zusammengestellt, ein Flashmob in Form eines Unendlichkeitszeichens organisiert und es fand ein fantastisches Schulfest statt, welches die damalige 10. Klasse zusammengestellt hat.
topics: topics:
- title: 30-jähriges Jubiläum - title: 30-jähriges Jubiläum
content: | content: |
@ -34,71 +27,33 @@ topics:
{{< figure src="/media/schulchronik/2018/projektarbeit/CantorBroschuere.webp" >}} {{< figure src="/media/schulchronik/2018/projektarbeit/CantorBroschuere.webp" >}}
{{< /gallery >}} {{< /gallery >}}
## Wie entwickelt man eigentlich eine App? ## Wie entwickelt man eigentlich eine App?
-Was lange währt wird gut- -Was lange währt, wird gut-
Zeitraum: Mai 2017 bis April 2018 - Zeitraum: Mai 2017 bis April 2018
- Ziel: Erstellung einer mathematischen Stadtrallye für das Smartphone, die historisches und mathematisches Wissen über das Wirken von Georg Cantor an verschiedenen Standorten in Halle vermitteln soll, Ehrung Georg
Cantors anlässlich seines 100. Todestages, Beitrag zum 30-jährigen Schuljubiläum
- Beteiligte: Mitarbeiter und Studenten des Institutes für Didaktik der Mathematik in Leipzig unter Leitung von Fr. Juniorprof. Silvia Schöneburg, Schulchronik AG mit Fr. K. Schmidt, weitere interessierte Schülerinnen und Schüler
Ziel: Erstellung einer 1. Zu Beginn wurden Infos überbmögliche Stationen gesammelt, photographiert und Preise für die Schüler ausgewählt. Frau Schmidt beschäftigte sich mit diesem Arbeitsschritt bis Oktober 2017.
mathematischen Stadtrallye für das Smartphone, die historisches und 1. Ab Oktober bildete sich aus Mitarbeitern und Studenten der Uni Leipzig, Schülern und Fr. Schmidt eine Arbeitsgemeinschaft.
mathematisches Wissen über das Wirken von Georg Cantor an 1. Von Oktober 2017 bis April 2018 wurden **4 Apps** für die Klassen 5/6, 7/8, 9/10 und11/12 erstellt.
verschiedenen Standorten in Halle vermitteln soll, Ehrung Georg
Cantors anläßlich seines 100. Todestages, Beitrag zum 30
jährigen Schuljubiläum
Beteiligte: Mitarbeiter und
Studenten des Institutes für Didaktik der Mathematik in Leipzig
unter Leitung von Fr. Juniorprof. Silvia Schöneburg, Schulchronik Ag
mit Fr. K. Schmidt, weitere interessierte Schülerinnen und Schüler
1. Zu Beginn wurden Infos über
mögliche Stationen gesammelt, photographiert und Preise für die
Schüler ausgewählt. Frau Schmidt beschäftigtesich mit diesem
Arbeitsschritt bis Oktober 2017.
1. Ab Oktober bildete sich
aus Mitarbeiternund Studenten der Uni Leipzig, Schülern
und Fr. Schmidt eineArbeitsgemeinschaft.
1. Von Oktober
2017 bisApril 2018 wurden **4
Apps** für die
Klassen 5/6, 7/8, 9/10 und11/12 erstellt.
1. Anschließend wurde eine **Broschüre** über das Projekt gestaltet. 1. Anschließend wurde eine **Broschüre** über das Projekt gestaltet.
1. Am 28.09.2018 kam es dann 1. Am 28.09.2018 kam es dann letztendlich zur Durchführung der Rallyes zum 30-jährigen Schuljubiläum (die Klassen 5-8 werden von Schülern der Klassen 11 und 12 unterstützt, die zuvor von den
letztendlich zur Durchführungder Rallyes zum 30-jährigen Schuljubiläum (die Klassen 5-8 werden
von Schülern der Klassen 11 und 12 unterstützt, die zuvor von den
App-Erstellern eingewiesen wurden). App-Erstellern eingewiesen wurden).
@ -113,7 +68,7 @@ topics:
Neben den klassischen Aktionen bei unseren Schulfesten wie Sportspielen, Neben den klassischen Aktionen bei unseren Schulfesten wie Sportspielen,
Basteleien, Schach usw. gibt es in diesem Jahr anläßlich unseres 30-jährigen Basteleien, Schach usw. gibt es in diesem Jahr anlässlich unseres 30-jährigen
Schuljubiläums und des 100. Todestages von Georg Cantor auch eine Schuljubiläums und des 100. Todestages von Georg Cantor auch eine
@ -174,8 +129,7 @@ topics:
superhaufen: superhaufen:
enable: false enable: false
- title: Wettbewerbserfolge - title: Wettbewerbserfolge
content: | content: "\n\n\n"
Inhalt
superhaufen: superhaufen:
enable: false enable: false
cantorpreisträger: Carolina Sirui Cao cantorpreisträger: Carolina Sirui Cao

@ -4,6 +4,10 @@ draft: false
bg_image: /media/backgrounds/page-title.webp bg_image: /media/backgrounds/page-title.webp
type: superhaufen type: superhaufen
gallery: true gallery: true
previous:
title: 2018
link: /schulchronik/2018/
enable: true
tiles: tiles:
- title: Festveranstaltung - title: Festveranstaltung
bg_color: "#ffef00" bg_color: "#ffef00"
@ -146,8 +150,8 @@ tiles:
Den Freitag, den zweiten Tag der Festtage zum 30. Jubiläum, verbrachten Den Freitag, den zweiten Tag der Festtage zum 30. Jubiläum, verbrachten
Schülerinnen und Schüler mit unterschiedlichen Aktionen, wie zum Beispiel Schülerinnen und Schüler mit unterschiedlichen Aktionen, wie zum Beispiel
einem Kinobesuch, einer Vorlesung in Physik oder einer Rallye durch die einem Kinobesuch, einer Vorlesung in Physik oder einer Rallye durch die
Stadt Halle auf den Spuren von Georg Cantor, in Form von 4 Stadt Halle auf den Spuren von Georg Cantor, in Form von 4 selbst
selbstprogrammierten Cantor-Apps. programmierten Cantor-Apps.
font_color: "#ffffff" font_color: "#ffffff"
unterhaufen: unterhaufen:
- title: Überblick - title: Überblick
@ -309,7 +313,7 @@ tiles:
Nach reichlicher Überlegung kam unserem Schuldirektor Herrn Gorsler Nach reichlicher Überlegung kam unserem Schuldirektor Herrn Gorsler
die Idee einen Flashmob zu veranstalten. Die genaue Form das mit die Idee, einen Flashmob zu veranstalten. Die genaue Form das mit
Georg Cantor verbundene Unendlichkeitszeichen schlug Frau Schmidt Georg Cantor verbundene Unendlichkeitszeichen schlug Frau Schmidt
@ -338,7 +342,7 @@ tiles:
getroffen und der Text entsprechend des Anlasses angepasst. getroffen und der Text entsprechend des Anlasses angepasst.
Nun waren alle Vorbereitungen getroffen. Am Freitag, den 28.09.2018, Nun waren alle Vorbereitungen getroffen. Am Freitag, dem 28.09.2018,
liefen die Schülerinnen und Schüler im Anschluss an die Rallye zum liefen die Schülerinnen und Schüler im Anschluss an die Rallye zum
@ -346,7 +350,7 @@ tiles:
ihren Klassen an ihren mit Kreide gekennzeichneten Platz. Plötzlich ihren Klassen an ihren mit Kreide gekennzeichneten Platz. Plötzlich
erfüllte das ausgewählte Lied „[Zusammen](https://www.youtube.com/watch?v=dQw4w9WgXcQ)“ den Platz, sodass alle erfüllte das ausgewählte Lied „Zusammen“ den Platz, sodass alle
Schülerinnen und Schüler enthusiastisch und voller Freude anfingen Schülerinnen und Schüler enthusiastisch und voller Freude anfingen
@ -355,6 +359,8 @@ tiles:
Der Flashmob bildete einen krönenden Abschluss der Festwoche. Der Flashmob bildete einen krönenden Abschluss der Festwoche.
{{< slider dir="/media/schulchronik/2018/flashmob" >}}
{{< gallery dir="/media/schulchronik/2018/liedtext" />}} {{< gallery dir="/media/schulchronik/2018/liedtext" />}}
font_color: "#ffffff" font_color: "#ffffff"

@ -3,7 +3,7 @@
<div class="row"> <div class="row">
<div class="col-md-8"> <div class="col-md-8">
<ul class="list-inline"> <ul class="list-inline">
<li class="list-inline-item h2"><a class="text-primary font-secondary" href="{{ if .Parent.Page }}{{ .Parent.Page.Permalink }}{{ else }}{{ .Site.BaseURL | absLangURL }}{{end}}">{{ with .Parent.Params.title }}{{.}}{{ else }}{{ .Site.Params.home }}{{end}}</a></li> <li class="list-inline-item h2"><a class="text-primary font-secondary" href="{{ if .Params.Previous.Enable }}{{ .Params.Previous.Link }}{{ else if .Parent.Page }}{{ .Parent.Page.Permalink }}{{ else }}{{ .Site.BaseURL | absLangURL }}{{end}}">{{ if .Params.Previous.Enable }}{{ .Params.Previous.Title }}{{ else }}{{ with .Parent.Params.title }}{{.}}{{ else }}{{ .Site.Params.home }}{{end}}{{ end }}</a></li>
<li class="list-inline-item h2"><i class="mdi mdi-chevron-double-right text-white"></i></li> <li class="list-inline-item h2"><i class="mdi mdi-chevron-double-right text-white"></i></li>
<li class="list-inline-item text-white h2 font-secondary">{{ .Title }}</li> <li class="list-inline-item text-white h2 font-secondary">{{ .Title }}</li>
</ul> </ul>

@ -0,0 +1,75 @@
<div class="img-slider">
{{- with (.Get "dir") -}}
{{- $files := readDir (print "/static/" .) }}
{{- range $index, $file := $files -}}
{{- $isimg := lower $file.Name | findRE "\\.(gif|jpg|jpeg|tiff|png|bmp|webp|avif|jxl)" }}
{{- if $isimg }}
{{- $linkURL := print $.Site.BaseURL "/" ($.Get "dir") "/" $file.Name | absURL }}
<div class="is-slide {{if eq $index 0 }}active{{end}}">
<img src="{{ $linkURL }}" alt="">
</div>
{{- end }}
{{- end }}
{{- end }}
<div class="is-navigation">
<div class="is-btn active"></div>
<div class="is-btn"></div>
<div class="is-btn"></div>
<div class="is-btn"></div>
</div>
</div>
<script type="text/javascript">
var slides = document.querySelectorAll('.is-slide');
var btns = document.querySelectorAll('.is-btn');
let currentSlide = 1;
// Javascript for image slider manual navigation
var manualNav = function(manual){
slides.forEach((slide) => {
slide.classList.remove('active');
btns.forEach((btn) => {
btn.classList.remove('active');
});
});
slides[manual].classList.add('active');
btns[manual].classList.add('active');
}
btns.forEach((btn, i) => {
btn.addEventListener("click", () => {
manualNav(i);
currentSlide = i;
});
});
// Javascript for image slider autoplay navigation
var repeat = function(activeClass){
let active = document.getElementsByClassName('active');
let i = 1;
var repeater = () => {
setTimeout(function(){
[...active].forEach((activeSlide) => {
activeSlide.classList.remove('active');
});
slides[i].classList.add('active');
btns[i].classList.add('active');
i++;
if(slides.length == i){
i = 0;
}
if(i >= slides.length){
return;
}
repeater();
/// Time in ms
}, 5000);
}
repeater();
}
repeat();
</script>

@ -21,12 +21,12 @@
</button> </button>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div class="content"> <div class="content mb-2">
{{ .content | markdownify }} {{ .content | markdownify }}
</div> </div>
{{ range .unterhaufen }} {{ range .unterhaufen }}
<div class="container mb-0"> <div class="container mb-0">
<div class="card border-primary rounded-0 hover-shadow mb-5"> <div class="card border-primary rounded-0 hover-shadow mb-2">
<div class="card-body mb-0"> <div class="card-body mb-0">
<details class="mb-0"> <details class="mb-0">
<summary class="mb-0">{{ .title }}</summary> <summary class="mb-0">{{ .title }}</summary>

@ -184,6 +184,13 @@ collections:
- {label: "Hintergrundbild", name: "bg_image", widget: "hidden", default: "/media/backgrounds/page-title.webp"} - {label: "Hintergrundbild", name: "bg_image", widget: "hidden", default: "/media/backgrounds/page-title.webp"}
- {label: "Type", name: "type", widget: "hidden", default: "superhaufen"} - {label: "Type", name: "type", widget: "hidden", default: "superhaufen"}
- {label: "Gallerie-Komponente", name: "gallery", widget: "boolean", default: true, required: false, hint: "Benötigt für Gallerie bzw. Bildeinbettung"} - {label: "Gallerie-Komponente", name: "gallery", widget: "boolean", default: true, required: false, hint: "Benötigt für Gallerie bzw. Bildeinbettung"}
- label: "Rückverlinkung"
name: "previous"
widget: "object"
fields:
- {label: "Aktiviert", name: "enable", widget: "hidden", default: true}
- {label: "Titel", name: "title", widget: "string", required: true}
- {label: "Link", name: "link", widget: "string", required: true}
- label: "Kacheln" - label: "Kacheln"
name: "tiles" name: "tiles"
widget: "list" widget: "list"