Der Dokumentrahmen

doc – Rahmen des Arbeitsblatts

• Umschließt den gesamten Inhalt und setzt Seitenränder, Kopf- und Fußzeile (mit Name/Datum-Feldern und Logo).
• Parameter title: Titel in der Kopfzeile.
• Parameter art: bestimmt den Bearbeitungsmodus und damit die Farbgebung:
  • "Erarbeitung" (Standard) – blau,
  • "Übung" – grün,
  • "Sicherung" – rot (typisch für einen Wissensspeicher).
• Parameter code: Kürzel für den inf-schule-Shortlink/QR-Code in Kopf- und Fußzeile.

#doc(title: "Wissensspeicher Klassen", art: "Sicherung", code: "abcd")[
  // ... Inhalt ...
]

title – Überschrift im inf-schule-Stil

• Zentrierte Überschrift. Parameter: string (Text), optional textsize (Standard: 30pt).

#title("Das World Wide Web")
#title("Kleinere Überschrift", textsize: 18pt)

Überschriften innerhalb des Blatts

ueberschriftLernstrecke – große Abschnittsüberschrift

• Große, farbige Überschrift (Farbe je nach Modus).

#ueberschriftLernstrecke("Wissensspeicher Netzwerk")

ueberschriftAbschnitt – kleinere Überschrift

• Kleinere, farbige Überschrift. Optional optional: true (markiert einen Zusatz-Abschnitt) und color.

#ueberschriftAbschnitt("Vertiefung", optional: true)

Boxen

infsbox – Standardisierte Textbox

• Erster Parameter title: Überschrift (weiße Schrift auf farbigem Balken, Farbe je nach Modus).
• Jedes weitere Argument bildet eine eigene Spalte innerhalb der Box.

#infsbox("Aufgaben",
  [1) Erkläre den Begriff „Website“.],
  [2) Nenne zwei Browser.]
)

#infsbox("Eine Spalte")[Inhalt der Box]

information – Infobox

• Hellblaue Box mit i-Symbol für Hinweise.

#information[Dieses Arbeitsblatt kannst du ausdrucken oder digital ausfüllen.]

plain – schlichte Box

• Graue Box ohne Symbol.

#plain[Ein neutraler Hinweis ohne besondere Auszeichnung.]

sicherung – Wissensbox

• Rote Box mit Überschrift (Standard: Wissen) zum Festhalten von Ergebnissen. Optional ueberschrift.

#sicherung[Ein Objekt ist ein Exemplar einer Klasse.]
#sicherung(ueberschrift: "Merke")[...]

zielsetzung – Zielbox

• Grüne Box für die Lernziele einer Einheit.

#zielsetzung[In dieser Einheit lernst du, was Klassen und Objekte sind.]

Hervorhebungen

fachbegriff – Fachbegriff hervorheben

• Setzt den Begriff fett und in der Akzentfarbe Rot.

Ein #fachbegriff("Objekt") ist ein Exemplar einer #fachbegriff("Klasse").

Aufgaben

aufgabe – nummerierte Aufgabe

• Erstellt eine Aufgabe mit Nummer (oder Buchstabe) in einem farbigen Kreis.
• Optionale Parameter: optional: true (Zusatzaufgabe, mit Stern), gruppe: true (Gruppenarbeit-Symbol), gridView: true (mehrere Teilaufgaben nebeneinander).

#aufgabe(1)[Erkläre den Begriff „Objekt“.]
#aufgabe(2, optional: true)[Finde ein eigenes Beispiel.]

Ausfüll-Elemente

Diese Elemente sind der Kern eines Wissensspeichers: Im Ausdruck bleiben sie leer zum Ausfüllen, in der Lösungsansicht des Editors werden die hinterlegten Antworten angezeigt.

schreiblinie – Schreiblinie

• Der Klammer-Inhalt wird als Beschriftung über die Linie gesetzt.
• Mit length wird die Linienlänge festgelegt (Standard: 100%).

#schreiblinie[Eine Klasse ist]
#schreiblinie[]
#schreiblinie(length: 60%)[Datum:]

ausfuellText – mehrere Schreiblinien

• Erzeugt mehrere Schreiblinien auf einmal. Parameter anzahlLinien (Standard: 3) und optional anfang (Beschriftung der ersten Linie).

#ausfuellText(anzahlLinien: 3, anfang: [Merke:])

gap – Lücke im Fließtext

• Fügt eine Ausfülllücke ein. Die als erstes Argument angegebene Antwort erscheint nur in der Lösungsansicht, sonst steht dort eine Linie.
• Die Breite richtet sich nach der Antwort; mit factor oder size lässt sie sich anpassen.

Ein Objekt ist ein #gap("Exemplar") einer Klasse.
Ein Objekt ist ein #gap("Exemplar", size: 4cm) einer Klasse.

lueckenText / schnipselHaufen – Lückentext mit Schnipseln

• lueckenText umschließt einen Text mit mehreren gap-Lücken. Mit zeigeSchnipsel werden die Lösungswörter als durchmischte „Schnipsel“ als Auswahlhilfe angeboten (Position: top, bottom, left oder right).

#lueckenText(zeigeSchnipsel: bottom)[
  Ein #gap("Objekt") ist ein Exemplar einer #gap("Klasse").
]

lueckenCode – Quellcode mit Lücken und Syntaxhervorhebung

• Erwartet einen Raw-Codeblock mit Sprachangabe und hebt den vollständigen bereinigten Quellcode hervor.
• Lösungen werden im Code mit §§ umschlossen. In der Schülerfassung erscheinen dort Lücken; in der Lösungsfassung wird der hervorgehobene Code mit markierten Lösungen angezeigt.
• Die Lücken sind standardmäßig etwa 1,5-mal so breit wie ihre Lösung. Mit factor lässt sich dieser Faktor verändern; der kleinste mögliche Wert ist 1.
• Eine Markierung darf nicht über mehrere Zeilen reichen. Für die Einrückung Leerzeichen statt Tabulatoren verwenden und lange Codezeilen vermeiden, da sie nicht automatisch umgebrochen werden.

#lueckenCode(
  ```kotlin
  fun §§main§§() {
      §§val§§ stapel = Stapel()
      stapel.§§mischen§§()
  }
  ```
)

karos – Schreibkästchen

• Erzeugt ein 0,5 cm-Raster. Parameter width, height; optional ausrichtung (left | center | right, Standard: center).

#karos(10cm, 6cm)
#karos(8cm, 4cm, ausrichtung: left)

Sprechblasen

sprechblase – Sprechblase mit Öffnung und Spitze

• Parameter u.a.:
  • seite: "oben" | "unten" | "links" | "rechts" (Standard: "oben")
  • offenBeginn: Position der Öffnung (relativ, Standard: 50%), offenBreite: Breite der Öffnung
  • breite, hoehe: Außenmaße der Blase
  • spitzeX, spitzeY: Offsets der Spitze

#sprechblase(seite: "oben", breite: 10cm, hoehe: 1.5cm, spitzeX: 1cm, spitzeY: 1cm)[
  Tipp: Eine URL identifiziert eine Ressource.
]

Lösungen ein- und ausblenden

privat / public

• privat zeigt Inhalt nur in der Lösungsansicht (dort rot umrandet), sonst wahlweise einen Ersatz über ansonsten. gap ist damit umgesetzt.
• public ist die Umkehrung: Inhalt immer sichtbar, in der Lösungsansicht kann mit ansonsten ein Alternativtext gezeigt werden.

Das Ergebnis lautet #privat("42", ansonsten: [_______]).

Farben des Templates

Die Template-Farben stehen als Konstanten bereit, z.B. für eigene Auszeichnungen:

• infsblueDark, infsblueLight – Blautöne (Erarbeitung)
• infsgreen – Grün (Übung)
• infsred – Rot (Sicherung, Akzentfarbe)
• infsyellow, lightGray, darkGray

#text(fill: infsblueDark)[Ein blauer Hinweis]

Standard-Typst-Elemente

Neben den Template-Funktionen kannst du das komplette Standard-Typst verwenden. Häufig gebraucht werden:

• Text: *fett*, _kursiv_, #text(...)[...]
• Überschriften: = Ebene 1, == Ebene 2
• Listen: - Punkt (ungeordnet), + Punkt (nummeriert)
• Bilder: #image("bild.png", width: 300pt)
• Layout: #grid(...), #table(...), #align(center)[...], #block[...], #box[...]
• Abstände: #v(1em) (vertikal), #h(1em) (horizontal), #pagebreak()
• Linien: #line(length: 100%)

Hinweis: Arbeitsheft-Template

Für die gedruckten Arbeitshefte (z.B. im kids-Bereich) gibt es ein eigenes, spezialisiertes Template (templateArbeitsheft.typ) mit abweichenden Funktionen (ahDoc, ahAufgabe, ahSicherung u.a.). Für einzelne Arbeitsblätter und Wissensspeicher wird das hier beschriebene Template verwendet.

Vollständiges Beispiel

Das folgende Beispiel verwendet die wichtigsten Elemente in einem Sicherungs-Arbeitsblatt. Zuerst der Quellcode:

#import "/assets/typ/templateDefault.typ": *

#doc(title: "Element-Übersicht", art: "Sicherung", code: "typst")[

  #ueberschriftLernstrecke("ueberschriftLernstrecke")
  #ueberschriftAbschnitt("ueberschriftAbschnitt")

  Standard-Typst: *fett*, _kursiv_, ein #fachbegriff("fachbegriff") und ein
  #link("https://inf-schule.de")[link].

  - erster Listenpunkt
  - zweiter Listenpunkt

  #infsbox("infsbox mit einer Spalte")[
    Eine Box kann eine oder mehrere Spalten haben. Ein #fachbegriff("gap")
    ist eine Lücke: #gap("Antwort") erscheint nur in der Lösungsansicht.
  ]

  #infsbox("infsbox mit zwei Spalten",
    [
      #schreiblinie[schreiblinie mit Beschriftung]
      #schreiblinie[]
    ],
    [
      #ausfuellText(anzahlLinien: 2, anfang: [ausfuellText:])
    ]
  )

  #infsbox("gap in einer Tabelle")[
    #table(
      columns: (auto, 1fr, 1fr),
      align: left + horizon,
      table.header([*Datentyp*], [*Bedeutung*], [*Beispiel*]),
      [#gap("Int")], [ganze Zahl], [#gap("42")],
      [#gap("String")], [Zeichenkette], [#gap("\"Herz\"")],
    )
  ]

  #information[information: Hinweis-Box mit i-Symbol.]
  #plain[plain: schlichte, graue Box.]
  #sicherung[sicherung: rote Wissensbox.]
  #zielsetzung[zielsetzung: grüne Zielbox.]

  #ueberschriftAbschnitt("lueckenText mit Schnipseln")
  #lueckenText(zeigeSchnipsel: bottom)[
    Ein #gap("Objekt") ist ein Exemplar einer #gap("Klasse").
  ]

  #ueberschriftAbschnitt("karos (Schreibkästchen)")
  #karos(6cm, 2cm, ausrichtung: left)

  #aufgabe(1)[aufgabe: eine nummerierte Aufgabe.]
  #aufgabe(2, optional: true)[aufgabe mit optional: true (Zusatzaufgabe).]

  #sprechblase(seite: "oben", breite: 7cm, hoehe: 1.2cm, spitzeX: 1cm, spitzeY: 1cm)[
    sprechblase: ein Tipp in einer Blase.
  ]
]

Und so sieht das gerenderte Ergebnis aus (Button zum Herunterladen):