feat: Update home page notices and privacy information in English, Spanish, and French; add public guides and routing for guides
All checks were successful
Deploy to production / deploy (push) Successful in 2m11s
All checks were successful
Deploy to production / deploy (push) Successful in 2m11s
- Changed beta notice to service notice on home page translations for English, Spanish, and French. - Updated privacy information to reflect transparency and continuous maintenance. - Added new public guides content with detailed sections for various topics. - Implemented routing for guide list and individual guide articles. - Created new components for displaying guides and articles.
This commit is contained in:
Torsten Schulz (local)
@@ -28,7 +28,7 @@ Diese Checkliste hilft, YourPart vor und nach der AdSense-Anmeldung policy-siche
|
||||
|
||||
## 4) Technische Anforderungen
|
||||
|
||||
- [x] AdSense Script einmalig im `head` eingebunden (`frontend/public/index.html`).
|
||||
- [x] AdSense Script wird nur auf freigegebenen Content-Routen dynamisch in den `head` geladen.
|
||||
- [ ] `ads.txt` unter `https://www.your-part.de/ads.txt` erreichbar.
|
||||
- [x] AdSlot-ID ist gesetzt (`VITE_ADSENSE_HEADER_SLOT`).
|
||||
- [x] In Produktion wird nur mit echter Slot-ID ausgeliefert.
|
||||
@@ -69,16 +69,17 @@ Diese Checkliste hilft, YourPart vor und nach der AdSense-Anmeldung policy-siche
|
||||
## Projekt-Hinweise fuer aktuellen Stand
|
||||
|
||||
- Header-Slot ist bereits eingebaut in `frontend/src/components/AppHeader.vue`.
|
||||
- Script ist in `frontend/public/index.html` eingebunden.
|
||||
- Script wird in `frontend/src/components/AppHeader.vue` nur auf freigegebenen Content-Routen geladen.
|
||||
- `ads.txt` liegt unter `frontend/public/ads.txt`.
|
||||
- Der Header-Slot wird aktuell nur auf inhaltlich staerkeren Routen angezeigt und benoetigt `VITE_ADSENSE_HEADER_SLOT`.
|
||||
- Oeffentliche Ratgeberseiten liegen unter `/ratgeber/...` und sind in `frontend/public/sitemap.xml` eingetragen.
|
||||
|
||||
## Ergebnis dieser Pruefung (heute)
|
||||
|
||||
### Erfuellt
|
||||
|
||||
- Footer verlinkt `Impressum`, `Datenschutz`, `Kontakt` global (`frontend/src/components/AppFooter.vue`).
|
||||
- AdSense Script ist im Head eingebunden (`frontend/public/index.html`).
|
||||
- AdSense Script wird kontrolliert im Head eingebunden (`frontend/src/components/AppHeader.vue`).
|
||||
- `ads.txt` ist im Repo vorhanden (`frontend/public/ads.txt`).
|
||||
- Header-Ad ist zwischen Logo und Sprachwahl und route-gebunden eingebaut (`frontend/src/components/AppHeader.vue`).
|
||||
- Slot-Init ist gegen mehrfaches Push abgesichert (`adInitialized`-Guard).
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<title>YourPart – Community, Chat, Forum, Vokabeltrainer, Falukant & Minispiele</title>
|
||||
<meta name="description" content="YourPart vereint Community, Chat, Forum, soziales Netzwerk mit Bildergalerie, Vokabeltrainer, das Aufbauspiel Falukant sowie Minispiele wie Match3 und Taxi. Die Plattform befindet sich in der Beta‑Phase und wird laufend erweitert." />
|
||||
<meta name="description" content="YourPart vereint Community, Chat, Forum, soziales Netzwerk mit Bildergalerie, Vokabeltrainer, das Aufbauspiel Falukant sowie Minispiele wie Match3 und Taxi." />
|
||||
<meta name="keywords" content="YourPart, Community, Chat, Forum, soziales Netzwerk, Vokabeltrainer, Sprachen lernen, Falukant, Aufbauspiel, Minispiele, Match3, Taxi, Bildergalerie, Tagebuch, Freundschaften" />
|
||||
<meta name="robots" content="index, follow" />
|
||||
<link rel="canonical" href="%VITE_PUBLIC_BASE_URL%/" />
|
||||
@@ -14,14 +14,14 @@
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:site_name" content="YourPart" />
|
||||
<meta property="og:title" content="YourPart – Community, Chat, Forum, Vokabeltrainer, Falukant & Minispiele" />
|
||||
<meta property="og:description" content="Community, Chat, Forum, soziales Netzwerk, Vokabeltrainer zum Sprachen lernen, das Aufbauspiel Falukant sowie Minispiele – jetzt in der Beta testen." />
|
||||
<meta property="og:description" content="Community, Chat, Forum, soziales Netzwerk, Vokabeltrainer zum Sprachen lernen, das Aufbauspiel Falukant sowie Minispiele." />
|
||||
<meta property="og:url" content="%VITE_PUBLIC_BASE_URL%/" />
|
||||
<meta property="og:locale" content="de_DE" />
|
||||
<meta property="og:image" content="%VITE_PUBLIC_BASE_URL%/images/logos/logo.png" />
|
||||
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:title" content="YourPart – Community, Chat, Forum, Vokabeltrainer, Falukant & Minispiele" />
|
||||
<meta name="twitter:description" content="Community, Chat, Forum, soziales Netzwerk, Vokabeltrainer zum Sprachen lernen, das Aufbauspiel Falukant sowie Minispiele – jetzt in der Beta testen." />
|
||||
<meta name="twitter:description" content="Community, Chat, Forum, soziales Netzwerk, Vokabeltrainer zum Sprachen lernen, das Aufbauspiel Falukant sowie Minispiele." />
|
||||
<meta name="twitter:image" content="%VITE_PUBLIC_BASE_URL%/images/logos/logo.png" />
|
||||
|
||||
<meta name="theme-color" content="#FF8C5A" />
|
||||
@@ -32,10 +32,6 @@
|
||||
<link rel="alternate" hreflang="fr" href="%VITE_PUBLIC_BASE_URL%/?lang=fr" />
|
||||
<link rel="alternate" hreflang="x-default" href="%VITE_PUBLIC_BASE_URL%/" />
|
||||
|
||||
<!-- Google AdSense (Auto ads) -->
|
||||
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1104166651501135"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
@@ -10,6 +10,11 @@
|
||||
<changefreq>daily</changefreq>
|
||||
<priority>0.9</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber</loc>
|
||||
<changefreq>weekly</changefreq>
|
||||
<priority>0.9</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/vokabeltrainer</loc>
|
||||
<changefreq>weekly</changefreq>
|
||||
@@ -35,4 +40,59 @@
|
||||
<changefreq>weekly</changefreq>
|
||||
<priority>0.7</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/falukant-wirtschaft</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/falukant-politik-und-gesellschaft</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/vokabeltrainer-alltag</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/bisaya-grundlagen</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/deutsch-fuer-bisaya-a1</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.8</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/browsergames-ohne-download</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.7</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/online-community-sicherheit</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.7</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/community-blogs</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.7</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/falukant-familie-charakter</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.7</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/vokabeln-mit-community</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.7</priority>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://www.your-part.de/ratgeber/yourpart-oeffentliche-inhalte</loc>
|
||||
<changefreq>monthly</changefreq>
|
||||
<priority>0.7</priority>
|
||||
</url>
|
||||
</urlset>
|
||||
|
||||
@@ -28,7 +28,6 @@
|
||||
</div>
|
||||
<div class="header-meta">
|
||||
<div class="header-meta__context">
|
||||
<span class="header-pill">{{ $t('appShell.header.beta') }}</span>
|
||||
<label class="header-lang">
|
||||
<span class="header-lang__label">{{ $t('appShell.header.language') }}</span>
|
||||
<select
|
||||
@@ -63,6 +62,9 @@ import { mapGetters } from 'vuex';
|
||||
import apiClient from '@/utils/axios.js';
|
||||
import { SUPPORTED_UI_LOCALES } from '@/i18n/supportedLocales.js';
|
||||
|
||||
const ADSENSE_SCRIPT_ID = 'google-adsense-script';
|
||||
const ADSENSE_CLIENT_ID = 'ca-pub-1104166651501135';
|
||||
|
||||
export default {
|
||||
name: 'AppHeader',
|
||||
data() {
|
||||
@@ -106,10 +108,12 @@ export default {
|
||||
return (
|
||||
path === '/' ||
|
||||
path.startsWith('/blogs') ||
|
||||
path.startsWith('/socialnetwork/forum') ||
|
||||
path.startsWith('/socialnetwork/forumtopic') ||
|
||||
path.startsWith('/socialnetwork/vocab/courses') ||
|
||||
path.startsWith('/falukant/home')
|
||||
path.startsWith('/ratgeber') ||
|
||||
path.startsWith('/vokabeltrainer') ||
|
||||
path.startsWith('/bisaya-lernen') ||
|
||||
path.startsWith('/deutsch-fuer-bisaya') ||
|
||||
path === '/falukant' ||
|
||||
path === '/minigames'
|
||||
);
|
||||
},
|
||||
desktopAdSlotId() {
|
||||
@@ -170,13 +174,44 @@ export default {
|
||||
initHeaderAd() {
|
||||
if (!this.showHeaderAd) return;
|
||||
if (this.adInitialized) return;
|
||||
if (typeof window === 'undefined' || !window.adsbygoogle) return;
|
||||
if (typeof window === 'undefined') return;
|
||||
this.ensureAdSenseScript()
|
||||
.then(() => {
|
||||
try {
|
||||
(window.adsbygoogle = window.adsbygoogle || []).push({});
|
||||
this.adInitialized = true;
|
||||
} catch (err) {
|
||||
console.warn('AppHeader: adsense slot init failed', err);
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
console.warn('AppHeader: adsense script could not be loaded', err);
|
||||
});
|
||||
},
|
||||
ensureAdSenseScript() {
|
||||
if (typeof window === 'undefined') {
|
||||
return Promise.resolve();
|
||||
}
|
||||
if (window.adsbygoogle) {
|
||||
return Promise.resolve();
|
||||
}
|
||||
const existing = document.getElementById(ADSENSE_SCRIPT_ID);
|
||||
if (existing) {
|
||||
return new Promise((resolve, reject) => {
|
||||
existing.addEventListener('load', resolve, { once: true });
|
||||
existing.addEventListener('error', reject, { once: true });
|
||||
});
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
const script = document.createElement('script');
|
||||
script.id = ADSENSE_SCRIPT_ID;
|
||||
script.async = true;
|
||||
script.crossOrigin = 'anonymous';
|
||||
script.src = `https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=${ADSENSE_CLIENT_ID}`;
|
||||
script.addEventListener('load', resolve, { once: true });
|
||||
script.addEventListener('error', reject, { once: true });
|
||||
document.head.appendChild(script);
|
||||
});
|
||||
},
|
||||
async onUiLanguageChange(code) {
|
||||
if (!SUPPORTED_UI_LOCALES.includes(code)) {
|
||||
@@ -328,18 +363,6 @@ export default {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.header-pill {
|
||||
padding: 5px 10px;
|
||||
border-radius: 999px;
|
||||
background: rgba(248, 162, 43, 0.14);
|
||||
border: 1px solid rgba(248, 162, 43, 0.24);
|
||||
font-size: 0.72rem;
|
||||
font-weight: 700;
|
||||
letter-spacing: 0.08em;
|
||||
text-transform: uppercase;
|
||||
color: #8a5411;
|
||||
}
|
||||
|
||||
.header-lang {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
336
frontend/src/content/publicGuides.js
Normal file
336
frontend/src/content/publicGuides.js
Normal file
@@ -0,0 +1,336 @@
|
||||
export const publicGuides = [
|
||||
{
|
||||
slug: 'falukant-wirtschaft',
|
||||
title: 'Falukant-Wirtschaft: Produktion, Lager und Verkauf verstehen',
|
||||
description: 'Ein Einstieg in die wirtschaftlichen Grundlagen von Falukant: Zweigstellen, Produkte, Lager, Preise und langfristige Entscheidungen.',
|
||||
category: 'Falukant',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Warum die Wirtschaft in Falukant mehr ist als ein Klicksystem',
|
||||
paragraphs: [
|
||||
'Falukant ist als browserbasiertes Aufbauspiel darauf ausgelegt, dass wirtschaftliche Entscheidungen miteinander verbunden sind. Eine Zweigstelle ist nicht nur ein Ort auf einer Karte, sondern der Ausgangspunkt fuer Produktion, Lagerhaltung, Verkauf und spaetere Spezialisierung. Wer erfolgreich spielen moechte, beobachtet nicht nur den aktuellen Kontostand, sondern auch die Frage, welche Produkte sich in welcher Region lohnen, welche Lagerkapazitaeten knapp werden und wie sich neue Investitionen auf die naechsten Spieltage auswirken.',
|
||||
'Der Reiz entsteht vor allem durch die Kombination aus einfachen Einzelaktionen und langfristigen Folgen. Ein Produkt kann kurzfristig Gewinn bringen, aber Lagerplatz blockieren. Eine neue Zweigstelle kann neue Maerkte erschliessen, bindet aber Kapital. Ein guter Verkaufspreis ist hilfreich, aber nur dann wertvoll, wenn genuegend Ware vorhanden ist und die Produktion nicht durch fehlende Ressourcen ausgebremst wird.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Produktion und Lager als gemeinsamer Kreislauf',
|
||||
paragraphs: [
|
||||
'Die Produktion sollte immer zusammen mit dem Lager betrachtet werden. Wer zu viel produziert, ohne die Nachfrage und die Lagergrenzen zu beachten, schafft Engpaesse. Wer zu vorsichtig produziert, verschenkt moegliche Einnahmen. Sinnvoll ist ein regelmaessiger Blick auf laufende Produktionen, vorhandene Bestaende und Produkte, deren Verkaufspreis gerade attraktiv ist.',
|
||||
'Gerade am Anfang ist es oft besser, wenige Waren gut zu verstehen, statt alle Optionen gleichzeitig zu nutzen. So erkennt man schneller, welche Produkte verlaesslich Umsatz bringen und welche eher situativ geeignet sind. Spaeter kann eine breitere Produktpalette sinnvoll werden, wenn mehrere Zweigstellen, bessere Bildung oder groessere Lager zur Verfuegung stehen.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Regionale Preise und Wissen',
|
||||
paragraphs: [
|
||||
'Ein zentrales Element ist die regionale Bewertung von Produkten. Nicht jede Ware hat ueberall denselben Wert. Dadurch entsteht ein Grund fuer Expansion und Vergleich: Eine Stadt kann fuer bestimmte Waren attraktiver sein als eine andere. Gleichzeitig spielt Wissen eine Rolle. Wer seine Kenntnisse verbessert, kann wirtschaftliche Entscheidungen praeziser treffen und den Spielverlauf planbarer machen.',
|
||||
'Falukant belohnt deshalb Spieler, die nicht nur produzieren, sondern beobachten. Welche Waren verkaufen sich gut? Welche Region wirkt lukrativ? Welche Investition macht die naechsten Schritte stabiler? Diese Fragen machen aus einzelnen Aktionen eine Wirtschaftssimulation, die mit der Zeit mehr Tiefe bekommt.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'falukant-politik-und-gesellschaft',
|
||||
title: 'Politik und Gesellschaft in Falukant: Einfluss, Amt und Verantwortung',
|
||||
description: 'Wie politische Aemter, Reputation, Adel und gesellschaftlicher Status in Falukant zusammenwirken.',
|
||||
category: 'Falukant',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Politik als Erweiterung des Aufbauspiels',
|
||||
paragraphs: [
|
||||
'Falukant beschraenkt sich nicht auf Produktion und Handel. Politik, Reputation und gesellschaftlicher Rang erweitern die Spielwelt um eine zweite Ebene: Wer wirtschaftlich waechst, kann auch gesellschaftlich sichtbarer werden. Politische Aemter, regionale Verantwortung und persoenliches Ansehen geben Entscheidungen ein anderes Gewicht als reine Gewinnmaximierung.',
|
||||
'Diese Ebene ist wichtig, weil sie dem Spiel eine langfristige Richtung gibt. Ein Betrieb kann erfolgreich sein, aber ein Charakter entwickelt sich zusaetzlich durch Beziehungen, Status, Bildung und politische Chancen. Dadurch entsteht ein Spielgefuehl, das naeher an einer fortlaufenden Lebens- und Wirtschaftssimulation liegt als an einem isolierten Produktionsspiel.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Reputation und oeffentliche Rolle',
|
||||
paragraphs: [
|
||||
'Reputation beschreibt, wie sichtbar und anerkannt ein Charakter in der Spielwelt ist. Sie wirkt nicht allein als Zahl, sondern als Signal fuer gesellschaftliche Position. Wer langfristig Einfluss aufbauen moechte, sollte Reputation nicht als Nebenwert behandeln. Sie kann politische und soziale Moeglichkeiten beeinflussen und macht bestimmte Entwicklungspfade plausibler.',
|
||||
'Der Umgang mit Reputation ist besonders interessant, weil er nicht immer sofortige Gewinne erzeugt. Manche Entscheidungen sind wirtschaftlich neutral, koennen aber den Charakter staerken. Andere bringen kurzfristige Vorteile, passen aber nicht zur gewuenschten Rolle. Diese Spannung ist ein wichtiger Teil der Spieltiefe.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Aemter, Regionen und Folgen',
|
||||
paragraphs: [
|
||||
'Politische Aemter sind an Regionen und Zuständigkeiten gebunden. Dadurch wird die Karte wichtiger: Eine Stadt, ein Landkreis oder eine groessere Region ist nicht nur ein Name, sondern ein Bereich, in dem Verantwortung entsteht. Entscheidungen koennen Steuern, Vorteile oder regionale Entwicklung betreffen.',
|
||||
'Fuer Spieler bedeutet das: Politik sollte nicht erst dann betrachtet werden, wenn alle wirtschaftlichen Fragen geloest sind. Wer frueh versteht, wie Region, Rang und Amt zusammenhaengen, kann seine Entwicklung besser planen und erkennt, warum Falukant verschiedene Spielbereiche miteinander verbindet.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'vokabeltrainer-alltag',
|
||||
title: 'Vokabeltrainer fuer den Alltag: Warum kurze Uebungen oft besser funktionieren',
|
||||
description: 'Ein Leitfaden zum YourPart-Vokabeltrainer und zum Lernen mit alltagsnahen Saetzen, Wiederholung und kleinen Einheiten.',
|
||||
category: 'Vokabeltrainer',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Alltag statt abstrakter Wortlisten',
|
||||
paragraphs: [
|
||||
'Ein Vokabeltrainer ist besonders hilfreich, wenn er nicht nur einzelne Woerter abfragt, sondern Sprache in typischen Situationen zeigt. Wer eine neue Sprache lernt, braucht Begriffe fuer Begruessung, Familie, Einkaufen, Arztbesuche, Arbeit, Schule und einfache Gespraeche. Genau solche Kontexte machen Vokabeln leichter erinnerbar.',
|
||||
'YourPart setzt deshalb auf Kurse, Lektionen und Uebungen, die auf kleine Lerneinheiten ausgelegt sind. Das Ziel ist nicht, in wenigen Tagen perfekte Grammatik zu erzeugen. Sinnvoller ist ein stabiler Grundwortschatz, der in echten Alltagssaetzen wiederholt wird und dadurch langsam sicherer sitzt.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Warum Wiederholung wichtiger ist als Tempo',
|
||||
paragraphs: [
|
||||
'Viele Lernende machen den Fehler, zu schnell immer neue Inhalte zu oeffnen. Kurzfristig fuehlt sich das produktiv an, langfristig bleiben aber oft Luecken. Ein guter Lernrhythmus wiederholt bekannte Inhalte, bevor neue Themen dazukommen. Dadurch wird Sprache nicht nur erkannt, sondern aktiver verfuegbar.',
|
||||
'Kleine Uebungen im Browser eignen sich gut fuer diesen Rhythmus. Man kann eine Lektion zwischendurch wiederholen, schwierige Begriffe erneut sehen und Fortschritt aufbauen, ohne eine eigene App installieren zu muessen. Gerade fuer Anfaenger ist diese niedrige Einstiegshuerde wichtig.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Realistische Ziele fuer Anfaenger',
|
||||
paragraphs: [
|
||||
'Ein Anfaengerkurs sollte ehrlich bleiben. Er ersetzt keinen Muttersprachler, keinen Unterricht und keine lange Praxis. Er kann aber helfen, die ersten Satzmuster zu verstehen, haeufige Woerter zu erkennen und einfache Antworten vorzubereiten. Das ist besonders nuetzlich, wenn man Kontakt zu Menschen aus einer anderen Sprachumgebung hat.',
|
||||
'Wer regelmaessig kurze Einheiten bearbeitet, baut eine Grundlage auf. Diese Grundlage macht echte Gespraeche weniger einschuechternd und hilft, weitere Lernquellen besser zu nutzen.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'bisaya-grundlagen',
|
||||
title: 'Bisaya lernen: Grundlagen fuer deutschsprachige Anfaenger',
|
||||
description: 'Was deutschsprachige Lernende beim Einstieg in Cebuano/Bisaya wissen sollten: Alltag, Aussprache, Satzmuster und Lernstrategie.',
|
||||
category: 'Sprachen',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Warum Bisaya fuer viele persoenlich relevant ist',
|
||||
paragraphs: [
|
||||
'Bisaya beziehungsweise Cebuano ist fuer viele deutschsprachige Lernende keine zufaellige Sprache. Oft geht es um Familie, Partnerschaft, Reisen, Alltag auf den Philippinen oder bessere Kommunikation mit Verwandten und Freunden. Dadurch unterscheidet sich das Lernen von einem rein schulischen Sprachkurs: Die wichtigsten Woerter sind jene, die in echten Situationen gebraucht werden.',
|
||||
'Ein guter Einstieg beginnt daher nicht mit komplizierten Grammatikregeln, sondern mit Begruessungen, einfachen Fragen, Zahlen, Essen, Gesundheit, Familie und kurzen Saetzen. Wer diese Bereiche versteht, kann schneller praktische Fortschritte erleben.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Satzmuster statt einzelner Woerter',
|
||||
paragraphs: [
|
||||
'Einzelne Vokabeln sind wichtig, aber Satzmuster geben ihnen Richtung. Wenn man weiss, wie man nach einem Ort fragt, wie man ein Beduerfnis ausdrueckt oder wie man eine einfache Bitte formuliert, lassen sich neue Woerter leichter einsetzen. Deshalb ist es sinnvoll, Wortschatz immer zusammen mit typischen Formulierungen zu lernen.',
|
||||
'Fuer deutschsprachige Lernende ist ausserdem wichtig, Unterschiede nicht sofort perfekt erklaeren zu wollen. Am Anfang reicht es oft, wiederkehrende Strukturen zu erkennen und sie in einfachen Situationen nachzusprechen oder zu schreiben.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Ein realistischer Lernweg',
|
||||
paragraphs: [
|
||||
'Der Einstieg in Bisaya sollte regelmaessig, aber nicht ueberladen sein. Zehn bis zwanzig Minuten am Tag koennen mehr bringen als seltene lange Sitzungen. Entscheidend ist, bekannte Saetze wiederzusehen und aktiv zu verwenden.',
|
||||
'YourPart kann dabei als niedrigschwelliger Begleiter dienen: kurze Lektionen, alltagsnahe Themen und Wiederholung im Browser. Die eigentliche Sicherheit entsteht anschliessend durch Kontakt mit echten Menschen, Nachrichten, Hoeren und Sprechen.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'deutsch-fuer-bisaya-a1',
|
||||
title: 'Deutsch fuer Bisaya-Sprecher: A1-Alltag im Browser ueben',
|
||||
description: 'Ein Einstieg fuer Cebuano-/Bisaya-Sprecher, die deutsche Alltagssaetze fuer Termine, Arbeit, Schule und Gesundheit lernen moechten.',
|
||||
category: 'Sprachen',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Deutsch lernen mit klaren Alltagssituationen',
|
||||
paragraphs: [
|
||||
'Deutsch kann fuer Bisaya- oder Cebuano-Sprecher am Anfang sehr kompakt wirken: Artikel, Verbformen, Satzstellung und lange Woerter kommen schnell zusammen. Fuer den Start ist deshalb wichtig, die Sprache nicht als grosses Regelpaket zu behandeln, sondern in Situationen aufzuteilen.',
|
||||
'Nuetzliche Themen sind Begruessung, Adresse, Telefonnummer, Arzttermin, Arbeit, Schule, Einkaufen, Bus und Bahn sowie einfache Formulare. Wer diese Bereiche uebt, kann im Alltag schneller reagieren und versteht haeufige Fragen besser.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'A1 bedeutet nicht Perfektion',
|
||||
paragraphs: [
|
||||
'Ein A1-orientierter Kurs soll grundlegende Kommunikation moeglich machen. Es geht um einfache Saetze, kurze Antworten und wichtige Woerter. Fehler sind normal. Wichtig ist, dass Lernende verstehen, was gefragt wird, und eine passende Antwort finden.',
|
||||
'Der YourPart-Vokabeltrainer kann solche Grundlagen in kleinen Einheiten abbilden. Das ist besonders hilfreich, wenn Lernen neben Familie, Arbeit oder Umzug stattfindet und keine langen Lernbloecke moeglich sind.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Vom Wiederholen zum Verwenden',
|
||||
paragraphs: [
|
||||
'Wiederholung ist der erste Schritt, aber Sprache muss spaeter verwendet werden. Lernende sollten neue Saetze laut sprechen, in Nachrichten ausprobieren und mit echten Situationen verbinden. Ein Satz wie „Ich habe einen Termin“ wird leichter behalten, wenn er mit einem realen Arzt- oder Behoerdentermin verknuepft ist.',
|
||||
'So entsteht ein stabiler Grundwortschatz, der nicht nur im Test funktioniert, sondern im Alltag hilft.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'browsergames-ohne-download',
|
||||
title: 'Browsergames ohne Download: Wann kurze Spiele im Web sinnvoll sind',
|
||||
description: 'Warum browserbasierte Minispiele fuer kurze Pausen, schnelle Einstiege und plattformuebergreifendes Spielen geeignet sind.',
|
||||
category: 'Minispiele',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Der Vorteil kurzer Spielrunden',
|
||||
paragraphs: [
|
||||
'Browsergames haben einen einfachen Vorteil: Sie sind sofort erreichbar. Kein App-Store, keine Installation und meist kein langes Einrichten. Fuer kurze Pausen oder gelegentliche Spielrunden ist das ideal. Match-3-Spiele, kleine Fahrspiele oder andere Minispiele funktionieren besonders gut, wenn sie klare Regeln haben und direkt starten.',
|
||||
'YourPart nutzt Minispiele als ergaenzenden Bereich zur Community. Sie sind nicht als Ersatz fuer grosse Spiele gedacht, sondern als kurzer, unkomplizierter Zeitvertreib innerhalb derselben Plattform.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Warum einfache Regeln nicht langweilig sein muessen',
|
||||
paragraphs: [
|
||||
'Ein gutes Minispiel erklaert sich schnell, bietet aber trotzdem kleine Entscheidungen. Bei Match-3 geht es um Muster, Ketten und Ziele. Bei einem Taxi-Spiel geht es um Wege, Timing und Orientierung. Die Tiefe entsteht nicht durch komplizierte Bedienung, sondern durch wiederholbare Situationen, die jedes Mal leicht anders sind.',
|
||||
'Gerade im Browser ist das wichtig. Nutzer sollen nicht erst eine Anleitung lesen muessen, sondern innerhalb weniger Sekunden verstehen, was zu tun ist.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Einbindung in eine groessere Plattform',
|
||||
paragraphs: [
|
||||
'Minispiele gewinnen an Wert, wenn sie nicht isoliert sind. In einer Plattform mit Community, Forum, Blogs und Lernbereichen koennen sie als lockerer Einstieg dienen. Man spielt eine Runde, entdeckt andere Bereiche und bleibt nicht an einer einzelnen Funktion haengen.',
|
||||
'Fuer Publisher-Content ist entscheidend, dass solche Spiele durch erklaerende Texte, Spielbeschreibungen und klare Seitenstruktur ergaenzt werden. So versteht auch ein Crawler, worum es auf der Seite geht.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'online-community-sicherheit',
|
||||
title: 'Online-Community sicher nutzen: Profile, Sichtbarkeit und Moderation',
|
||||
description: 'Grundlagen fuer eine sichere Community-Nutzung: Profilangaben, Bilder, Sichtbarkeiten, Meldungen und respektvoller Umgang.',
|
||||
category: 'Community',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Sichtbarkeit bewusst einstellen',
|
||||
paragraphs: [
|
||||
'In einer Online-Community geht es um Austausch, aber nicht jede Information muss fuer alle sichtbar sein. Profilangaben, Bilder und persoenliche Inhalte sollten bewusst gepflegt werden. Gute Sichtbarkeitseinstellungen helfen, zwischen oeffentlichen Informationen, Freundeskreis und privaten Bereichen zu unterscheiden.',
|
||||
'Besonders bei Bildern ist Kontrolle wichtig. Nutzer sollten entscheiden koennen, welche Inhalte allgemein sichtbar sind und welche nur fuer ausgewaehlte Kontakte bestimmt sind. Das schafft Vertrauen und reduziert Missverstaendnisse.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Moderation als Qualitaetsmerkmal',
|
||||
paragraphs: [
|
||||
'Eine Community braucht Regeln und Werkzeuge, um problematische Inhalte zu melden. Moderation ist kein Nebenthema, sondern ein Teil der Produktqualitaet. Wenn Nutzer Beitraege, Bilder oder Profile melden koennen, entsteht ein klarer Weg, um auf Konflikte oder Missbrauch zu reagieren.',
|
||||
'Auch fuer Werbenetzwerke ist Moderation relevant. Plattformen mit nutzergenerierten Inhalten muessen zeigen, dass sie problematische Inhalte nicht einfach unkontrolliert neben Anzeigen stehen lassen.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Respektvoller Umgang',
|
||||
paragraphs: [
|
||||
'Technische Funktionen reichen nicht aus. Eine gute Community entsteht durch respektvollen Umgang, klare Kommunikation und die Bereitschaft, Grenzen anderer Nutzer zu akzeptieren. Kontaktanfragen, Chat und Forum funktionieren besser, wenn Nutzer nicht draengen und private Informationen schuetzen.',
|
||||
'YourPart verbindet soziale Funktionen mit Lern- und Spielbereichen. Gerade deshalb ist eine klare Trennung von oeffentlichen, privaten und geschuetzten Bereichen wichtig.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'community-blogs',
|
||||
title: 'Community-Blogs: Warum eigene Beitraege mehr Wert schaffen als kurze Statusmeldungen',
|
||||
description: 'Wie oeffentliche Blogs in einer Community genutzt werden koennen, um Erfahrungen, Projekte und Themen dauerhaft sichtbar zu machen.',
|
||||
category: 'Blogs',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Blogs als dauerhafter Content',
|
||||
paragraphs: [
|
||||
'Statusmeldungen sind schnell geschrieben, aber sie verschwinden oft ebenso schnell aus dem Blick. Ein Blogbeitrag hat einen anderen Zweck: Er kann ein Thema sammeln, eine Erfahrung beschreiben oder einen Projektstand dauerhaft auffindbar machen. Fuer eine Community ist das wertvoll, weil Inhalte nicht nur im Moment der Veroeffentlichung sichtbar sind.',
|
||||
'Oeffentliche Blogs koennen ausserdem Menschen ausserhalb der Plattform zeigen, welche Themen die Community beschaeftigen. Das macht eine Seite fuer Suchmaschinen und Besucher verstaendlicher als reine Login-Bereiche.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Was einen guten Community-Beitrag ausmacht',
|
||||
paragraphs: [
|
||||
'Ein guter Beitrag beantwortet eine konkrete Frage oder erzaehlt eine nachvollziehbare Erfahrung. Das kann ein Lernerfolg sein, ein Bericht ueber ein Browsergame, eine Anleitung fuer ein Feature oder ein persoenlicher Erfahrungsbericht. Wichtig ist, dass der Text eigenstaendig genug ist, um auch ohne Kontext verstanden zu werden.',
|
||||
'Bilder, Listen und kurze Abschnitte koennen helfen, aber der Kern bleibt der eigene Text. Je klarer ein Beitrag ein Thema behandelt, desto hoeher ist sein Wert fuer Leser und fuer die Einordnung durch Suchmaschinen.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Blogs und AdSense',
|
||||
paragraphs: [
|
||||
'Fuer AdSense sind Blogs oft besser geeignet als reine Funktionsseiten, weil sie echten Publisher-Content enthalten. Voraussetzung ist, dass die Beitraege oeffentlich erreichbar, inhaltlich ausreichend lang und nicht nur Platzhalter sind.',
|
||||
'Eine Plattform wie YourPart profitiert deshalb davon, wenn oeffentliche Blogbeitraege gepflegt und in der Sitemap sichtbar gemacht werden. Das staerkt den Eindruck einer echten Content-Seite statt einer reinen Anwendung.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'falukant-familie-charakter',
|
||||
title: 'Charakterentwicklung in Falukant: Familie, Bildung und Status',
|
||||
description: 'Ein Ueberblick ueber die Rollenspiel-Elemente in Falukant und ihre Verbindung zur Wirtschaftssimulation.',
|
||||
category: 'Falukant',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Warum Charaktere die Wirtschaft lebendiger machen',
|
||||
paragraphs: [
|
||||
'Falukant verbindet wirtschaftliche Systeme mit persoenlicher Entwicklung. Ein Charakter ist nicht nur ein Besitzer von Geld und Betrieben, sondern Teil einer Spielwelt mit Familie, Bildung, Gesundheit und gesellschaftlicher Position. Dadurch bekommen wirtschaftliche Entscheidungen einen persoenlichen Rahmen.',
|
||||
'Wer einen Betrieb ausbaut, investiert nicht nur in Zahlen. Bildung kann neue Moeglichkeiten schaffen, Familie kann langfristige Perspektiven veraendern und Status kann den Zugang zu gesellschaftlichen Bereichen beeinflussen.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Bildung und Fortschritt',
|
||||
paragraphs: [
|
||||
'Bildung ist ein gutes Beispiel fuer langfristiges Denken. Sie fuehrt nicht zwingend sofort zu einem sichtbaren Gewinn, kann aber spaetere Entscheidungen verbessern. Ein besser ausgebildeter Charakter wirkt glaubwuerdiger, wenn er wirtschaftlich und gesellschaftlich aufsteigen soll.',
|
||||
'Solche Systeme machen das Spiel langsamer, aber auch stabiler. Statt nur schnell Geld zu sammeln, entsteht ein Verlauf, der den Charakter ueber Zeit praegt.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Familie und Kontinuitaet',
|
||||
paragraphs: [
|
||||
'Familien- und Beziehungsfunktionen geben Falukant eine weitere langfristige Ebene. Sie schaffen Kontinuitaet und verbinden die wirtschaftliche Entwicklung mit einer persoenlichen Geschichte.',
|
||||
'Das ist besonders fuer Spieler interessant, die nicht nur optimieren, sondern eine Rolle in der Spielwelt ausfuellen moechten. Falukant kann dadurch gleichzeitig Aufbauspiel, Wirtschaftssimulation und leichtes Rollenspiel sein.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'vokabeln-mit-community',
|
||||
title: 'Vokabeln lernen mit Community-Unterstuetzung',
|
||||
description: 'Warum Sprachlernen in einer Plattform mit Forum, Chat und Blogs leichter zur Gewohnheit werden kann.',
|
||||
category: 'Vokabeltrainer',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Lernen braucht Wiederholung und Anlass',
|
||||
paragraphs: [
|
||||
'Vokabeln bleiben besser haengen, wenn sie nicht isoliert gelernt werden. Eine Community kann einen Anlass geben, Sprache wirklich zu verwenden: kurze Nachrichten, Fragen im Forum oder ein Blogbeitrag ueber Lernfortschritte. Dadurch wird aus einer Uebung eher eine Gewohnheit.',
|
||||
'Der YourPart-Vokabeltrainer ist deshalb nicht voellig getrennt von der Plattform gedacht. Er steht neben Community, Blogs und Chat. Diese Verbindung kann helfen, Lerninhalte in echte Kommunikation zu ueberfuehren.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Vom passiven Erkennen zum aktiven Schreiben',
|
||||
paragraphs: [
|
||||
'Viele Lernende erkennen Woerter frueher, als sie sie selbst aktiv verwenden koennen. Das ist normal. Der Schritt vom Wiedererkennen zum Schreiben oder Sprechen braucht einfache Anlaesse. Eine kurze Vorstellung, eine Frage oder ein Kommentar kann reichen, um neue Woerter aktiv zu benutzen.',
|
||||
'Gerade bei Anfaengern sollte dieser Schritt niedrigschwellig sein. Fehler sind Teil des Lernens, solange die Kommunikation verstaendlich bleibt.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Blogs als Lerntagebuch',
|
||||
paragraphs: [
|
||||
'Ein oeffentlicher oder halb-oeffentlicher Blog kann als Lerntagebuch dienen. Lernende koennen festhalten, welche Lektionen sie bearbeitet haben, welche Woerter schwierig sind und welche Saetze sie im Alltag nutzen moechten.',
|
||||
'Solche Beitraege schaffen gleichzeitig Content fuer andere Nutzer. Wer spaeter denselben Kurs beginnt, findet Beispiele und Motivation aus der Community.'
|
||||
]
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
slug: 'yourpart-oeffentliche-inhalte',
|
||||
title: 'Oeffentliche Inhalte auf YourPart: Was Besucher ohne Konto finden',
|
||||
description: 'Ein Ueberblick ueber die oeffentlichen Bereiche von YourPart und warum sie fuer neue Besucher wichtig sind.',
|
||||
category: 'YourPart',
|
||||
updatedAt: '2026-05-18',
|
||||
sections: [
|
||||
{
|
||||
heading: 'Warum oeffentliche Seiten wichtig sind',
|
||||
paragraphs: [
|
||||
'Eine Community-Plattform besteht oft aus Bereichen, die erst nach dem Login sichtbar werden. Fuer bestehende Nutzer ist das sinnvoll, fuer neue Besucher und Suchmaschinen aber schwer einzuordnen. Oeffentliche Seiten erklaeren, was eine Plattform bietet, bevor jemand ein Konto erstellt.',
|
||||
'YourPart nutzt deshalb Landingpages, Blogs und Ratgeberseiten, um die wichtigsten Bereiche sichtbar zu machen: Community, Vokabeltrainer, Falukant und Minispiele. Diese Seiten geben Kontext und helfen Besuchern zu entscheiden, ob die Plattform fuer sie relevant ist.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Content statt reiner Navigation',
|
||||
paragraphs: [
|
||||
'Eine reine Navigationsseite mit ein paar Links ist fuer Besucher selten hilfreich. Besser sind Seiten, die ein Thema erklaeren: Was ist Falukant? Fuer wen ist der Vokabeltrainer gedacht? Welche Rolle spielen Blogs? Wie funktionieren Minispiele im Browser?',
|
||||
'Solche Inhalte machen die Plattform transparenter und geben Suchmaschinen genug Text, um die Seite thematisch zu verstehen.'
|
||||
]
|
||||
},
|
||||
{
|
||||
heading: 'Grenzen zwischen oeffentlich und privat',
|
||||
paragraphs: [
|
||||
'Nicht alles muss oeffentlich sein. Private Nachrichten, persoenliche Einstellungen, Admin-Bereiche und geschuetzte Inhalte gehoeren nicht in den oeffentlichen Index. Gerade fuer Werbung ist diese Trennung wichtig, weil Anzeigen auf Seiten mit klarem Publisher-Content sicherer sind als auf reinen Funktionsscreens.',
|
||||
'Eine stabile Struktur trennt deshalb oeffentliche Informationsseiten von privaten App-Bereichen. Das verbessert Nutzerfuehrung, SEO und die Eignung fuer Werbenetzwerke.'
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
export function getPublicGuide(slug) {
|
||||
return publicGuides.find((guide) => guide.slug === slug) || null;
|
||||
}
|
||||
@@ -50,12 +50,12 @@
|
||||
"feature3Title": "Parte sa komunidad",
|
||||
"feature3Text": "Ang pinulongan nga lugar nahimutang sa mas dako nga plataporma sa komunidad nga adunay blog, forum ug chat."
|
||||
},
|
||||
"betaNoticeLabel": "Pahibalo sa beta:",
|
||||
"betaNoticeText": "Ang YourPart padayon pang gihimo. Adunay mga feature nga wala pa mahuman, adunay impormasyon nga kulang pa, ug posible pa nga adunay mga kausaban.",
|
||||
"serviceNoticeLabel": "Pahibalo:",
|
||||
"serviceNoticeText": "Ang YourPart padayon nga giatiman ug gidugangan og bag-ong sulod.",
|
||||
"nologin": {
|
||||
"welcome": "Maayong pag-abot sa yourPart",
|
||||
"description": "Ang yourPart usa ka social network diin makapangita ka og mga higala ug makaila og bag-ong mga tawo. Makapaambit ka og mga hulagway ug makapili kinsa ang makakita niini. Makapadala usab ka og mga mensahe ug makig-chat sa dagkong public rooms o sa gamay nga random chat.",
|
||||
"introHtml": "Ang YourPart usa ka nagtubo nga plataporma nga naghiusa sa community features, real-time chat, forum, social network nga adunay photo gallery, ug sa city-builder game nga <em>Falukant</em>. Beta pa karon ang site ug padayon pa namong palapdan ang features, sulod ug kalig-on.",
|
||||
"introHtml": "Ang YourPart usa ka plataporma nga naghiusa sa community features, real-time chat, forum, social network nga adunay photo gallery, ug sa city-builder game nga <em>Falukant</em>.",
|
||||
"storyTeaser": "Ang YourPart naghiusa og <strong>online community</strong>, real-time chat, forum, blogs, <strong>libre nga vocabulary trainer</strong>, ug <strong>mga browser game</strong>—lakip ang medieval economy builder nga <em>Falukant</em>—<strong>walay download</strong>. Focus: panag-istoryahan, lawom nga dula, ug nagtubo nga kalibotan.",
|
||||
"expected": {
|
||||
"title": "Unsa ang imong mapaabot",
|
||||
@@ -72,9 +72,9 @@
|
||||
"title": "Falukant - sa mubo",
|
||||
"text": "Sa Falukant, magdumala ka og negosyo, motukod og kahibalo, mo-optimize sa produksyon ug baligya, motan-aw sa presyo ug motubag sa mga panghitabo. Ang mga notification motug-an sa mga kausaban sa status sa tinuod nga oras."
|
||||
},
|
||||
"privacyBeta": {
|
||||
"title": "Privacy ug beta status",
|
||||
"text": "Beta pa ang YourPart. Posible pa ang mga kausaban, outage ug kulang nga mga hubad. Importante kanamo ang privacy ug transparency; dugang impormasyon moabot samtang nagpadayon ang beta."
|
||||
"privacyInfo": {
|
||||
"title": "Privacy ug transparency",
|
||||
"text": "Importante sa YourPart ang privacy, klaro nga contact options ug transparent nga impormasyon bahin sa available features."
|
||||
},
|
||||
"getStarted": {
|
||||
"title": "Sugdi na",
|
||||
|
||||
@@ -50,12 +50,12 @@
|
||||
"feature3Title": "Teil einer Community",
|
||||
"feature3Text": "Der Sprachbereich ist in eine größere Community-Plattform mit Blogs, Forum und Chat eingebettet."
|
||||
},
|
||||
"betaNoticeLabel": "Beta-Hinweis:",
|
||||
"betaNoticeText": "YourPart befindet sich in aktiver Entwicklung. Funktionen können unvollständig sein, Inhalte fehlen noch und es kann zu Änderungen kommen.",
|
||||
"serviceNoticeLabel": "Hinweis:",
|
||||
"serviceNoticeText": "YourPart wird kontinuierlich gepflegt und um neue Inhalte erweitert.",
|
||||
"nologin": {
|
||||
"welcome": "Willkommen bei yourPart",
|
||||
"description": "yourPart ist ein social Network, bei dem Sie Freundschaften schließen und neue Leute kennen lernen können. Sie können hier Ihre Bilder für andere anzeigen und dabei bestimmen, wer welche Bilder sehen kann. Natürlich können Sie auch Nachrichen austauschen und sogar Chatten. Im großen Stil, mit vielen anderen gleichzeitig, und im kleinen Zufallschat. Und nicht zu vergessen, Sie können hier auch Camen.",
|
||||
"introHtml": "YourPart ist eine wachsende Online‑Plattform, die Community‑Funktionen, Echtzeit‑Chat, Foren, ein soziales Netzwerk mit Bildergalerie sowie das Aufbauspiel <em>Falukant</em> vereint. Aktuell befindet sich die Seite in der Beta‑Phase – wir erweitern Funktionen, Inhalte und Stabilität kontinuierlich.",
|
||||
"introHtml": "YourPart ist eine Online‑Plattform, die Community‑Funktionen, Echtzeit‑Chat, Foren, ein soziales Netzwerk mit Bildergalerie sowie das Aufbauspiel <em>Falukant</em> vereint.",
|
||||
"storyTeaser": "YourPart bündelt <strong>Online‑Community</strong>, Echtzeit‑Chat, Foren, Blogs, <strong>Vokabeltrainer</strong> und <strong>kostenlose Browsergames</strong> – darunter das mittelalterliche Wirtschafts‑Aufbauspiel <em>Falukant</em> – auf einer Plattform <strong>ohne Download</strong>. Schwerpunkt: Austausch, spielerische Tiefe und eine wachsende Produktwelt.",
|
||||
"expected": {
|
||||
"title": "Was dich erwartet",
|
||||
@@ -72,9 +72,9 @@
|
||||
"title": "Falukant – kurz erklärt",
|
||||
"text": "In Falukant führst du Betriebe, bildest Wissen aus, optimierst Produktion und Verkauf, beobachtest Preise und reagierst auf Ereignisse. Benachrichtigungen informieren dich über Status‑Änderungen in Echtzeit."
|
||||
},
|
||||
"privacyBeta": {
|
||||
"title": "Datenschutz & Beta‑Status",
|
||||
"text": "YourPart befindet sich in der Beta. Es kann zu Änderungen, Ausfällen und fehlenden Übersetzungen kommen. Wir legen Wert auf Datenschutz und Transparenz; weitere Informationen folgen im Laufe der Beta."
|
||||
"privacyInfo": {
|
||||
"title": "Datenschutz & Transparenz",
|
||||
"text": "YourPart legt Wert auf Datenschutz, klare Kontaktmöglichkeiten und nachvollziehbare Informationen zu den angebotenen Funktionen."
|
||||
},
|
||||
"getStarted": {
|
||||
"title": "Mitmachen",
|
||||
|
||||
@@ -50,12 +50,12 @@
|
||||
"feature3Title": "Part of a community",
|
||||
"feature3Text": "The language area is embedded in a larger community platform with blogs, forum, and chat."
|
||||
},
|
||||
"betaNoticeLabel": "Beta notice:",
|
||||
"betaNoticeText": "YourPart is under active development. Features may be incomplete, information may still be missing and things can change.",
|
||||
"serviceNoticeLabel": "Notice:",
|
||||
"serviceNoticeText": "YourPart is maintained continuously and expanded with new content.",
|
||||
"nologin": {
|
||||
"welcome": "Welcome to yourPart",
|
||||
"description": "yourPart is a social network where you can make friends and meet new people. You can share your images and control who sees what. You can also exchange messages and chat – in large public rooms or in the small random chat. And, of course, you can cam as well.",
|
||||
"introHtml": "YourPart is a growing platform combining community features, real‑time chat, forums, a social network with photo gallery, and the city‑builder game <em>Falukant</em>. The site is currently in beta – we continuously expand features, content and stability.",
|
||||
"introHtml": "YourPart is a platform combining community features, real‑time chat, forums, a social network with photo gallery, and the city‑builder game <em>Falukant</em>.",
|
||||
"storyTeaser": "YourPart combines an <strong>online community</strong>, real‑time chat, forums, blogs, a <strong>free vocabulary trainer</strong> and <strong>browser games</strong>—including the medieval economy builder <em>Falukant</em>—in one place, <strong>no download required</strong>. Focus: social exchange, depth and a growing product world.",
|
||||
"expected": {
|
||||
"title": "What to expect",
|
||||
@@ -72,9 +72,9 @@
|
||||
"title": "Falukant – in short",
|
||||
"text": "In Falukant you run businesses, build knowledge, optimize production and sales, watch prices and react to events. Notifications inform you about status changes in real time."
|
||||
},
|
||||
"privacyBeta": {
|
||||
"title": "Privacy & beta status",
|
||||
"text": "YourPart is in beta. There may be changes, outages and missing translations. We value privacy and transparency; more information will follow during the beta."
|
||||
"privacyInfo": {
|
||||
"title": "Privacy & transparency",
|
||||
"text": "YourPart values privacy, clear contact options and transparent information about the available features."
|
||||
},
|
||||
"getStarted": {
|
||||
"title": "Get started",
|
||||
|
||||
@@ -50,12 +50,12 @@
|
||||
"feature3Title": "Parte de una comunidad",
|
||||
"feature3Text": "El área de idiomas está integrada en una plataforma comunitaria más amplia con blogs, foro y chat."
|
||||
},
|
||||
"betaNoticeLabel": "Aviso beta:",
|
||||
"betaNoticeText": "YourPart está en desarrollo activo. Algunas funciones pueden estar incompletas, pueden faltar contenidos y puede haber cambios.",
|
||||
"serviceNoticeLabel": "Aviso:",
|
||||
"serviceNoticeText": "YourPart se mantiene de forma continua y se amplía con nuevos contenidos.",
|
||||
"nologin": {
|
||||
"welcome": "Bienvenido a yourPart",
|
||||
"description": "yourPart es una red social donde puedes hacer amistades y conocer gente nueva. Aquí puedes mostrar tus imágenes y decidir quién puede verlas. Por supuesto, también puedes intercambiar mensajes y chatear: en grande, con muchos a la vez, o en un chat aleatorio 1 a 1. Y no lo olvides: también puedes usar la cámara.",
|
||||
"introHtml": "YourPart es una plataforma en línea en crecimiento que combina funciones de comunidad, chat en tiempo real, foros, una red social con galería de imágenes y el juego de estrategia <em>Falukant</em>. Actualmente el sitio está en fase beta: ampliamos continuamente funciones, contenidos y estabilidad.",
|
||||
"introHtml": "YourPart es una plataforma en línea que combina funciones de comunidad, chat en tiempo real, foros, una red social con galería de imágenes y el juego de estrategia <em>Falukant</em>.",
|
||||
"storyTeaser": "YourPart reúne <strong>comunidad en línea</strong>, chat en tiempo real, foros, blogs, un <strong>entrenador de vocabulario gratuito</strong> y <strong>minijuegos en el navegador</strong>, incluido el constructor medieval <em>Falukant</em>, <strong>sin descargas</strong>. Enfoque: intercambio, profundidad de juego y un ecosistema en crecimiento.",
|
||||
"expected": {
|
||||
"title": "Qué te espera",
|
||||
@@ -72,9 +72,9 @@
|
||||
"title": "Falukant: en breve",
|
||||
"text": "En Falukant diriges negocios, desarrollas conocimiento, optimizas producción y ventas, vigilas precios y reaccionas a eventos. Las notificaciones te informan en tiempo real sobre cambios de estado."
|
||||
},
|
||||
"privacyBeta": {
|
||||
"title": "Privacidad y estado beta",
|
||||
"text": "YourPart está en beta. Puede haber cambios, interrupciones y traducciones incompletas. Valoramos la privacidad y la transparencia; habrá más información a lo largo de la beta."
|
||||
"privacyInfo": {
|
||||
"title": "Privacidad y transparencia",
|
||||
"text": "YourPart valora la privacidad, opciones de contacto claras e información transparente sobre las funciones disponibles."
|
||||
},
|
||||
"getStarted": {
|
||||
"title": "Participa",
|
||||
|
||||
@@ -50,12 +50,12 @@
|
||||
"feature3Title": "Fait partie d'une communauté",
|
||||
"feature3Text": "L'espace linguistique est intégré dans une plateforme communautaire plus large avec des blogs, un forum et un chat."
|
||||
},
|
||||
"betaNoticeLabel": "Remarque bêta :",
|
||||
"betaNoticeText": "YourPart est en cours de développement actif. Les fonctions peuvent être incomplètes, le contenu manque encore et des modifications peuvent survenir.",
|
||||
"serviceNoticeLabel": "Remarque :",
|
||||
"serviceNoticeText": "YourPart est maintenu en continu et enrichi avec de nouveaux contenus.",
|
||||
"nologin": {
|
||||
"welcome": "Bienvenue dans votrePartie",
|
||||
"description": "yourPart est un réseau social où vous pouvez vous faire des amis et rencontrer de nouvelles personnes. Ici, vous pouvez afficher vos images à d'autres personnes et contrôler qui peut voir quelles images. Bien entendu, vous pouvez également échanger des messages et même discuter. A grande échelle, avec beaucoup d'autres en même temps, et dans de petites discussions aléatoires. Et n'oubliez pas que vous pouvez également filmer ici.",
|
||||
"introHtml": "YourPart est une plateforme en ligne en pleine croissance qui combine des fonctions communautaires, un chat en temps réel, des forums, un réseau social avec une galerie d'images et le jeu de construction <em>Falukant</em>. Le site est actuellement en phase bêta - nous développons continuellement les fonctions, le contenu et la stabilité.",
|
||||
"introHtml": "YourPart est une plateforme en ligne qui combine des fonctions communautaires, un chat en temps réel, des forums, un réseau social avec une galerie d'images et le jeu de construction <em>Falukant</em>.",
|
||||
"storyTeaser": "YourPart regroupe une <strong>communauté en ligne</strong>, le chat en temps réel, des forums, des blogs, un <strong>entraîneur de vocabulaire gratuit</strong> et des <strong>jeux navigateur</strong>—dont le jeu de construction médiéval <em>Falukant</em>—<strong>sans téléchargement</strong>. Priorité : échanges, profondeur de jeu et univers qui grandit.",
|
||||
"expected": {
|
||||
"title": "Ce qui t'attend",
|
||||
@@ -72,9 +72,9 @@
|
||||
"title": "Falukant – brièvement expliqué",
|
||||
"text": "Chez Falukant, vous dirigez des entreprises, développez vos connaissances, optimisez la production et les ventes, surveillez les prix et réagissez aux événements. Les notifications vous informent des changements de statut en temps réel."
|
||||
},
|
||||
"privacyBeta": {
|
||||
"title": "Protection des données et statut bêta",
|
||||
"text": "YourPart est en version bêta. Des modifications, des échecs et des traductions manquantes peuvent survenir. Nous valorisons la protection des données et la transparence ; plus d'informations suivront pendant la version bêta."
|
||||
"privacyInfo": {
|
||||
"title": "Protection des données et transparence",
|
||||
"text": "YourPart accorde de l'importance à la protection des données, aux contacts clairs et aux informations transparentes sur les fonctions disponibles."
|
||||
},
|
||||
"getStarted": {
|
||||
"title": "Se joindre à",
|
||||
|
||||
@@ -3,6 +3,8 @@ const MinigamesLandingView = () => import('../views/public/MinigamesLandingView.
|
||||
const VocabLandingView = () => import('../views/public/VocabLandingView.vue');
|
||||
const BisayaLearningLandingView = () => import('../views/public/BisayaLearningLandingView.vue');
|
||||
const GermanForBisayaLandingView = () => import('../views/public/GermanForBisayaLandingView.vue');
|
||||
const GuideListView = () => import('../views/public/GuideListView.vue');
|
||||
const GuideArticleView = () => import('../views/public/GuideArticleView.vue');
|
||||
|
||||
const marketingRoutes = [
|
||||
{
|
||||
@@ -60,6 +62,29 @@ const marketingRoutes = [
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/ratgeber',
|
||||
name: 'GuideList',
|
||||
component: GuideListView,
|
||||
meta: {
|
||||
seo: {
|
||||
title: 'YourPart Ratgeber - Falukant, Vokabeltrainer, Community und Browsergames',
|
||||
description: 'Oeffentliche Ratgeber zu YourPart: Falukant, Vokabeltrainer, Bisaya lernen, Deutsch fuer Bisaya-Sprecher, Community, Blogs und Browsergames.',
|
||||
keywords: 'YourPart Ratgeber, Falukant Guide, Vokabeltrainer, Bisaya lernen, Deutsch lernen, Browsergames, Online Community',
|
||||
canonicalPath: '/ratgeber',
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/ratgeber/:slug',
|
||||
name: 'GuideArticle',
|
||||
component: GuideArticleView,
|
||||
meta: {
|
||||
seo: {
|
||||
canonicalPath: '/ratgeber',
|
||||
},
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
export default marketingRoutes;
|
||||
|
||||
@@ -1,8 +1,5 @@
|
||||
<template>
|
||||
<div class="no-login-view">
|
||||
<div class="beta-banner" role="status" aria-live="polite">
|
||||
<strong>{{ $t('home.betaNoticeLabel') }}</strong> {{ $t('home.betaNoticeText') }}
|
||||
</div>
|
||||
<div class="home-structure">
|
||||
<div class="mascot">
|
||||
<Character3D gender="male" :lightweight="true" />
|
||||
@@ -40,8 +37,8 @@
|
||||
<p>{{ $t('home.nologin.falukantShort.text') }}</p>
|
||||
</article>
|
||||
<article>
|
||||
<h3>{{ $t('home.nologin.privacyBeta.title') }}</h3>
|
||||
<p>{{ $t('home.nologin.privacyBeta.text') }}</p>
|
||||
<h3>{{ $t('home.nologin.privacyInfo.title') }}</h3>
|
||||
<p>{{ $t('home.nologin.privacyInfo.text') }}</p>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
@@ -259,18 +256,6 @@ export default {
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.beta-banner {
|
||||
width: min(100%, var(--content-max-width));
|
||||
background: linear-gradient(180deg, #fff2cf 0%, #fde7b2 100%);
|
||||
border: 1px solid rgba(201, 130, 31, 0.24);
|
||||
color: #8a5a12;
|
||||
padding: 10px 14px;
|
||||
margin: 0 0 14px 0;
|
||||
text-align: center;
|
||||
border-radius: var(--radius-lg);
|
||||
box-shadow: var(--shadow-soft);
|
||||
}
|
||||
|
||||
.home-structure {
|
||||
display: flex;
|
||||
align-items: stretch;
|
||||
|
||||
219
frontend/src/views/public/GuideArticleView.vue
Normal file
219
frontend/src/views/public/GuideArticleView.vue
Normal file
@@ -0,0 +1,219 @@
|
||||
<template>
|
||||
<main v-if="guide" class="guide-page">
|
||||
<nav class="breadcrumb" aria-label="Breadcrumb">
|
||||
<router-link to="/">YourPart</router-link>
|
||||
<span>/</span>
|
||||
<router-link to="/ratgeber">Ratgeber</router-link>
|
||||
<span>/</span>
|
||||
<span>{{ guide.category }}</span>
|
||||
</nav>
|
||||
|
||||
<article class="guide-article">
|
||||
<header class="guide-header">
|
||||
<p class="guide-category">{{ guide.category }}</p>
|
||||
<h1>{{ guide.title }}</h1>
|
||||
<p class="guide-description">{{ guide.description }}</p>
|
||||
<p class="guide-updated">Aktualisiert: {{ formattedDate }}</p>
|
||||
</header>
|
||||
|
||||
<section v-for="section in guide.sections" :key="section.heading" class="guide-section">
|
||||
<h2>{{ section.heading }}</h2>
|
||||
<p v-for="paragraph in section.paragraphs" :key="paragraph">{{ paragraph }}</p>
|
||||
</section>
|
||||
</article>
|
||||
|
||||
<aside class="related-guides" aria-label="Weitere Ratgeber">
|
||||
<h2>Weitere Ratgeber</h2>
|
||||
<ul>
|
||||
<li v-for="item in relatedGuides" :key="item.slug">
|
||||
<router-link :to="`/ratgeber/${item.slug}`">{{ item.title }}</router-link>
|
||||
</li>
|
||||
</ul>
|
||||
</aside>
|
||||
</main>
|
||||
|
||||
<main v-else class="guide-page">
|
||||
<article class="guide-article">
|
||||
<h1>Ratgeber nicht gefunden</h1>
|
||||
<p>Der gesuchte Beitrag ist nicht vorhanden.</p>
|
||||
<router-link to="/ratgeber">Zur Ratgeber-Übersicht</router-link>
|
||||
</article>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getPublicGuide, publicGuides } from '@/content/publicGuides.js';
|
||||
import { applySeo, buildAbsoluteUrl } from '@/utils/seo.js';
|
||||
|
||||
export default {
|
||||
name: 'GuideArticleView',
|
||||
computed: {
|
||||
guide() {
|
||||
return getPublicGuide(this.$route.params.slug);
|
||||
},
|
||||
formattedDate() {
|
||||
if (!this.guide?.updatedAt) return '';
|
||||
return new Date(this.guide.updatedAt).toLocaleDateString('de-DE');
|
||||
},
|
||||
relatedGuides() {
|
||||
if (!this.guide) return publicGuides.slice(0, 4);
|
||||
return publicGuides
|
||||
.filter((item) => item.slug !== this.guide.slug)
|
||||
.slice(0, 4);
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
'$route.params.slug': {
|
||||
immediate: true,
|
||||
handler() {
|
||||
this.applyGuideSeo();
|
||||
},
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
applyGuideSeo() {
|
||||
const guide = getPublicGuide(this.$route.params.slug);
|
||||
if (!guide) {
|
||||
applySeo({
|
||||
title: 'Ratgeber nicht gefunden | YourPart',
|
||||
description: 'Der gesuchte YourPart-Ratgeber ist nicht vorhanden.',
|
||||
canonicalPath: '/ratgeber',
|
||||
robots: 'noindex, follow',
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const canonicalPath = `/ratgeber/${guide.slug}`;
|
||||
applySeo({
|
||||
title: `${guide.title} | YourPart Ratgeber`,
|
||||
description: guide.description,
|
||||
keywords: `${guide.category}, YourPart, Ratgeber, Community, Vokabeltrainer, Falukant, Browsergames`,
|
||||
canonicalPath,
|
||||
robots: 'index, follow',
|
||||
type: 'article',
|
||||
lang: 'de',
|
||||
locale: 'de_DE',
|
||||
includeHreflangAlternates: false,
|
||||
jsonLd: [
|
||||
{
|
||||
'@context': 'https://schema.org',
|
||||
'@type': 'Article',
|
||||
headline: guide.title,
|
||||
description: guide.description,
|
||||
dateModified: guide.updatedAt,
|
||||
datePublished: guide.updatedAt,
|
||||
inLanguage: 'de',
|
||||
url: buildAbsoluteUrl(canonicalPath),
|
||||
publisher: {
|
||||
'@type': 'Organization',
|
||||
name: 'YourPart',
|
||||
url: buildAbsoluteUrl('/'),
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.guide-page {
|
||||
max-width: 980px;
|
||||
margin: 0 auto;
|
||||
padding: 32px 20px 72px;
|
||||
color: #253043;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
margin-bottom: 22px;
|
||||
font-size: 0.9rem;
|
||||
color: #5f6b7a;
|
||||
}
|
||||
|
||||
.breadcrumb a {
|
||||
color: #245da8;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.guide-article {
|
||||
max-width: 820px;
|
||||
}
|
||||
|
||||
.guide-header {
|
||||
margin-bottom: 34px;
|
||||
}
|
||||
|
||||
.guide-category {
|
||||
margin: 0 0 10px;
|
||||
color: #245da8;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.guide-header h1 {
|
||||
margin: 0;
|
||||
font-size: clamp(2rem, 4vw, 3rem);
|
||||
line-height: 1.12;
|
||||
}
|
||||
|
||||
.guide-description {
|
||||
margin: 18px 0 0;
|
||||
font-size: 1.12rem;
|
||||
line-height: 1.7;
|
||||
color: #46556a;
|
||||
}
|
||||
|
||||
.guide-updated {
|
||||
margin: 14px 0 0;
|
||||
color: #667085;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.guide-section {
|
||||
margin-top: 34px;
|
||||
}
|
||||
|
||||
.guide-section h2 {
|
||||
margin: 0 0 12px;
|
||||
font-size: 1.45rem;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.guide-section p {
|
||||
margin: 0 0 16px;
|
||||
font-size: 1.02rem;
|
||||
line-height: 1.78;
|
||||
}
|
||||
|
||||
.related-guides {
|
||||
margin-top: 48px;
|
||||
padding-top: 26px;
|
||||
border-top: 1px solid rgba(36, 93, 168, 0.16);
|
||||
}
|
||||
|
||||
.related-guides h2 {
|
||||
margin: 0 0 14px;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.related-guides ul {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||||
gap: 10px 18px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
.related-guides a {
|
||||
color: #245da8;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
}
|
||||
</style>
|
||||
107
frontend/src/views/public/GuideListView.vue
Normal file
107
frontend/src/views/public/GuideListView.vue
Normal file
@@ -0,0 +1,107 @@
|
||||
<template>
|
||||
<main class="guide-list-page">
|
||||
<header class="guide-list-header">
|
||||
<p class="guide-kicker">YourPart Ratgeber</p>
|
||||
<h1>Ratgeber zu Falukant, Vokabeltrainer, Community und Browsergames</h1>
|
||||
<p>
|
||||
Oeffentliche Artikel erklaeren die wichtigsten Bereiche von YourPart und geben neuen Besuchern genug Kontext,
|
||||
bevor sie ein Konto erstellen oder einen Kurs beziehungsweise ein Spiel starten.
|
||||
</p>
|
||||
</header>
|
||||
|
||||
<section class="guide-grid" aria-label="Ratgeber">
|
||||
<article v-for="guide in guides" :key="guide.slug" class="guide-card">
|
||||
<p>{{ guide.category }}</p>
|
||||
<h2>
|
||||
<router-link :to="`/ratgeber/${guide.slug}`">{{ guide.title }}</router-link>
|
||||
</h2>
|
||||
<span>{{ guide.description }}</span>
|
||||
</article>
|
||||
</section>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { publicGuides } from '@/content/publicGuides.js';
|
||||
|
||||
export default {
|
||||
name: 'GuideListView',
|
||||
computed: {
|
||||
guides() {
|
||||
return publicGuides;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.guide-list-page {
|
||||
max-width: 1120px;
|
||||
margin: 0 auto;
|
||||
padding: 44px 20px 72px;
|
||||
color: #253043;
|
||||
}
|
||||
|
||||
.guide-list-header {
|
||||
max-width: 820px;
|
||||
}
|
||||
|
||||
.guide-kicker {
|
||||
margin: 0 0 10px;
|
||||
color: #245da8;
|
||||
font-size: 0.85rem;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.guide-list-header h1 {
|
||||
margin: 0;
|
||||
font-size: clamp(2rem, 4vw, 3.2rem);
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
.guide-list-header p:last-child {
|
||||
margin: 18px 0 0;
|
||||
color: #46556a;
|
||||
font-size: 1.08rem;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.guide-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||||
gap: 18px;
|
||||
margin-top: 34px;
|
||||
}
|
||||
|
||||
.guide-card {
|
||||
padding: 22px;
|
||||
border: 1px solid rgba(36, 93, 168, 0.14);
|
||||
border-radius: 8px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.guide-card p {
|
||||
margin: 0 0 8px;
|
||||
color: #245da8;
|
||||
font-size: 0.78rem;
|
||||
font-weight: 800;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.guide-card h2 {
|
||||
margin: 0 0 10px;
|
||||
font-size: 1.16rem;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.guide-card a {
|
||||
color: #1d2b3f;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.guide-card span {
|
||||
color: #536276;
|
||||
line-height: 1.62;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user