mirror of https://github.com/jpanther/congo.git
Merge pull request #631 from max-alletsee/samples-de
🌐 Translation of the example site into German
pull/640/head
James Panther
GitHub
commit
884dcca653
|
|
@ -0,0 +1,28 @@
|
||||||
|
languageCode = "de-de"
|
||||||
|
languageName = "Deutsch (Deutschland)"
|
||||||
|
weight = 4
|
||||||
|
|
||||||
|
title = "Congo"
|
||||||
|
copyright = "© 2023 Congo contributors"
|
||||||
|
|
||||||
|
[params]
|
||||||
|
isoCode = "de-de"
|
||||||
|
displayName = ":de:"
|
||||||
|
rtl = false
|
||||||
|
|
||||||
|
dateFormat = "2. January 2006"
|
||||||
|
|
||||||
|
mainSections = ["samples"]
|
||||||
|
description = "Ein leistungsstarkes, leichtgewichtiges Theme für Hugo, das mit Tailwind CSS erstellt wurde."
|
||||||
|
|
||||||
|
[author]
|
||||||
|
name = "Congo"
|
||||||
|
image = "img/author.jpg"
|
||||||
|
headline = "Nicht dein Durschnitts-Theme!"
|
||||||
|
bio = "Dies ist ein Beispiel für eine Autorenbiografie, und obwohl hier ein Stockfoto eines Hundes zu sehen ist, wurde dieser Artikel tatsächlich von einem Menschen verfasst. :dog:"
|
||||||
|
links = [
|
||||||
|
{ twitter = "https://twitter.com/" },
|
||||||
|
{ facebook = "https://facebook.com/" },
|
||||||
|
{ linkedin = "https://linkedin.com/" },
|
||||||
|
{ youtube = "https://youtube.com/" },
|
||||||
|
]
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
# -- Main Menu --
|
||||||
|
# The main menu is displayed in the header at the top of the page.
|
||||||
|
# Acceptable parameters are name, pageRef, page, url, title, weight.
|
||||||
|
#
|
||||||
|
# The simplest menu configuration is to provide:
|
||||||
|
# name = The name to be displayed for this menu link
|
||||||
|
# pageRef = The identifier of the page or section to link to
|
||||||
|
#
|
||||||
|
# By default the menu is ordered alphabetically. This can be
|
||||||
|
# overridden by providing a weight value. The menu will then be
|
||||||
|
# ordered by weight from lowest to highest.
|
||||||
|
|
||||||
|
[[main]]
|
||||||
|
name = "Dokumentation"
|
||||||
|
pageRef = "docs"
|
||||||
|
weight = 10
|
||||||
|
|
||||||
|
[[main]]
|
||||||
|
name = "Beispiele"
|
||||||
|
pageRef = "samples"
|
||||||
|
weight = 20
|
||||||
|
|
||||||
|
[[main]]
|
||||||
|
name = "Genutzt von"
|
||||||
|
pageRef = "users"
|
||||||
|
weight = 30
|
||||||
|
|
||||||
|
[[main]]
|
||||||
|
name = "GitHub"
|
||||||
|
url = "https://github.com/jpanther/congo"
|
||||||
|
weight = 40
|
||||||
|
[main.params]
|
||||||
|
icon = "github"
|
||||||
|
showName = false
|
||||||
|
target = "_blank"
|
||||||
|
|
||||||
|
[[main]]
|
||||||
|
identifier = "search"
|
||||||
|
weight = 99
|
||||||
|
[main.params]
|
||||||
|
action = "search"
|
||||||
|
|
||||||
|
# -- Footer Menu --
|
||||||
|
# The footer menu is displayed at the bottom of the page, just before
|
||||||
|
# the copyright notice. Configure as per the main menu above.
|
||||||
|
|
||||||
|
# [[footer]]
|
||||||
|
# name = "Tags"
|
||||||
|
# pageRef = "tags"
|
||||||
|
# weight = 10
|
||||||
|
|
@ -0,0 +1,29 @@
|
||||||
|
---
|
||||||
|
title: "Willkommen bei Congo! :tada:"
|
||||||
|
description: "Dies ist eine Demo des Congo-Themes für Hugo."
|
||||||
|
---
|
||||||
|
|
||||||
|
{{< lead >}}
|
||||||
|
Ein mächtiges und gleichzeitig leichtes Theme für Hugo, das mit Tailwind CSS erstellt wurde.
|
||||||
|
{{< /lead >}}
|
||||||
|
|
||||||
|
Dies ist eine Demo-Site, die vollständig mit Congo erstellt wurde. Sie enthält auch eine vollständige [Theme-Dokumentation]({{< ref path="docs" lang="en" >}}). Congo ist flexibel und eignet sich sowohl für statische seitenbasierte Inhalte (wie diese Demo) als auch für einen traditionellen Blog mit einem Feed der letzten Beiträge.
|
||||||
|
|
||||||
|
<div class="flex px-4 py-2 mb-8 text-base rounded-md bg-primary-100 dark:bg-primary-900">
|
||||||
|
<span class="flex items-center pe-3 text-primary-400">
|
||||||
|
{{< icon "triangle-exclamation" >}}
|
||||||
|
</span>
|
||||||
|
<span class="flex items-center justify-between grow dark:text-neutral-300">
|
||||||
|
<span class="prose dark:prose-invert">Dies ist eine Demo des <code id="layout">page</code>-Layouts.</span>
|
||||||
|
<button
|
||||||
|
id="switch-layout-button"
|
||||||
|
class="px-4 !text-neutral !no-underline rounded-md bg-primary-600 hover:!bg-primary-500 dark:bg-primary-800 dark:hover:!bg-primary-700"
|
||||||
|
>
|
||||||
|
Layout ändern ↻
|
||||||
|
</button>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{{< figure src="festivities.svg" class="m-auto mt-6 max-w-prose" >}}
|
||||||
|
|
||||||
|
Schau dir die [Beispielseiten]({{< ref "samples" >}}) an, um ein Gefühl für die Möglichkeiten von Congo zu bekommen. Wenn dir gefällt, was du siehst, dann schau dir sich das Projekt auf [Github](https://github.com/jpanther/congo) an oder lies die [Installationsanleitung]({{< ref path="docs/installation" lang="en">}}), um loszulegen.
|
||||||
|
|
@ -0,0 +1,18 @@
|
||||||
|
---
|
||||||
|
title: "Beispiele für Inhalte"
|
||||||
|
description: "Sieh dir an, was mit Congo möglich ist."
|
||||||
|
|
||||||
|
cascade:
|
||||||
|
showEdit: false
|
||||||
|
showSummary: true
|
||||||
|
---
|
||||||
|
|
||||||
|
{{< lead >}}
|
||||||
|
Congo erweckt deinen Inhalt zum Leben. :heart_eyes:
|
||||||
|
{{< /lead >}}
|
||||||
|
|
||||||
|
Dieser Abschnitt enthält einige Demoseiten, die zeigen, wie Congo verschiedene Arten von Inhalten wiedergibt. Sie können auch eine Beispielseite für ein [Taxonomieverzeichnis]({{< ref "tags" >}}) sehen.
|
||||||
|
|
||||||
|
_**Hinweis:** Diese Seite ist nur eine standardmäßige Congo-Artikelauflistung und Hugo wurde so konfiguriert, dass er einen Inhaltstyp "Beispiele" generiert und Artikelzusammenfassungen anzeigt._
|
||||||
|
|
||||||
|
---
|
||||||
|
|
@ -0,0 +1,85 @@
|
||||||
|
---
|
||||||
|
title: "Charts"
|
||||||
|
date: 2019-03-06
|
||||||
|
description: "Leitfaden zur Verwendung von Chart.js mit Congo"
|
||||||
|
summary: "Congo enthält Chart.js für leistungsstarke Charts und Datenvisualisierungen."
|
||||||
|
tags: ["Chart", "Beispiele", "Graph", "Shortcodes"]
|
||||||
|
---
|
||||||
|
|
||||||
|
Congo bietet Unterstützung für Chart.js unter Verwendung des Shortcodes `chart`. Füge einfach das Chart-Markup in den Shortcode ein. Congo gestaltet die Charts automatisch so, dass sie der Konfiguration des Parameters `colorScheme` entsprechen. Die Farben können jedoch mit der normalen Chart.js-Syntax angepasst werden.
|
||||||
|
|
||||||
|
Weitere Details findest du in der [Chart-Shortcode-Dokumentation]({{< ref path="docs/shortcodes#chart" lang="en" >}}).
|
||||||
|
|
||||||
|
Die folgenden Beispiele sind eine kleine Auswahl aus der [offiziellen Chart.js-Dokumentation](https://www.chartjs.org/docs/latest/samples). Du kannst auch [die Quelle der Seite](https://raw.githubusercontent.com/jpanther/congo/dev/exampleSite/content/samples/charts/index.de.md) auf GitHub aufrufen, um das Markup zu sehen.
|
||||||
|
|
||||||
|
## Säulendiagramm
|
||||||
|
|
||||||
|
<!-- prettier-ignore-start -->
|
||||||
|
{{< chart >}}
|
||||||
|
type: 'bar',
|
||||||
|
data: {
|
||||||
|
labels: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli'],
|
||||||
|
datasets: [{
|
||||||
|
label: 'Mein erster Datensatz',
|
||||||
|
data: [65, 59, 80, 81, 56, 55, 40],
|
||||||
|
backgroundColor: [
|
||||||
|
'rgba(255, 99, 132, 0.2)',
|
||||||
|
'rgba(255, 159, 64, 0.2)',
|
||||||
|
'rgba(255, 205, 86, 0.2)',
|
||||||
|
'rgba(75, 192, 192, 0.2)',
|
||||||
|
'rgba(54, 162, 235, 0.2)',
|
||||||
|
'rgba(153, 102, 255, 0.2)',
|
||||||
|
'rgba(201, 203, 207, 0.2)'
|
||||||
|
],
|
||||||
|
borderColor: [
|
||||||
|
'rgb(255, 99, 132)',
|
||||||
|
'rgb(255, 159, 64)',
|
||||||
|
'rgb(255, 205, 86)',
|
||||||
|
'rgb(75, 192, 192)',
|
||||||
|
'rgb(54, 162, 235)',
|
||||||
|
'rgb(153, 102, 255)',
|
||||||
|
'rgb(201, 203, 207)'
|
||||||
|
],
|
||||||
|
borderWidth: 1
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
{{< /chart >}}
|
||||||
|
<!-- prettier-ignore-end -->
|
||||||
|
|
||||||
|
## Linien-Diagramm
|
||||||
|
|
||||||
|
<!-- prettier-ignore-start -->
|
||||||
|
{{< chart >}}
|
||||||
|
type: 'line',
|
||||||
|
data: {
|
||||||
|
labels: ['Januar', 'Februar', 'März', 'April', 'Mai', 'Juni', 'Juli'],
|
||||||
|
datasets: [{
|
||||||
|
label: 'Mein erster Datensatz',
|
||||||
|
data: [65, 59, 80, 81, 56, 55, 40],
|
||||||
|
tension: 0.2
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
{{< /chart >}}
|
||||||
|
<!-- prettier-ignore-end -->
|
||||||
|
|
||||||
|
## Doughnut-Chart
|
||||||
|
|
||||||
|
<!-- prettier-ignore-start -->
|
||||||
|
{{< chart >}}
|
||||||
|
type: 'doughnut',
|
||||||
|
data: {
|
||||||
|
labels: ['Rot', 'Blau', 'Gelb'],
|
||||||
|
datasets: [{
|
||||||
|
label: 'Mein erster Datensatz',
|
||||||
|
data: [300, 50, 100],
|
||||||
|
backgroundColor: [
|
||||||
|
'rgba(255, 99, 132, 0.7)',
|
||||||
|
'rgba(54, 162, 235, 0.7)',
|
||||||
|
'rgba(255, 205, 86, 0.7)'
|
||||||
|
],
|
||||||
|
borderWidth: 0,
|
||||||
|
hoverOffset: 4
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
{{< /chart >}}
|
||||||
|
<!-- prettier-ignore-end -->
|
||||||
|
|
@ -0,0 +1,92 @@
|
||||||
|
---
|
||||||
|
title: "Diagramme und Flussdiagramme"
|
||||||
|
date: 2019-03-06
|
||||||
|
description: "Leitfaden zur Verwendung von Mermaid in Congo"
|
||||||
|
summary: "Mit Mermaid ist es einfach, Diagramme und Flussdiagramme zu Artikeln hinzuzufügen."
|
||||||
|
tags: ["Mermaid", "Beispiele", "Diagramm", "Shortcodes"]
|
||||||
|
---
|
||||||
|
|
||||||
|
Mermaid-Diagramme werden in Congo mit dem Shortcode `mermaid` unterstützt. Füge einfach das Diagramm-Markup in den Shortcode ein. Congo gestaltet Mermaid-Diagramme automatisch so, dass sie der Konfiguration des Parameters `colorScheme` entsprechen.
|
||||||
|
|
||||||
|
Weitere Details findest du in der [Mermaid-Shortcode-Dokumentation]({{< ref path="docs/shortcodes#mermaid" lang="en">}}).
|
||||||
|
|
||||||
|
Die folgenden Beispiele sind eine kleine Auswahl aus der [offiziellen Mermaid-Dokumentation](https://mermaid-js.github.io/mermaid/). Du kannst auch [die Quelle der Seite](https://raw.githubusercontent.com/jpanther/congo/dev/exampleSite/content/samples/diagrams-flowcharts/index.de.md) auf GitHub aufrufen, um das Markup zu sehen.
|
||||||
|
|
||||||
|
## Flussdiagramm
|
||||||
|
|
||||||
|
{{< mermaid >}}
|
||||||
|
graph TD
|
||||||
|
A[Weihnachten] -->|Erhalte Geld| B(Geh einkaufen)
|
||||||
|
B --> C{Lass mich nachdenken}
|
||||||
|
B --> G[/Sonstiges/]
|
||||||
|
C ==>|Eins| D[Laptop]
|
||||||
|
C -->|Zwei| E[iPhone]
|
||||||
|
C -->|Drei| F[Auto]
|
||||||
|
subgraph Section
|
||||||
|
C
|
||||||
|
D
|
||||||
|
E
|
||||||
|
F
|
||||||
|
G
|
||||||
|
end
|
||||||
|
{{< /mermaid >}}
|
||||||
|
|
||||||
|
## Sequenzdiagramm
|
||||||
|
|
||||||
|
{{< mermaid >}}
|
||||||
|
sequenceDiagram
|
||||||
|
autonumber
|
||||||
|
par Action 1
|
||||||
|
Alice->>John: Hallo John, wie geht es dir?
|
||||||
|
and Action 2
|
||||||
|
Alice->>Bob: Hallo Bob, wie geht es dir?
|
||||||
|
end
|
||||||
|
Alice->>+John: Hallo John, wie geht es dir?
|
||||||
|
Alice->>+John: John, kannst du mich hören?
|
||||||
|
John-->>-Alice: Hi Alice, ich kann dich hören!
|
||||||
|
Note right of John: John ist aufmerksam
|
||||||
|
John-->>-Alice: Mir geht es gut!
|
||||||
|
loop Jede Minute
|
||||||
|
John-->Alice: Super!
|
||||||
|
end
|
||||||
|
{{< /mermaid >}}
|
||||||
|
|
||||||
|
## Klassendiagramm
|
||||||
|
|
||||||
|
{{< mermaid >}}
|
||||||
|
classDiagram
|
||||||
|
Tier "1" <|-- Ente
|
||||||
|
Tier <|-- Fisch
|
||||||
|
Tier <--o Zebra
|
||||||
|
Tier : +int alter
|
||||||
|
Tier : +String geschlecht
|
||||||
|
Tier: +istSaeugetier()
|
||||||
|
Tier: +paaren()
|
||||||
|
class Ente{
|
||||||
|
+String schnabelFarbe
|
||||||
|
+schwimmen()
|
||||||
|
+quaken()
|
||||||
|
}
|
||||||
|
class Fisch{
|
||||||
|
-int groesseInFuss
|
||||||
|
-canFressen()
|
||||||
|
}
|
||||||
|
class Zebra{
|
||||||
|
+bool ist_wild
|
||||||
|
+rennen()
|
||||||
|
}
|
||||||
|
{{< /mermaid >}}
|
||||||
|
|
||||||
|
## Entitäts-Beziehungs-Diagramm
|
||||||
|
|
||||||
|
{{< mermaid >}}
|
||||||
|
erDiagram
|
||||||
|
KUNDE }|..|{ LIEFER-ADRESSE : hat
|
||||||
|
KUNDE ||--o{ BESTELLUNG : platziert
|
||||||
|
KUNDE ||--o{ RECHNUNG : "zustaendig fuer"
|
||||||
|
LIEFER-ADRESSE ||--o{ BESTELLUNG : erhaelt
|
||||||
|
RECHNUNG ||--|{ BESTELLUNG : "deckt ab"
|
||||||
|
BESTELLUNG ||--|{ BESTELLTES-PRODUKT : enthaelt
|
||||||
|
PRODUKT-KATEGORIE ||--|{ PRODUKT : enthaelt
|
||||||
|
PRODUKT ||--o{ BESTELLTES-PRODUKT : "bestellt in"
|
||||||
|
{{< /mermaid >}}
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
---
|
||||||
|
title: "Emoji :parachute:"
|
||||||
|
date: 2019-03-05
|
||||||
|
description: "Leitfaden zur Benutzung von Emoji in Congo"
|
||||||
|
summary: "📖🏞️🧗🏽🐉🧙🏽♂️🧚🏽👸"
|
||||||
|
tags: ["Emoji", "Beispiele"]
|
||||||
|
---
|
||||||
|
|
||||||
|
Congo unterstützt standardmäßig Emoji. Emoji können in Titeln, Menüpunkten und Artikelinhalten verwendet werden.
|
||||||
|
|
||||||
|
{{< alert >}}
|
||||||
|
**Hinweis:** Das Rendering dieser Glyphen hängt vom Browser und von der Plattform ab. Um die Emoji zu gestalten, kannst du entweder eine Emoji-Schriftart eines Drittanbieters oder einen Font Stack verwenden.
|
||||||
|
{{< /alert >}}
|
||||||
|
|
||||||
|
Die Ersetzung von Emoji erfolgt in Congo automatisch, so dass du in deinen Inhalten und im Front Matter Kurzzeichen verwenden können, die zum Zeitpunkt der Erstellung in die entsprechenden Symbole umgewandelt werden.
|
||||||
|
|
||||||
|
**Beispiele für Kurzzeichen:** `see_no_evil` :see_no_evil:, `hear_no_evil` :hear_no_evil:, `speak_no_evil` :speak_no_evil:.
|
||||||
|
|
||||||
|
Der [Emoji-Spickzettel](http://www.emoji-cheat-sheet.com/) ist eine nützliche Referenz für Emoji-Kurzzeichen.
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
---
|
||||||
|
title: "Externer Artikel - Why I switched to Fathom Analytics"
|
||||||
|
date: 2019-01-24
|
||||||
|
externalUrl: "https://jamespanther.com/writings/i-switched-from-google-analytics-to-fathom-analytics/"
|
||||||
|
summary: "Der Parameter `externalUrl` im Front Matter kann zu jeder URL verlinken. Der Artikel sieht aus wie jeder andere, aber verlinkt zu einem Post außerhalb des Hugo-Projekts."
|
||||||
|
showReadingTime: false
|
||||||
|
_build:
|
||||||
|
render: "never"
|
||||||
|
list: "local"
|
||||||
|
---
|
||||||
|
|
||||||
|
Diese Seite verwendet den Parameter `externalUrl`, um auf einen Artikel außerhalb dieser Hugo-Website zu verlinken.
|
||||||
|
|
||||||
|
Es ist ideal für Dinge wie die Verlinkung zu Beiträgen auf Medium oder zu wissenschaftlichen Arbeiten, die Sie auf Websites von Dritten gehostet haben.
|
||||||
|
|
@ -0,0 +1,77 @@
|
||||||
|
---
|
||||||
|
title: "Icons"
|
||||||
|
date: 2020-08-14
|
||||||
|
lastmod: 2023-01-23
|
||||||
|
draft: false
|
||||||
|
description: "Icon-Unterstützung in Congo."
|
||||||
|
slug: "icons"
|
||||||
|
tags: ["Icons", "Beispiele", "Shortcodes"]
|
||||||
|
showDateUpdated: true
|
||||||
|
---
|
||||||
|
|
||||||
|
Congo hat integrierte Unterstützung für eine Reihe von Icons von [FontAwesome 6](https://fontawesome.com/icons). Diese können entweder über den Partial [icon]({{< ref path="docs/partials#icon" lang="en" >}}) oder Shortcode [icon]({{< ref path="docs/shortcodes#icon" lang="en">}}) in deine Website eingebunden werden.
|
||||||
|
|
||||||
|
Darüber hinaus werden auch benutzerdefinierte Icons vollständig unterstützt. Du kannst deine eigenen SVG-Icon-Assets im Ordner `assets/icons/` im Stammverzeichnis deines Projekts ablegen. Alle Icons in diesem Verzeichnis stehen dann im gesamten Theme zur Verfügung.
|
||||||
|
|
||||||
|
Die vollständige Liste der integrierten Icons und ihre entsprechenden Namen findest du unten.
|
||||||
|
|
||||||
|
| Icon-Name | Vorschau |
|
||||||
|
| -------------------- | --------------------------------- |
|
||||||
|
| amazon | {{< icon amazon >}} |
|
||||||
|
| apple | {{< icon apple >}} |
|
||||||
|
| bars | {{< icon bars >}} |
|
||||||
|
| blogger | {{< icon blogger >}} |
|
||||||
|
| bug | {{< icon bug >}} |
|
||||||
|
| check | {{< icon check >}} |
|
||||||
|
| circle-info | {{< icon circle-info >}} |
|
||||||
|
| codepen | {{< icon codepen >}} |
|
||||||
|
| comment | {{< icon comment >}} |
|
||||||
|
| dev | {{< icon dev >}} |
|
||||||
|
| dribbble | {{< icon dribbble >}} |
|
||||||
|
| edit | {{< icon edit >}} |
|
||||||
|
| email | {{< icon email >}} |
|
||||||
|
| facebook | {{< icon facebook >}} |
|
||||||
|
| flickr | {{< icon flickr >}} |
|
||||||
|
| foursquare | {{< icon foursquare >}} |
|
||||||
|
| github | {{< icon github >}} |
|
||||||
|
| gitlab | {{< icon gitlab >}} |
|
||||||
|
| google | {{< icon google >}} |
|
||||||
|
| hashnode | {{< icon hashnode >}} |
|
||||||
|
| instagram | {{< icon instagram >}} |
|
||||||
|
| keybase | {{< icon keybase >}} |
|
||||||
|
| kickstarter | {{< icon kickstarter >}} |
|
||||||
|
| lastfm | {{< icon lastfm >}} |
|
||||||
|
| lightbulb | {{< icon lightbulb >}} |
|
||||||
|
| link | {{< icon link >}} |
|
||||||
|
| linkedin | {{< icon linkedin >}} |
|
||||||
|
| list | {{< icon list >}} |
|
||||||
|
| mastodon | {{< icon mastodon >}} |
|
||||||
|
| medium | {{< icon medium >}} |
|
||||||
|
| microsoft | {{< icon microsoft >}} |
|
||||||
|
| mobile | {{< icon mobile >}} |
|
||||||
|
| moon | {{< icon moon >}} |
|
||||||
|
| orcid | {{< icon orcid >}} |
|
||||||
|
| patreon | {{< icon patreon >}} |
|
||||||
|
| pencil | {{< icon pencil >}} |
|
||||||
|
| phone | {{< icon phone >}} |
|
||||||
|
| pinterest | {{< icon pinterest >}} |
|
||||||
|
| reddit | {{< icon reddit >}} |
|
||||||
|
| researchgate | {{< icon researchgate >}} |
|
||||||
|
| search | {{< icon search >}} |
|
||||||
|
| skull-crossbones | {{< icon skull-crossbones >}} |
|
||||||
|
| slack | {{< icon slack >}} |
|
||||||
|
| snapchat | {{< icon snapchat >}} |
|
||||||
|
| soundcloud | {{< icon soundcloud >}} |
|
||||||
|
| stack-overflow | {{< icon stack-overflow >}} |
|
||||||
|
| steam | {{< icon steam >}} |
|
||||||
|
| sun | {{< icon sun >}} |
|
||||||
|
| tag | {{< icon tag >}} |
|
||||||
|
| telegram | {{< icon telegram >}} |
|
||||||
|
| tiktok | {{< icon tiktok >}} |
|
||||||
|
| triangle-exclamation | {{< icon triangle-exclamation >}} |
|
||||||
|
| tumblr | {{< icon tumblr >}} |
|
||||||
|
| twitch | {{< icon twitch >}} |
|
||||||
|
| twitter | {{< icon twitter >}} |
|
||||||
|
| whatsapp | {{< icon whatsapp >}} |
|
||||||
|
| xmark | {{< icon xmark >}} |
|
||||||
|
| youtube | {{< icon youtube >}} |
|
||||||
|
|
@ -0,0 +1,145 @@
|
||||||
|
---
|
||||||
|
title: "Markdown"
|
||||||
|
date: 2019-03-11
|
||||||
|
description: "Beispielartikel, der die grundlegende Markdown-Syntax und die Formatierung von HTML-Elementen zeigt."
|
||||||
|
tags: ["Markdown", "CSS", "HTML", "Beispiele"]
|
||||||
|
---
|
||||||
|
|
||||||
|
Dieser Artikel bietet ein Beispiel für die grundlegende Markdown-Formatierung, die in Congo verwendet werden kann, und zeigt auch, wie einige grundlegende HTML-Elemente genutzt werden können.
|
||||||
|
|
||||||
|
<!--more-->
|
||||||
|
|
||||||
|
## Überschriften
|
||||||
|
|
||||||
|
Die folgenden HTML-Elemente `<h1>`-`<h6>` stellen sechs Ebenen von Abschnittsüberschriften dar. `<h1>` ist die höchste Abschnittsebene, während `<h6>` die niedrigste ist.
|
||||||
|
|
||||||
|
# H1
|
||||||
|
|
||||||
|
## H2
|
||||||
|
|
||||||
|
### H3
|
||||||
|
|
||||||
|
#### H4
|
||||||
|
|
||||||
|
##### H5
|
||||||
|
|
||||||
|
###### H6
|
||||||
|
|
||||||
|
## Absatz
|
||||||
|
|
||||||
|
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
|
||||||
|
|
||||||
|
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.
|
||||||
|
|
||||||
|
## Zitate als Block
|
||||||
|
|
||||||
|
Das blockquote-Element stellt Inhalte dar, die aus einer anderen Quelle zitiert werden, optional mit einem Zitat, das sich innerhalb eines `footer`- oder `cite`-Elements befinden muss, und optional mit Inline-Änderungen wie Anmerkungen und Abkürzungen.
|
||||||
|
|
||||||
|
### Zitat als Block ohne Quellenangabe
|
||||||
|
|
||||||
|
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
|
||||||
|
> **Hinweis**: _Markdown-Syntax_ kann innerhalb eines Zitat-Blocks verwendet werden.
|
||||||
|
|
||||||
|
### Zitat als Block ohne Quellenangabe
|
||||||
|
|
||||||
|
> Kommunizieren Sie nicht, indem Sie Erinnerungen teilen, sondern teilen Sie Erinnerungen, indem Sie kommunizieren.<br>
|
||||||
|
> — <cite>Rob Pike[^1]</cite>
|
||||||
|
|
||||||
|
[^1]: Das obige Zitat ist ein Auszug aus Rob Pikes [talk `about` nothing] (https://www.youtube.com/watch?v=PAAkCSZUG1c) während des Gopherfestes am 18. November 2015.
|
||||||
|
|
||||||
|
## Tabellen
|
||||||
|
|
||||||
|
Tabellen sind nicht Teil der Markdown-Kernspezifikation, aber Hugo unterstützt sie standardmäßig.
|
||||||
|
|
||||||
|
| Name | Alter |
|
||||||
|
| ----- | ----- |
|
||||||
|
| Bob | 27 |
|
||||||
|
| Alice | 23 |
|
||||||
|
|
||||||
|
### Inline-Markdown innerhalb von Tabellen
|
||||||
|
|
||||||
|
| Kursiv | Fett | Code |
|
||||||
|
| -------- | -------- | ------ |
|
||||||
|
| _kursiv_ | **fett** | `code` |
|
||||||
|
|
||||||
|
## Code-Blöcke
|
||||||
|
|
||||||
|
### Code-Block mit backticks
|
||||||
|
|
||||||
|
```html
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8" />
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
|
### Code-Block eingerückt mit vier Leerzeichen
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
### Code-Block mit Hugos internem highlight-Shortcode
|
||||||
|
|
||||||
|
{{< highlight html "linenos=table,hl_lines=4 7-9" >}}
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>Example HTML5 Document</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<p>Test</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
{{< /highlight >}}
|
||||||
|
|
||||||
|
## Arten von Listen
|
||||||
|
|
||||||
|
### Geordnete Liste
|
||||||
|
|
||||||
|
1. Erster Eintrag
|
||||||
|
2. Zweiter Eintrag
|
||||||
|
3. Dritter Eintrag
|
||||||
|
|
||||||
|
### Ungeordnete Liste
|
||||||
|
|
||||||
|
- Listen-Eintrag
|
||||||
|
- weiterer Eintrag
|
||||||
|
- noch ein weiterer Eintrag
|
||||||
|
|
||||||
|
### Geschachtelte Liste
|
||||||
|
|
||||||
|
- Obst
|
||||||
|
- Apfel
|
||||||
|
- Orange
|
||||||
|
- Banane
|
||||||
|
- Milchprodukte
|
||||||
|
- Milch
|
||||||
|
- Käse
|
||||||
|
|
||||||
|
## Andere Elemente — abbr, sub, sup, kbd, mark
|
||||||
|
|
||||||
|
<abbr title="Graphics Interchange Format">GIF</abbr> ist ein Bitmap-Bildformat.
|
||||||
|
|
||||||
|
H<sub>2</sub>O
|
||||||
|
|
||||||
|
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
|
||||||
|
|
||||||
|
Drücke <kbd>STRG</kbd>+<kbd>ALT</kbd>+<kbd>Entf</kbd>, um die Sitzung zu beenden.
|
||||||
|
|
||||||
|
Die meisten <mark>Salamander</mark> sind nachtaktiv und jagen nach Insekten, Würmern und anderen kleinen Lebewesen.
|
||||||
|
|
@ -0,0 +1,46 @@
|
||||||
|
---
|
||||||
|
title: Mathematische Notation
|
||||||
|
date: 2019-03-08
|
||||||
|
description: Ein kurzes Beispiel für die mathematische Notation in Congo.
|
||||||
|
tags: ["Beispiele", "KaTeX", "Mathematik", "Shortcodes"]
|
||||||
|
---
|
||||||
|
|
||||||
|
KaTeX kann verwendet werden, um mathematische Notationen in Artikeln darzustellen.
|
||||||
|
|
||||||
|
<!--more-->
|
||||||
|
|
||||||
|
{{< katex >}}
|
||||||
|
|
||||||
|
Congo bindet die KaTeX-Assets nur dann in das Projekt ein, wenn die mathematische Notation verwendet wird. Damit dies funktioniert, kann einfach der Shortcode [`katex`]({{< ref path="docs/shortcodes#katex" lang="en" >}}) in den Artikel eingefügt werden. Jede KaTeX-Syntax auf dieser Seite wird dann automatisch gerendert.
|
||||||
|
|
||||||
|
Die Online-Referenz der [unterstützten TeX-Funktionen](https://katex.org/docs/supported.html) zeigt Syntax-Beispiele.
|
||||||
|
|
||||||
|
## Inline-Schreibweise
|
||||||
|
|
||||||
|
Die Inline-Schreibweise kann erzeugt werden, indem der Ausdruck in die Trennzeichen `\(` und `\)` eingeschlossen wird.
|
||||||
|
|
||||||
|
**Beispiel:**
|
||||||
|
|
||||||
|
```tex
|
||||||
|
% KaTeX Inline-Schreibweise
|
||||||
|
Inline-Schreibweise: \\(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\\)
|
||||||
|
```
|
||||||
|
|
||||||
|
Inline-Schreibweise: \\(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\\)
|
||||||
|
|
||||||
|
## Schreibweise als Block
|
||||||
|
|
||||||
|
Alternativ kann die Blockschreibweise mit Hilfe von `$$`-Trennzeichen erzeugt werden. Dadurch wird der Ausdruck in einem eigenen HTML-Block ausgegeben.
|
||||||
|
|
||||||
|
**Beispiel:**
|
||||||
|
|
||||||
|
```tex
|
||||||
|
% KaTeX mit Block-Schreibweise
|
||||||
|
$$
|
||||||
|
\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }
|
||||||
|
$$
|
||||||
|
```
|
||||||
|
|
||||||
|
$$
|
||||||
|
\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }
|
||||||
|
$$
|
||||||
|
|
@ -0,0 +1,39 @@
|
||||||
|
---
|
||||||
|
title: "Platzhalter-Text"
|
||||||
|
date: "2019-03-09"
|
||||||
|
lastmod: "2022-01-24"
|
||||||
|
draft: true
|
||||||
|
description: "Lorem Ipsum Dolor Si Amet"
|
||||||
|
tags: ["markdown", "text", "sample", "latin"]
|
||||||
|
showDateUpdated: true
|
||||||
|
xml: false
|
||||||
|
---
|
||||||
|
|
||||||
|
Lorem est tota propiore conpellat pectoribus de pectora summo. <!--more-->Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum.
|
||||||
|
|
||||||
|
1. Exierant elisi ambit vivere dedere
|
||||||
|
2. Duce pollice
|
||||||
|
3. Eris modo
|
||||||
|
4. Spargitque ferrea quos palude
|
||||||
|
|
||||||
|
Rursus nulli murmur; hastile inridet ut ab gravi sententia! Nomine potitus silentia flumen, sustinet placuit petis in dilapsa erat sunt. Atria tractus malis.
|
||||||
|
|
||||||
|
1. Comas hunc haec pietate fetum procerum dixit
|
||||||
|
2. Post torum vates letum Tiresia
|
||||||
|
3. Flumen querellas
|
||||||
|
4. Arcanaque montibus omnes
|
||||||
|
5. Quidem et
|
||||||
|
|
||||||
|
## Vagus elidunt
|
||||||
|
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" overflow="visible" viewBox="0 0 496 373" height="186" width="248"><g fill="none"><path stroke="#000" stroke-width="2" d="M.599 372.348L495.263 1.206M.312.633l494.95 370.853M.312 372.633L247.643.92M248.502.92l246.76 370.566M330.828 123.869V1.134M330.396 1.134L165.104 124.515"></path><path stroke="#ED1C24" stroke-width="2" d="M275.73 41.616h166.224v249.05H275.73zM54.478 41.616h166.225v249.052H54.478z"></path><path stroke="#000" stroke-width="2" d="M.479.375h495v372h-495zM247.979.875v372"></path><ellipse cx="498.729" cy="177.625" rx="2" ry="1.25"></ellipse><ellipse cx="247.229" cy="377.375" rx="2" ry="1.25"></ellipse></g></svg>
|
||||||
|
|
||||||
|
[The Van de Graaf Canon](https://en.wikipedia.org/wiki/Canons_of_page_construction#Van_de_Graaf_canon)
|
||||||
|
|
||||||
|
### Mane refeci capiebant unda mulcebat
|
||||||
|
|
||||||
|
Victa caducifer, malo vulnere contra dicere aurato, ludit regale, voca! Retorsit colit est profanae esse virescere furit nec; iaculi matertera et visa est, viribus. Divesque creatis, tecta novat collumque vulnus est, parvas. **Faces illo pepulere** tempus adest. Tendit flamma, ab opes virum sustinet, sidus sequendo urbis.
|
||||||
|
|
||||||
|
Iubar proles corpore raptos vero auctor imperium; sed et huic: manus caeli Lelegas tu lux. Verbis obstitit intus oblectamina fixis linguisque ausus sperare Echionides cornuaque tenent clausit possit. Omnia putatur. Praeteritae refert ausus; ferebant e primus lora nutat, vici quae mea ipse. Et iter nil spectatae vulnus haerentia iuste et exercebat, sui et.
|
||||||
|
|
||||||
|
Eurytus Hector, materna ipsumque ut Politen, nec, nate, ignari, vernum cohaesit sequitur. Vel **mitis temploque** vocatus, inque alis, _oculos nomen_ non silvis corpore coniunx ne displicet illa. Crescunt non unus, vidit visa quantum inmiti flumina mortis facto sic: undique a alios vincula sunt iactata abdita! Suspenderat ego fuit tendit: luna, ante urbem Propoetides **parte**.
|
||||||
|
|
@ -0,0 +1,37 @@
|
||||||
|
---
|
||||||
|
title: "Reichhaltiger Inhalt"
|
||||||
|
date: 2019-03-10
|
||||||
|
description: "Eine kurze Beschreibung von Hugo-Shortcodes"
|
||||||
|
summary: "Dies hier ist ein _Beispiel_ einer **reichhaltigen** Inhaltsübersicht."
|
||||||
|
coverAlt: "Ein Beispiel für ein Titelbild, das die Icons einiger bekannter Medienorganisationen zeigt."
|
||||||
|
coverCaption: "Dies ist ein Beispiel für ein Titelbild mit einer Bildunterschrift."
|
||||||
|
tags: ["Shortcodes", "Privatsphäre", "Beispiele", "Gist", "Twitter", "YouTube", "Vimeo"]
|
||||||
|
---
|
||||||
|
|
||||||
|
Hugo wird mit mehreren [eingebauten Shortcodes] (https://gohugo.io/content-management/shortcodes/#use-hugos-built-in-shortcodes) für reichhaltige Inhalte geliefert, zusammen mit einer [Datenschutzkonfiguration] (https://gohugo.io/about/hugo-and-gdpr/) und einer Reihe von _einfachen Shortcodes_, die statische und No-JS-Versionen von Einbettungen verschiedener sozialer Medien ermöglichen.
|
||||||
|
|
||||||
|
## YouTube
|
||||||
|
|
||||||
|
Hier ist ein Beispiel des mitgelieferten `youtube`-Shortcodes.
|
||||||
|
|
||||||
|
{{< youtube ZJthWmvUzzc >}}
|
||||||
|
|
||||||
|
## Twitter
|
||||||
|
|
||||||
|
Dieses Beispiel verwendet den Shortcode `twitter_simple`, um einen Tweet anzuzeigen. Er benötigt zwei benannte Parameter `user` und `id`.
|
||||||
|
|
||||||
|
{{< twitter_simple user="DesignReviewed" id="1085870671291310081" >}}
|
||||||
|
|
||||||
|
Alternativ kann der Shortcode `tweet` verwendet werden, um eine vollständig formatierte Twitter-Kachel einzubetten.
|
||||||
|
|
||||||
|
## Gist
|
||||||
|
|
||||||
|
Der Shortcode `gist` kann verwendet werden, um einen Gist von GitHub einzubetten. Er erfordert zwei unbenannte Parameter: den Benutzernamen und die ID des Gist.
|
||||||
|
|
||||||
|
{{< gist jpanther a873e1219ffeaa80a926bbe8255f348e >}}
|
||||||
|
|
||||||
|
## Vimeo
|
||||||
|
|
||||||
|
Der Shortcode `vimeo_simple` bettet ein Video von Vimeo ein.
|
||||||
|
|
||||||
|
{{< vimeo_simple 48912912 >}}
|
||||||
Loading…
Reference in New Issue