feat: update schule site

The update is based on the resolutions of today's get-together. It
includes:

- update of the text
- funny little hello world code thing in the header with some css magick
This commit is contained in:
aviac - 2023-11-09 23:35:48 +01:00 committed by aviac -
parent e563a3a502
commit c538b9c496
2 changed files with 135 additions and 37 deletions

View File

@ -2,47 +2,54 @@
<!DOCTYPE page SYSTEM "http://www.c3d2.de/dtd/c3d2web.dtd">
<page pagetitle="Chaos macht Schule Dresden" title="Schule">
<div class="cms-print-text-container">
<!-- Ordered by coolness 😝 -->
<!-- Could be improved, but it's a good start -->
<div class="cms-print-text-1">
println!("Hallo, Welt!");
</div>
<div class="cms-print-text-2">
putStrLn "Hallo, Welt!"
</div>
<div class="cms-print-text-3">
print("Hallo, Welt!")
</div>
<div class="cms-print-text-4">
std::cout &lt;&lt; "Hallo, Welt!";
</div>
</div>
<p class="center">
<image title="CmS Logo">
images/cms.png
</image>
</p>
<p title="Herzlich willkommen beim Chaos macht Schule Projekt in Dresden!">
Wir sind Teil der <link href="https://www.ccc.de/schule">"Chaos macht Schule"</link> Initiative, die seit etwa 2007 in enger Kooperation mit verschiedenen Bildungsinstitutionen aktiv ist. Unser vorrangiges Ziel besteht darin, die Medienkompetenz und das Verständnis für Technik in Schulen zu stärken. Hierfür bieten wir Workshops und Schulungen nicht nur für Schüler, Lehrer und Eltern an, sondern sind auch in der Lage, Vorträge beispielsweise an der TU Dresden zu halten.
</p>
<p title="Unsere Schwerpunkte umfassen folgende Bereiche:">
<ul>
<li>Überwachung und Datenschutz - wie kann ich meine Daten effektiv schützen?</li>
<li>Förderung von Medienkompetenz und Verständnis sozialer Netzwerke</li>
<li>Themen rund um künstliche Intelligenz</li>
<li>Freie Lizenzen und die Nutzung von Open Source Software</li>
</ul>
</p>
<p title="Termine regelmäßiger Treffen">
Wir treffen uns regelmäßig, jeweils am zweiten Mittwoch eines Monats ab 16:00 Uhr, zu offenen und persönlichen Zusammenkünften im <link href="https://c3d2.de/space.html">HQ des C3D2</link>. Jede Person ist herzlich eingeladen, seien es Interessierte, potenzielle Mitstreiter:innen oder Ratsuchende. Während dieser Treffen erarbeiten wir neue Inhalte, planen Veranstaltungen und stehen gerne für Fragen zur Verfügung.
</p>
<p title="Quellen und Materialien">
Unsere Präsentationsfolien sind unter freien Creative-Commons-Lizenzen verfügbar<sup><link href="#lizenzhinweis">[1]</link></sup> und dürfen unter den angegebenen Bedingungen gerne und auch in Teilen weiterverwendet werden! Die Folien sowie der dazugehörige LaTeX-Quellcode sind seit Januar 2014 auf der <link href="https://gitea.c3d2.de/cms">Gitea-Seite des C3D2</link> veröffentlicht. Frühere Vorträge sind auf der <link href="https://github.com/c3d2">GitHub-Seite des C3D2</link> in eigenen Repositories mit "CMS" im Namen zu finden.
<p title="&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;&#x3000;vom Chaos macht Schule Projekt in Dresden">
Wir sind Teil der <link href="https://www.ccc.de/schule">Chaos macht Schule</link> Initiative, die seit etwa 2007 in enger Kooperation mit verschiedenen Bildungsinstitutionen aktiv ist. Im <link href="https://www.ccc.de/">CCC</link> wird schon immer ein selbstverständlicher und trotzdem kritischer Umgang mit modernster Technik gelebt, vor allem im Bezug auf das Internet. Unser Anliegen ist es Interessierte über die Möglichkeiten, Risiken und Grenzen der Technik dahinter aufzuklären und Verständnis zu schaffen.
Hierfür bieten wir Vorträge, Workshops und Schulungen für Schüler:innen, Fachkräfte und Eltern und auch für akademische Einrichtungen und in Vereinen an.
</p>
<dl>
<dt>Für Anfragen oder zum mitmachen bitte eine E-Mail an</dt>
<dd>
<link href="mailto:schule@c3d2.de">
schule at c3d2 dot de
</link>
</dd>
</dl>
<div id="lizenzhinweis" class="footnotes">
<p class="footnote">
<span>[1]:</span>
Üblicherweise ist die ausgewiesene Lizenz eine der
<link href="https://de.creativecommons.org/">Creative Commons</link>
, was bedeutet, dass das daraus resultierende Werk wieder unter z.B.
<link href="https://creativecommons.org/licenses/by-sa/4.0/">CC-BY-SA 4.0</link>
stehen muss und die beteiligten Urheber genannt werden sollen.
Ganze Foliensätze können so einfach als Kopie vom Original mit
dem enthaltenen Lizenzverweis verwendet werden.
</p>
</div>
<p title="Themenschwerpunkte">
<ul>
<li>Internetnutzung </li>
<li>Risiken von sozialen Netzen </li>
<li>Überwachung und Datenschutz </li>
<li>Themen rund um künstliche Intelligenz </li>
<li>Urheberrecht im Netz </li>
<li>freie und offene Software und Lizenzen</li>
</ul>
</p>
<p title="Termine regelmäßiger Treffen">
Wir treffen uns regelmäßig, jeweils am zweiten Mittwoch eines Monats ab 18:00 Uhr im <link href="https://c3d2.de/space.html">hq des c3d2</link> (siehe auch den <link href="https://c3d2.de/calendar.html">Kalender</link>). Jede Person ist herzlich eingeladen, seien es Interessierte, potenzielle Mitstreiter:innen oder Ratsuchende. Während dieser Treffen erarbeiten wir neue Inhalte, planen Veranstaltungen und stehen gerne für Fragen zur Verfügung.
</p>
<p title="Quellen und Materialien">
Unsere Quellen und Materialien befinden sich zur Zeit in Überarbeitung und werden hier 2024 nach und nach neu erscheinen. Alle Materialien stehen stets unter einer <link href="https://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Lizenz BY-SA 4.0</link> und sind damit frei nutzbar.
<dl>
<dt>Für Anfragen oder zum mitmachen bitte eine E-Mail an:</dt>
<dd><link href="mailto:schule@c3d2.de">schule@c3d2.de</link></dd>
</dl>
</p>
</page>

View File

@ -1,3 +1,9 @@
:root {
--cms-text-size: 24px;
--cms-text-position-top: 253px;
--cms-text-position-left: 0px;
}
/* -- General -- */
html {
margin: 0;
@ -907,7 +913,6 @@ p.center {
text-align: center;
}
.hidden[aria-hidden] {
display: none;
}
@ -983,3 +988,89 @@ h3 + div {
border-radius: 2px;
border: 1px solid black;
}
.cms-print-text-container {
position: absolute;
width: 400px;
height: 200px;
}
/* sorry, I tried but I couldn't get it to work without copying everything for each text */
.cms-print-text-1 {
font: xx-small sans-serif;
position: absolute;
top: var(--cms-text-position-top);
left: var(--cms-text-position-left);
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: var(--cms-text-size);
color: black;
opacity: 0;
transition: opacity 1s ease-in-out;
animation: cmsPrintTextAnimation 8s infinite 0s;
}
.cms-print-text-2 {
font: xx-small sans-serif;
position: absolute;
top: var(--cms-text-position-top);
left: var(--cms-text-position-left);
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: var(--cms-text-size);
color: black;
opacity: 0;
transition: opacity 1s ease-in-out;
animation: cmsPrintTextAnimation 8s infinite 2s;
}
.cms-print-text-3 {
font: xx-small sans-serif;
position: absolute;
top: var(--cms-text-position-top);
left: var(--cms-text-position-left);
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: var(--cms-text-size);
color: black;
opacity: 0;
transition: opacity 1s ease-in-out;
animation: cmsPrintTextAnimation 8s infinite 4s;
}
.cms-print-text-4 {
font: xx-small sans-serif;
position: absolute;
top: var(--cms-text-position-top);
left: var(--cms-text-position-left);
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
font-size: var(--cms-text-size);
color: black;
opacity: 0;
transition: opacity 1s ease-in-out;
animation: cmsPrintTextAnimation 8s infinite 6s;
}
@keyframes cmsPrintTextAnimation {
0%, 25%, 100% {
opacity: 0;
}
8%, 16% {
opacity: 1;
}
}
.cms