layout anpassungen

This commit is contained in:
florian committed 2026-10-03 12:26:28 +02:00
1 parent 5acf8ad0e7
commit 8295ab8ff9
9 files changed
+232 -10

No files matched your search

+22 -1
View File
@@ -51,6 +51,7 @@ def md_to_html(text, headings=None):
in_list = False
list_tag = None
used_ids = {}
sec_stack = [] # offene Sektionen (pro # mehr eine Ebene, eingerueckt)
def inline(s):
s = re.sub(r"`([^`]+)`", r"<code>\1</code>", s)
@@ -112,8 +113,18 @@ def md_to_html(text, headings=None):
used_ids[hid] = 0
if headings is not None:
headings.append((level, hid, text_h))
# tiefere Sektionen schliessen, bis die Ebene wieder passt
while sec_stack and sec_stack[-1] >= level:
out.append("</div>")
sec_stack.pop()
# ein # mehr als die umgebende Ueberschrift -> Stufe einruecken
if sec_stack:
out.append('<div class="sec">')
else:
out.append('<div class="sec0">')
out.append('<h%d id="%s">%s</h%d>'
% (level, hid, inline(_escape(text_h)), level))
sec_stack.append(level)
i += 1
continue
@@ -164,6 +175,9 @@ def md_to_html(text, headings=None):
i += 1
close_list()
while sec_stack:
out.append("</div>")
sec_stack.pop()
return "\n".join(out)
@@ -276,6 +290,7 @@ def render_page(raw, template, header_html="", footer_html=""):
anker_html = heading_nav(headings)
page = (template
.replace("{{titel}}", _escape(meta.get("titel", "")))
.replace("{{beschreibung}}", _escape(meta.get("beschreibung", "")))
.replace("{{inhalt}}", html))
if "{{anker}}" in template:
page = page.replace("{{anker}}", anker_html)
@@ -318,6 +333,11 @@ def export_site():
if f.endswith(".css"):
shutil.copy2(os.path.join(CSS_DIR, f), os.path.join(OUT_DIR, "css", f))
# Bilder (z.B. Logo/Favicon) nach output/images/ kopieren
img_src = os.path.join(ROOT, "images")
if os.path.isdir(img_src):
shutil.copytree(img_src, os.path.join(OUT_DIR, "images"), dirs_exist_ok=True)
footer_html = block_html(FOOTER_PAGE)
header_html = block_html(HEADER_PAGE)
@@ -443,6 +463,7 @@ ADMIN_HTML = """<!DOCTYPE html>
<div id="msg"></div>
<textarea id="editor" spellcheck="false">---
titel: Neue Seite
beschreibung: Kurze Seitenbeschreibung fuer Suchmaschinen (SEO).
---
Hier den Inhalt schreiben. **fett**, *kursiv*, [Link](seite.html), # Ueberschrift, - Liste.</textarea>
@@ -515,7 +536,7 @@ $("btn-new").onclick = async () => {
if (!slug) return msg("Bitte Namen eingeben.");
const d = await api("/api/page", {
method: "POST", headers: {"Content-Type": "application/json"},
body: JSON.stringify({slug, raw: "---\\ntitel: " + slug + "\\n---\\n\\nNeue Seite.\\n"})
body: JSON.stringify({slug, raw: "---\\ntitel: " + slug + "\\nbeschreibung: \\n---\\n\\nNeue Seite.\\n"})
});
if (d.ok) { $("newslug").value = ""; openPage(slug); }
else msg("Fehler: " + d.error);
+13 -2
View File
@@ -46,7 +46,7 @@ header {
--bg: #1a1a1a; /* sehr dunkles Grau */
--text: #ffffff; /* normaler Text weiss */
--dim: #909090; /* gedimmter Text (Footer, Zitate) */
--heading: #ff9500; /* Ueberschriften orange */
--heading: #00ff00; /* Ueberschriften gruen wie die erste Zeile */
--link: #66aaff; /* Links, gut lesbar auf schwarz */
--green: #00ff00; /* Prompt, Code */
--border: #333333;
@@ -112,7 +112,7 @@ main {
h1, h2, h3, h4, h5, h6 {
color: var(--heading);
text-shadow: 0 0 8px rgba(255, 149, 0, 0.35);
text-shadow: 0 0 8px rgba(0, 255, 0, 0.35);
letter-spacing: 1px;
font-size: 1rem; /* 14 px, ueberall gleiche Schriftgroesse */
font-weight: normal;
@@ -127,6 +127,17 @@ p {
margin: .8rem 0;
}
/* ---- Inhalt einruecken: ein # mehr als die uebergeordnete
Ueberschrift = eine Stufe (1.5rem) tiefer ---- */
main div.sec {
margin-left: 1.5rem;
}
main div.sec0 {
margin-left: 0;
}
/* ---- Anker-Navigation im Header (Links auf die Ueberschriften) ---- */
.anker-nav {
+6 -1
View File
@@ -1,5 +1,6 @@
---
titel: Willkommen
titel: hfg_linux_usergroup: free software for art and design
beschreibung: Die hfg_linux_usergroup ist eine Gemeinschaft der HFG Offenbach für freie Software, Open Source und digitale Souveränität in Kunst und Design.
---
# Was ist die hfg_linux_usergroup
@@ -13,9 +14,13 @@ Open Source fördert nicht nur gestalterische Freiheit, sondern auch eine kritis
Die nächsten Termine für den Herbst/Winter 2026 werden aktuell geplant:
## hfg_linux_usergroup_date_1_music
Platzhalter inhalt, um was geht es hier.
## hfg_linux_usergroup_date_2_image-editing
Platzhalter inhalt, um was geht es hier.
## hfg_linux_usergroup_date_3_coding-development
Platzhalter inhalt, um was geht es hier.
## hfg_linux_usergroup_date_4_3d-film-fotogrammetrie
Platzhalter inhalt, um was geht es hier.
# Wer ist die hfg_linux_usergroup
+13 -2
View File
@@ -46,7 +46,7 @@ header {
--bg: #1a1a1a; /* sehr dunkles Grau */
--text: #ffffff; /* normaler Text weiss */
--dim: #909090; /* gedimmter Text (Footer, Zitate) */
--heading: #ff9500; /* Ueberschriften orange */
--heading: #00ff00; /* Ueberschriften gruen wie die erste Zeile */
--link: #66aaff; /* Links, gut lesbar auf schwarz */
--green: #00ff00; /* Prompt, Code */
--border: #333333;
@@ -112,7 +112,7 @@ main {
h1, h2, h3, h4, h5, h6 {
color: var(--heading);
text-shadow: 0 0 8px rgba(255, 149, 0, 0.35);
text-shadow: 0 0 8px rgba(0, 255, 0, 0.35);
letter-spacing: 1px;
font-size: 1rem; /* 14 px, ueberall gleiche Schriftgroesse */
font-weight: normal;
@@ -127,6 +127,17 @@ p {
margin: .8rem 0;
}
/* ---- Inhalt einruecken: ein # mehr als die uebergeordnete
Ueberschrift = eine Stufe (1.5rem) tiefer ---- */
main div.sec {
margin-left: 1.5rem;
}
main div.sec0 {
margin-left: 0;
}
/* ---- Anker-Navigation im Header (Links auf die Ueberschriften) ---- */
.anker-nav {
Binary file not shown.

After

Width:  |  Height:  |  Size: 6.8 KiB

+148
View File
@@ -0,0 +1,148 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="212mm"
height="185mm"
viewBox="0 0 212 185"
version="1.1"
id="svg1"
inkscape:version="1.4 (e7c3feb100, 2024-10-09)"
sodipodi:docname="logo.svg"
xml:space="preserve"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg"><sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
inkscape:zoom="0.67528301"
inkscape:cx="300.6147"
inkscape:cy="567.16961"
inkscape:window-width="2560"
inkscape:window-height="1283"
inkscape:window-x="0"
inkscape:window-y="0"
inkscape:window-maximized="1"
inkscape:current-layer="g1" /><defs
id="defs1" /><g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"><g
id="g1"
inkscape:label="logo"><rect
style="fill:#bc6ec5;fill-opacity:1;stroke-width:0.436961"
id="rect1-6"
width="27.207493"
height="48.685009"
x="17.110464"
y="83.338158" /><rect
style="fill:#bc6ec5;fill-opacity:1;stroke-width:0.254324"
id="rect1-6-6"
width="17.513844"
height="25.62081"
x="7.3483195"
y="106.4026" /><rect
style="fill:#6cacb6;fill-opacity:1;stroke-width:0.744538"
id="rect1-2-3-2-2-1"
width="73.685966"
height="52.191757"
x="128.47047"
y="31.434856" /><rect
style="fill:#6cacb6;fill-opacity:1;stroke-width:0.303737"
id="rect1-2-3-2-2-1-4"
width="17.332495"
height="36.927048"
x="174.61983"
y="140.21355" /><rect
style="fill:#6cacb6;fill-opacity:1;stroke-width:0.335087"
id="rect1-2-3-2-2-1-4-6"
width="21.09514"
height="36.927048"
x="138.87154"
y="140.21284" /><rect
style="fill:#6cacb6;fill-opacity:1;stroke-width:0.325207"
id="rect1-2-3-2-2-1-4-6-4"
width="19.869507"
height="36.927048"
x="92.092537"
y="140.21284" /><rect
style="fill:#6cacb6;fill-opacity:1;stroke-width:0.340355"
id="rect1-2-3-2-2-1-4-6-4-4"
width="21.763668"
height="36.927048"
x="56.148205"
y="140.21284" /><rect
style="fill:#6cacb6;fill-opacity:1;stroke-width:1.22605"
id="rect1-2-3-2-2-1-3"
width="145.06674"
height="71.888435"
x="43.290218"
y="69.704735" /><rect
style="fill:#0d0d0b;fill-opacity:1;stroke-width:0.13182"
id="rect1-2-9"
width="10.990082"
height="10.968916"
x="152.58284"
y="35.083874" /><rect
style="fill:#0d0d0b;fill-opacity:1;stroke-width:0.0979278"
id="rect1-2-9-1"
width="9.4858952"
height="7.0134616"
x="164.40558"
y="71.279991" /><rect
style="fill:#0d0d0b;fill-opacity:1;stroke-width:0.0809229"
id="rect1-2-9-1-8"
width="6.4775219"
height="7.0134616"
x="182.83105"
y="71.279831" /><rect
style="fill:#0d0d0b;fill-opacity:1;stroke-width:0.15631"
id="rect1-2-9-9"
width="12.952992"
height="13.08592"
x="189.18622"
y="32.104492" /><rect
style="fill:#bc6ec5;fill-opacity:1;stroke-width:0.257236"
id="rect1"
width="35.229824"
height="13.030209"
x="128.47047"
y="22.358643" /><rect
style="fill:#6cadb6;fill-opacity:1;stroke-width:0.161179"
id="rect1-2"
width="13.831325"
height="13.030209"
x="162.7973"
y="22.358643" /><rect
style="fill:#bc6ec5;fill-opacity:1;stroke-width:0.161177"
id="rect1-2-3-2"
width="13.831325"
height="13.030209"
x="162.79794"
y="9.3847332" /><rect
style="fill:#6cacb6;fill-opacity:1;stroke-width:0.210201"
id="rect1-2-3-2-2"
width="23.524973"
height="13.030209"
x="128.4705"
y="9.3847332" /><rect
style="fill:#6babb5;fill-opacity:1;stroke-width:0.294245"
id="rect1-2-3-2-7"
width="25.738684"
height="23.336674"
x="176.41765"
y="9.3847332" /><rect
style="fill:#bc6ec5;fill-opacity:1;stroke-width:0.153906"
id="rect1-2-3"
width="12.611309"
height="13.030209"
x="176.41748"
y="22.358643" /></g></g></svg>

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

+27 -3
View File
@@ -3,7 +3,10 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Willkommen</title>
<title>hfg_linux_usergroup: free software for art and design</title>
<meta name="description" content="Die hfg_linux_usergroup ist eine Gemeinschaft der HFG Offenbach für freie Software, Open Source und digitale Souveränität in Kunst und Design.">
<link rel="icon" type="image/png" href="images/hfglogo.png">
<link rel="icon" type="image/svg+xml" href="images/logo.svg">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
@@ -18,23 +21,44 @@
<nav class="anker-nav"><ul><li><a href="#was-ist-die-hfg-linux-usergroup">Was ist die hfg_linux_usergroup</a></li><li><a href="#naechste-treffen">Nächste Treffen</a><ul><li><a href="#hfg-linux-usergroup-date-1-music">hfg_linux_usergroup_date_1_music</a></li><li><a href="#hfg-linux-usergroup-date-2-image-editing">hfg_linux_usergroup_date_2_image-editing</a></li><li><a href="#hfg-linux-usergroup-date-3-coding-development">hfg_linux_usergroup_date_3_coding-development</a></li><li><a href="#hfg-linux-usergroup-date-4-3d-film-fotogrammetrie">hfg_linux_usergroup_date_4_3d-film-fotogrammetrie</a></li></ul></li><li><a href="#wer-ist-die-hfg-linux-usergroup">Wer ist die hfg_linux_usergroup</a></li><li><a href="#was-sind-die-ziele-der-hfg-linux-usergroup">Was sind die Ziele der hfg_linux_usergroup</a></li><li><a href="#das-hfg-os">Das hfg_OS_</a></li></ul></nav>
</header>
<main>
<h1>Willkommen</h1>
<h1 id="was-ist-die-hfg-linux-usergroup">Was ist die hfg_linux_usergroup</h1>
<div class="sec0">
<h1 id="was-ist-die-hfg-linux-usergroup">Was ist die hfg_linux_usergroup</h1>
<p>Die hfg_linux_usergroup ist eine diverse Gemeinschaft der HFG Offenbach, die sich für freie Software, Open Source und digitale Souveränität einsetzt.</p>
<p>Hintergrund ist die zentrale Bedeutung von Open Source für Kunst und Gestaltung: Es ermöglicht Demokratisierung, Transparenz, Chancengleichheit und Weiterentwicklung. Durch offene Lizenzen und frei zugängliche Software werden Wissen und kreative Prozesse entmonopolisiert. Künstler:innen und Designer:innen sind so nicht länger abhängig von proprietärer Software – die oft mit hohen Kosten, geschlossenen Systemen, Abhängigkeiten oder Abos einhergeht. Hinzu kommen ethische Bedenken wie Datenschutz oder Überwachungskapitalismus. Open Source fördert nicht nur gestalterische Freiheit, sondern auch eine kritische Reflexion über Technologie selbst.</p>
</div>
<div class="sec0">
<h1 id="naechste-treffen">Nächste Treffen</h1>
<p>Die nächsten Termine für den Herbst/Winter 2026 werden aktuell geplant:</p>
<div class="sec">
<h2 id="hfg-linux-usergroup-date-1-music">hfg_linux_usergroup_date_1_music</h2>
<p>Platzhalter inhalt, um was geht es hier.</p>
</div>
<div class="sec">
<h2 id="hfg-linux-usergroup-date-2-image-editing">hfg_linux_usergroup_date_2_image-editing</h2>
<p>Platzhalter inhalt, um was geht es hier.</p>
</div>
<div class="sec">
<h2 id="hfg-linux-usergroup-date-3-coding-development">hfg_linux_usergroup_date_3_coding-development</h2>
<p>Platzhalter inhalt, um was geht es hier.</p>
</div>
<div class="sec">
<h2 id="hfg-linux-usergroup-date-4-3d-film-fotogrammetrie">hfg_linux_usergroup_date_4_3d-film-fotogrammetrie</h2>
<p>Platzhalter inhalt, um was geht es hier.</p>
</div>
</div>
<div class="sec0">
<h1 id="wer-ist-die-hfg-linux-usergroup">Wer ist die hfg_linux_usergroup</h1>
<p>Alle, die sich für Linux, Open Source und die Förderung von Wissen in Kunst und Design interessieren, können Teil der Gemeinschaft werden oder an den Treffen teilnehmen. Die hfg_linux_usergroup wurde von den beiden HFG-Lehrenden Sebastian Kujas und Florian Albrecht-Schoeck gegründet und wird aktuell von ihnen moderiert.</p>
</div>
<div class="sec0">
<h1 id="was-sind-die-ziele-der-hfg-linux-usergroup">Was sind die Ziele der hfg_linux_usergroup</h1>
<p>Ziel ist es, den Einsatz freier Software in Kunst und Design zu fördern. Durch Workshops, den Aufbau von Wissensdatenbanken, Austausch und Debatten sollen Eigenermächtigung und Verantwortung für Technologie wiederhergestellt werden. Dazu entwickeln wir gemeinsam ein eigenes Linux-basiertes Betriebssystem und unterstützen bei allen Schritten des Wechsels zu freier Software.</p>
</div>
<div class="sec0">
<h1 id="das-hfg-os">Das hfg_OS_</h1>
<p>Das hfg_OS ist ein auf Debian 13 (Trixie) basierendes, Linux-basiertes Betriebssystem. Es wurde speziell für die Bedürfnisse von Künstler:innen und Designer:innen angepasst und wird kontinuierlich weiterentwickelt.</p>
<p>Bald verfügbar: hfg_OS_Falbella-2026-10</p>
</div>
</main>
<footer>
<p>Dieser Footer-Baustein wird automatisch an das Ende <strong>aller</strong> Seiten gesetzt. Zum Beispiel mit Links: <a href="index.html">Startseite</a></p>
+3 -1
View File
@@ -4,6 +4,9 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{titel}}</title>
<meta name="description" content="{{beschreibung}}">
<link rel="icon" type="image/png" href="images/hfglogo.png">
<link rel="icon" type="image/svg+xml" href="images/logo.svg">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
@@ -13,7 +16,6 @@
<nav class="anker-nav">{{anker}}</nav>
</header>
<main>
<h1>{{titel}}</h1>
{{inhalt}}
</main>
<footer>