elpatron/kapteins-daagbok
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Add Scandinavian i18n (da/sv/nb) via DeepL pipeline.

Browse Source 
Integrate new locale bundles, language cycling in the UI, SEO hreflang tags, and localized beta flyer HTML variants with scripts for batch translation and key validation.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
elpatron
2026-05-31 15:53:43 +02:00
parent 2e656dc6b2
commit 3749f87c1d
30 changed files with 3975 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/marketing/beta-flyer.da.html
+381
View File
@@ -0,0 +1,381 @@
<!DOCTYPE html>
<html lang="da">
<head>
<meta charset="UTF-8" />
<title>Kapteins Daagbok - Beta-flyer</title>
<style>
@page {
størrelse: A4 stående;
margin: 0;
}
* {
box-sizing: border-box;
margin: 0;
polstring: 0;
}
html, body {
bredde: 210mm;
højde: 297 mm;
font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
farve: #e2e8f0;
baggrund: #0f172a;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
.side {
bredde: 210mm;
højde: 297mm;
max-højde: 297mm;
polstring: 12mm 15mm 10mm;
display: flex;
flex-retning: kolonne;
mellemrum: 5 mm;
baggrund:
radial-gradient(ellipse 120% 80% ved 100% 0%, rgba(56, 189, 248, 0.12) 0%, transparent 55%),
radial-gradient(ellipse 90% 60% ved 0% 100%, rgba(134, 59, 255, 0.14) 0%, transparent 50%),
lineær-gradient(165deg, #0f172a 0%, #1e293b 45%, #0f172a 100%);
position: relative;
overløb: skjult;
}
.page::before {
indhold: "";
position: absolut;
indsat: 8 mm;
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 4mm;
pointer-events: none;
}
header {
display: flex;
align-items: center;
mellemrum: 5mm;
flex-krympning: 0;
position: relativ;
z-index: 1;
}
.logo {
bredde: 16mm;
højde: 16mm;
flex-krymp: 0;
object-fit: contain;
}
.title-block h1 {
skriftstørrelse: 23pt;
font-vægt: 700;
letter-spacing: -0.02em;
farve: #f8fafc;
linjehøjde: 1.1;
}
.title-block p {
skriftstørrelse: 12pt;
farve: #94a3b8;
margin-top: 1,5 mm;
}
.badge {
margin-left: auto;
align-self: flex-start;
baggrund: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
farve: #1e293b;
skriftstørrelse: 11pt;
font-vægt: 800;
letter-spacing: 0.12em;
polstring: 2,5 mm 4,5 mm;
border-radius: 2mm;
tekst-transformation: store bogstaver;
}
.intro {
skriftstørrelse: 12pt;
linjehøjde: 1,5;
farve: #cbd5e1;
flex-shrink: 0;
max-bredde: 95%;
position: relativ;
z-index: 1;
}
.intro strong {
farve: #f8fafc;
}
.screenshots {
display: grid;
grid-template-columns: repeat(3, 1fr);
mellemrum: 3 mm;
flex-shrink: 0;
position: relativ;
z-index: 1;
}
.screenshot-kort {
border-radius: 2,5 mm;
overløb: skjult;
border: 1px solid rgba(148, 163, 184, 0.22);
baggrund: rgba(15, 23, 42, 0.55);
display: flex;
flex-retning: kolonne;
min-bredde: 0;
}
.screenshot-kort img {
bredde: 100%;
højde: 50mm;
object-fit: contain;
object-position: top center;
display: block;
baggrund: #0b1220;
}
.screenshot-caption {
skriftstørrelse: 9pt;
farve: #94a3b8;
tekstjustering: center;
polstring: 1,5 mm 2 mm;
linjehøjde: 1,3;
flex-shrink: 0;
}
.funktioner {
display: grid;
grid-template-kolonner: 1fr 1fr;
mellemrum: 1,8 mm 6 mm;
flex-shrink: 0;
position: relativ;
z-index: 1;
}
.feature {
display: flex;
mellemrum: 2,5 mm;
align-items: flex-start;
skriftstørrelse: 10.5pt;
linjehøjde: 1,28;
farve: #e2e8f0;
}
.feature-icon {
farve: #38bdf8;
font-vægt: 700;
flex-krymp: 0;
bredde: 4mm;
}
.lang-liste {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
mellemrum: 1,5 mm;
}
.lang-item {
display: inline-flex;
align-items: center;
mellemrum: 1,2 mm;
white-space: nowrap;
}
.feature-flag {
display: inline-block;
bredde: 5 mm;
højde: 3,5 mm;
border-radius: 0,3 mm;
flex-shrink: 0;
box-shadow: 0 0 0 0.15mm rgba(0, 0, 0, 0.25);
}
.lang-sep {
farve: #94a3b8;
}
.beta-box {
baggrund: rgba(30, 41, 59, 0.85);
border: 1px solid rgba(251, 191, 36, 0.35);
border-left: 3px solid #fbbf24;
border-radius: 3mm;
polstring: 5mm 6mm;
flex-shrink: 0;
position: relativ;
z-index: 1;
}
.beta-box h2 {
skriftstørrelse: 12,5pt;
farve: #fbbf24;
margin-bund: 2mm;
font-vægt: 700;
}
.beta-box p {
skriftstørrelse: 10,5pt;
linjehøjde: 1,5;
farve: #cbd5e1;
}
.cta {
display: flex;
align-items: center;
mellemrum: 7mm;
baggrund: rgba(15, 23, 42, 0.6);
border: 1px solid rgba(148, 163, 184, 0.2);
border-radius: 4mm;
polstring: 5 mm 6 mm;
flex-shrink: 0;
position: relative;
z-index: 1;
}
.qr {
bredde: 32mm;
højde: 32mm;
baggrund: #fff;
polstring: 2 mm;
border-radius: 2 mm;
flex-shrink: 0;
}
.qr img {
width: 100%;
højde: 100%;
display: block;
}
.cta-tekst h3 {
skriftstørrelse: 14,5pt;
farve: #38bdf8;
font-vægt: 700;
margin-bund: 2mm;
}
.cta-text p {
skriftstørrelse: 11pt;
farve: #94a3b8;
linjehøjde: 1,5;
}
.tags {
display: flex;
flex-wrap: wrap;
mellemrum: 2mm;
margin-top: 3mm;
}
.tag {
skriftstørrelse: 9,5pt;
font-vægt: 600;
letter-spacing: 0.04em;
tekst-transformation: store bogstaver;
farve: #64748b;
border: 1px solid rgba(100, 116, 139, 0.4);
border-radius: 1,5 mm;
polstring: 1 mm 2,5 mm;
}
sidefod {
border-top: 1px solid rgba(148, 163, 184, 0.15);
padding-top: 3mm;
margin-top: auto;
flex-shrink: 0;
skriftstørrelse: 9,5pt;
linjehøjde: 1,5;
farve: #64748b;
position: relativ;
z-index: 1;
}
sidefod strong {
farve: #94a3b8;
font-vægt: 600;
}
</style>
</head>
<body>
<article class="page">
<header>
<img class="logo" src="../../client/public/logo.png" alt="Kapteins Daagbok" />
<div class="title-block">
<h1>Kapteins Daagbok</h1>
<p>Digital yachtlogbog - gratis og reklamefri</p>
</div>
<span class="badge">Beta</span>
</header>
<p class="intro">
Opbevar din logbog om bord digitalt: rejsedage, GPS-spor, besætnings- og skibsdata
<strong>End-to-end-krypteret</strong>kan installeres som en app og
<strong>også offline</strong> kan bruges til søs.
</p>
<section class="features" aria-label="Funktionen">
<div class="feature"><span class="feature-icon">✦</span><span>Rejsedage i nautisk logbogsformat (havn, vejr, sejl, besætning, brændstofniveauer)</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Offline-kompatibel PWA - kører på enhver smartphone og tablet</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Simpelt login uden adgangskode Passkey.</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Ende-til-ende-kryptering</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Upload af GPS-spor (GPX/KML) med kortvisning</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Rute-statistik</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Vedhæftede billeder pr. rejsedag</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Fotoavatarbilleder til skipper og besætning</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Inviter besætningen - arbejd sammen om logbogen</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>PDF- &amp; CSV-Export</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Krypteret sikkerhedskopiering og gendannelse</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Del logbog med venner</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Et vilkårligt antal skibe og logbøger</span></div>
<div class="feature"><span class="feature-icon">✦</span><span class="lang-list"><span class="lang-item"><svg class="feature-flag" viewBox="0 0 37 28" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="37" height="28" fill="#C8102E"/><rect x="12" width="4" height="28" fill="#fff"/><rect y="12" width="37" height="4" fill="#fff"/></svg>Dansk</span><span class="lang-sep">&amp;</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 5 3" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="5" height="1" fill="#000"/><rect y="1" width="5" height="1" fill="#D00"/><rect y="2" width="5" height="1" fill="#FFCE00"/></svg>Deutsch</span><span class="lang-sep">&amp;</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 60 30" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><clipPath id="gb-a"><path d="M0 0v30h60V0z"/></clipPath><clipPath id="gb-b"><path d="M30 15h30v15zv15H0z"/></clipPath><g clip-path="url(#gb-a)"><path d="M0 0v30h60V0z" fill="#012169"/><path d="M0 0l60 30m0-30L0 30" stroke="#fff" stroke-width="6"/><path d="M0 0l60 30m0-30L0 30" clip-path="url(#gb-b)" stroke="#C8102E" stroke-width="4"/><path d="M30 0v30M0 15h60" stroke="#fff" stroke-width="10"/><path d="M30 0v30M0 15h60" stroke="#C8102E" stroke-width="6"/></g></svg>Engelsk</span></span></div>
<div class="feature"><span class="feature-icon">✦</span><span>3 temaer, hver med en lys og en mørk variant</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Fremstillet i Kiel.Sailing.City..</span></div>
</section>
<section class="screenshots" aria-label="App-Screenshots">
<figure class="screenshot-card">
<img src="assets/screenshot-login.png" alt="Anmeldung mit Passkey und Demo" />
<figcaption class="screenshot-caption">Registrering &amp; Passkey</figcaption>
</figure>
<figure class="screenshot-card">
<img src="assets/screenshot-logbook.png" alt="Logbuch-Journal mit Reisetagen" />
<figcaption class="screenshot-caption">Logbogsdagbog</figcaption>
</figure>
<figure class="screenshot-card">
<img src="assets/screenshot-vessel.png" alt="Schiffs-Stammdaten mit Yachtfoto" />
<figcaption class="screenshot-caption">Skibsdata</figcaption>
</figure>
</section>
<section class="beta-box">
<h2>Betafase - din feedback tæller</h2>
<p>
Kapteins Daagbok er en<strong>Privat hobbyprojekt uden fortjeneste for øje</strong>.
Som betatester er du med til at forbedre appen for skippere og besætninger i hverdagen - feedback er meget velkommen.
Feedback er yderst velkommen.
</p>
</section>
<section class="cta">
<div class="qr">
<img src="assets/qr-kapteins-daagbok.eu.png" alt="QR-Code: kapteins-daagbok.eu" />
</div>
<div class="cta-text">
<h3>kapteins-daagbok.eu</h3>
<p>Åbn i browseren, eller tilføj som en app til startskærmen. Registrer dig hos Passkey - der kræves ingen app store.</p>
<div class="tags">
<span class="tag">Helt gratis</span>
<span class="tag">Gratis reklame</span>
<span class="tag">E2E-krypteret</span>
</div>
</div>
</section>
<footer>
<strong>Påtryk</strong><br />
KnorrLabs - Markus F.J. Busche - Knorrstr. 16 · 24106 Kiel - elpatron+kd@mailbox.org.
</footer>
</article>
</body>
</html>
docs/marketing/beta-flyer.html
+1 -1
View File
@@ -328,7 +328,7 @@
<div class="feature"><span class="feature-icon">✦</span><span>Verschlüsseltes Backup &amp; Wiederherstellung</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Logbuch mit Freunden teilen</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Beliebig viele Schiffe und Logbücher</span></div>
<div class="feature"><span class="feature-icon">✦</span><span class="lang-list"><span class="lang-item"><svg class="feature-flag" viewBox="0 0 5 3" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="5" height="1" fill="#000"/><rect y="1" width="5" height="1" fill="#D00"/><rect y="2" width="5" height="1" fill="#FFCE00"/></svg>Deutsch</span><span class="lang-sep">&amp;</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 60 30" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><clipPath id="gb-a"><path d="M0 0v30h60V0z"/></clipPath><clipPath id="gb-b"><path d="M30 15h30v15zv15H0z"/></clipPath><g clip-path="url(#gb-a)"><path d="M0 0v30h60V0z" fill="#012169"/><path d="M0 0l60 30m0-30L0 30" stroke="#fff" stroke-width="6"/><path d="M0 0l60 30m0-30L0 30" clip-path="url(#gb-b)" stroke="#C8102E" stroke-width="4"/><path d="M30 0v30M0 15h60" stroke="#fff" stroke-width="10"/><path d="M30 0v30M0 15h60" stroke="#C8102E" stroke-width="6"/></g></svg>Englisch</span></span></div>
<div class="feature"><span class="feature-icon">✦</span><span class="lang-list"><span class="lang-item"><svg class="feature-flag" viewBox="0 0 5 3" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="5" height="1" fill="#000"/><rect y="1" width="5" height="1" fill="#D00"/><rect y="2" width="5" height="1" fill="#FFCE00"/></svg>Deutsch</span><span class="lang-sep">·</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 60 30" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><clipPath id="gb-a"><path d="M0 0v30h60V0z"/></clipPath><clipPath id="gb-b"><path d="M30 15h30v15zv15H0z"/></clipPath><g clip-path="url(#gb-a)"><path d="M0 0v30h60V0z" fill="#012169"/><path d="M0 0l60 30m0-30L0 30" stroke="#fff" stroke-width="6"/><path d="M0 0l60 30m0-30L0 30" clip-path="url(#gb-b)" stroke="#C8102E" stroke-width="4"/><path d="M30 0v30M0 15h60" stroke="#fff" stroke-width="10"/><path d="M30 0v30M0 15h60" stroke="#C8102E" stroke-width="6"/></g></svg>Englisch</span><span class="lang-sep">·</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 37 28" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="37" height="28" fill="#C8102E"/><rect x="12" width="4" height="28" fill="#fff"/><rect y="12" width="37" height="4" fill="#fff"/></svg>Dansk</span><span class="lang-sep">·</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 16 10" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="16" height="10" fill="#006AA7"/><rect x="5" width="2" height="10" fill="#FECC00"/><rect y="4" width="16" height="2" fill="#FECC00"/></svg>Svenska</span><span class="lang-sep">·</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 22 16" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="22" height="16" fill="#BA0C2F"/><rect x="6" width="4" height="16" fill="#fff"/><rect y="6" width="22" height="4" fill="#fff"/><rect x="7" width="2" height="16" fill="#00205B"/><rect y="7" width="22" height="2" fill="#00205B"/></svg>Norsk</span></span></div>
<div class="feature"><span class="feature-icon">✦</span><span>3 Themes, jeweils mit heller und dunkler Variante</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Crafted in Kiel.Sailing.City.</span></div>
</section>
docs/marketing/beta-flyer.nb.html
+381
View File
@@ -0,0 +1,381 @@
<!DOCTYPE html>
<html lang="nb">
<head>
<meta charset="UTF-8" />
<title>Kapteins Daagbok - Beta-flygeblad</title>
<style>
@page {
størrelse: A4 stående;
margin: 0;
}
* {
box-sizing: border-box;
margin: 0;
polstring: 0;
}
html, body {
bredde: 210mm;
høyde: 297 mm;
font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
farge: #e2e8f0;
bakgrunn: #0f172a;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
.page {
bredde: 210mm;
høyde: 297mm;
max-høyde: 297mm;
polstring: 12mm 15mm 10mm;
display: flex;
flex-retning: kolonne;
mellomrom: 5 mm
bakgrunn:
radial-gradient(ellipse 120% 80% ved 100% 0%, rgba(56, 189, 248, 0.12) 0%, transparent 55%),
radial-gradient(ellipse 90% 60% på 0% 100%, rgba(134, 59, 255, 0.14) 0%, gjennomsiktig 50%),
lineær-gradient(165deg, #0f172a 0%, #1e293b 45%, #0f172a 100%);
posisjon: relativ;
overflow: skjult;
}
.page::before {
innhold: "";
posisjon: absolutt
inset: 8mm;
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 4mm;
pointer-events: none;
}
header {
display: flex;
align-items: center;
mellomrom: 5 mm
flex-krymp: 0;
posisjon: relativ;
z-index: 1;
}
.logo {
bredde: 16mm;
høyde: 16mm;
flex-krymp: 0;
object-fit: contain;
}
.title-block h1 {
skriftstørrelse: 23pt;
font-weight: 700;
bokstavavstand: -0.02em;
farge: #f8fafc;
linjehøyde: 1.1;
}
.title-block p {
skriftstørrelse: 12pt;
farge: #94a3b8;
margin-topp: 1,5 mm;
}
.badge {
margin-left: auto;
align-self: flex-start;
bakgrunn: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
farge: #1e293b;
font-size: 11pt;
font-weight: 800;
bokstavavstand: 0,12em;
polstring: 2,5 mm 4,5 mm;
border-radius: 2mm;
tekst-transformasjon: versaler;
}
.intro {
skriftstørrelse: 12pt;
linjehøyde: 1,5
farge: #cbd5e1;
flex-krymp: 0;
max-width: 95%;
posisjon: relativ;
z-index: 1;
}
.intro strong {
farge: #f8fafc;
}
.skjermbilder {
display: grid;
grid-template-columns: repeat(3, 1fr);
mellomrom: 3 mm
flex-krymp: 0;
posisjon: relativ;
z-index: 1;
}
.skjermbilde-kort {
border-radius: 2,5 mm;
overflow: skjult;
border: 1px solid rgba(148, 163, 184, 0.22);
bakgrunn: rgba(15, 23, 42, 0.55);
display: flex;
flex-retning: kolonne;
min-width: 0;
}
.screenshot-card img {
bredde: 100 %;
høyde: 50mm;
object-fit: contain;
objekt-posisjon: øverst i midten;
display: block;
bakgrunn: #0b1220;
}
.screenshot-caption {
font-size: 9pt;
farge: #94a3b8;
tekstjustering: midt;
polstring: 1.5mm 2mm;
linjehøyde: 1.3
flex-krymping: 0;
}
.features {
display: grid;
grid-template-kolonner: 1fr 1fr;
gap: 1,8 mm 6 mm
flex-krymp: 0;
posisjon: relativ;
z-index: 1;
}
.feature {
display: flex;
mellomrom: 2,5 mm;
align-items: flex-start;
font-size: 10.5pt;
linjehøyde: 1,28
farge: #e2e8f0;
}
.feature-icon {
farge: #38bdf8;
font-weight: 700;
flex-krymp: 0;
bredde: 4mm;
}
.lang-list {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
mellomrom: 1,5 mm;
}
.lang-item {
display: inline-flex;
align-items: center;
mellomrom: 1,2 mm;
white-space: nowrap;
}
.feature-flag {
display: inline-block;
bredde: 5 mm;
høyde: 3,5 mm;
border-radius: 0,3 mm
flex-krymping: 0;
box-shadow: 0 0 0 0 0,15mm rgba(0, 0, 0, 0, 0,25);
}
.lang-sep {
farge: #94a3b8;
}
.beta-box {
bakgrunn: rgba(30, 41, 59, 0.85);
border: 1px solid rgba(251, 191, 36, 0.35);
border-left: 3px solid #fbbf24;
border-radius: 3mm;
polstring: 5mm 6mm
flex-krymp: 0;
posisjon: relativ;
z-index: 1;
}
.beta-box h2 {
skriftstørrelse: 12,5pt;
farge: #fbbf24;
margin-bunn: 2 mm
font-weight: 700;
}
.beta-box p {
skriftstørrelse: 10,5pt;
linjehøyde: 1,5
farge: #cbd5e1;
}
.cta {
display: flex;
align-items: center;
mellomrom: 7mm;
bakgrunn: rgba(15, 23, 42, 0.6);
border: 1px solid rgba(148, 163, 184, 0.2);
border-radius: 4mm;
polstring: 5 mm 6 mm
flex-krymp: 0;
posisjon: relativ;
z-index: 1;
}
.qr {
bredde: 32mm;
høyde: 32mm;
bakgrunn: #fff;
polstring: 2mm;
border-radius: 2mm;
flex-krymp: 0;
}
.qr img {
bredde: 100 %;
høyde: 100 %;
display: block;
}
.cta-text h3 {
skriftstørrelse: 14,5pt;
farge: #38bdf8;
font-vekt: 700
margin-bunn: 2mm;
}
.cta-text p {
skriftstørrelse: 11pt;
farge: #94a3b8;
linjehøyde: 1,5;
}
.tags {
display: flex;
flex-wrap: wrap;
mellomrom: 2mm;
margin-top: 3mm;
}
.tag {
skriftstørrelse: 9,5pt;
font-weight: 600;
bokstavavstand: 0.04em;
tekst-transformasjon: store bokstaver;
farge: #64748b;
border: 1px solid rgba(100, 116, 139, 0.4);
border-radius: 1,5 mm
polstring: 1 mm 2,5 mm;
}
bunntekst {
border-top: 1px solid rgba(148, 163, 184, 0.15);
padding-top: 3mm;
margin-topp: auto;
flex-krymp: 0;
skriftstørrelse: 9,5pt;
linjehøyde: 1,5
farge: #64748b;
posisjon: relativ;
z-index: 1;
}
bunntekst strong {
farge: #94a3b8;
font-weight: 600;
}
</style>
</head>
<body>
<article class="page">
<header>
<img class="logo" src="../../client/public/logo.png" alt="Kapteins Daagbok" />
<div class="title-block">
<h1>Kapteins Daagbok</h1>
<p>Digital loggbok for fritidsbåter - gratis og reklamefri</p>
</div>
<span class="badge">Beta</span>
</header>
<p class="intro">
Før loggboken om bord digitalt: reisedager, GPS-spor, mannskaps- og skipsdata
<strong>Ende-til-ende-kryptert</strong>kan installeres som en app og
<strong>også offline</strong> kan brukes til sjøs.
</p>
<section class="features" aria-label="Funktionen">
<div class="feature"><span class="feature-icon">✦</span><span>Reisedager i nautisk loggbokformat (havn, vær, seil, mannskap, drivstoffnivå)</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Offline-kompatibel PWA - kjører på alle smarttelefoner og nettbrett</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Enkel passordfri Passkey-pålogging</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Ende-til-ende-kryptering</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Opplasting av GPS-spor (GPX/KML) med kartvisning</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Rutestatistikk</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Fotobilag per reisedag</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Avatarbilder for skipper og mannskap</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Inviter mannskapet - samarbeid om loggboken</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>PDF- &amp; CSV-Export</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Kryptert sikkerhetskopiering og gjenoppretting</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Del loggboken med venner</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Et hvilket som helst antall skip og loggbøker</span></div>
<div class="feature"><span class="feature-icon">✦</span><span class="lang-list"><span class="lang-item"><svg class="feature-flag" viewBox="0 0 22 16" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="22" height="16" fill="#BA0C2F"/><rect x="6" width="4" height="16" fill="#fff"/><rect y="6" width="22" height="4" fill="#fff"/><rect x="7" width="2" height="16" fill="#00205B"/><rect y="7" width="22" height="2" fill="#00205B"/></svg>Norsk</span><span class="lang-sep">&amp;</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 5 3" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="5" height="1" fill="#000"/><rect y="1" width="5" height="1" fill="#D00"/><rect y="2" width="5" height="1" fill="#FFCE00"/></svg>Deutsch</span><span class="lang-sep">&amp;</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 60 30" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><clipPath id="gb-a"><path d="M0 0v30h60V0z"/></clipPath><clipPath id="gb-b"><path d="M30 15h30v15zv15H0z"/></clipPath><g clip-path="url(#gb-a)"><path d="M0 0v30h60V0z" fill="#012169"/><path d="M0 0l60 30m0-30L0 30" stroke="#fff" stroke-width="6"/><path d="M0 0l60 30m0-30L0 30" clip-path="url(#gb-b)" stroke="#C8102E" stroke-width="4"/><path d="M30 0v30M0 15h60" stroke="#fff" stroke-width="10"/><path d="M30 0v30M0 15h60" stroke="#C8102E" stroke-width="6"/></g></svg>Engelsk</span></span></div>
<div class="feature"><span class="feature-icon">✦</span><span>3 temaer, hvert med en lys og en mørk variant</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Laget i Kiel.Sailing.City..</span></div>
</section>
<section class="screenshots" aria-label="App-Screenshots">
<figure class="screenshot-card">
<img src="assets/screenshot-login.png" alt="Anmeldung mit Passkey und Demo" />
<figcaption class="screenshot-caption">Registrering &amp; Passkey</figcaption>
</figure>
<figure class="screenshot-card">
<img src="assets/screenshot-logbook.png" alt="Logbuch-Journal mit Reisetagen" />
<figcaption class="screenshot-caption">Loggbokdagbok</figcaption>
</figure>
<figure class="screenshot-card">
<img src="assets/screenshot-vessel.png" alt="Schiffs-Stammdaten mit Yachtfoto" />
<figcaption class="screenshot-caption">Skipsdata</figcaption>
</figure>
</section>
<section class="beta-box">
<h2>Betafasen - dine tilbakemeldinger teller</h2>
<p>
Kapteins Daagbok er en<strong>Privat hobbyprosjekt uten profitthensikt</strong>.
Som betatester bidrar du til å forbedre appen for skippere og mannskap i hverdagen - tilbakemeldinger er hjertelig velkomne.
Tilbakemeldinger er hjertelig velkomne.
</p>
</section>
<section class="cta">
<div class="qr">
<img src="assets/qr-kapteins-daagbok.eu.png" alt="QR-Code: kapteins-daagbok.eu" />
</div>
<div class="cta-text">
<h3>kapteins-daagbok.eu</h3>
<p>Åpne i nettleseren eller legg til som en app på startskjermen. Registrer deg med Passkey - ingen appbutikk er nødvendig.</p>
<div class="tags">
<span class="tag">Kostnadsfritt</span>
<span class="tag">Reklame gratis</span>
<span class="tag">E2E-kryptert</span>
</div>
</div>
</section>
<footer>
<strong>Avtrykk</strong><br />
KnorrLabs - Markus F.J. Busche - Knorrstr. 16 · 24106 Kiel - elpatron+kd@mailbox.org - Knorrstr. 16 · 24106 Kiel - elpatron+kd@mailbox.org
</footer>
</article>
</body>
</html>
docs/marketing/beta-flyer.sv.html
+381
View File
@@ -0,0 +1,381 @@
<!DOCTYPE html>
<html lang="sv">
<head>
<meta charset="UTF-8" />
<title>Kapteins Daagbok - Beta-flygblad</title>
<style>
@page {
storlek: A4 stående;
marginal: 0;
}
* {
box-storlek: border-box;
marginal: 0;
stoppning: 0;
}
html, kropp {
bredd: 210 mm;
höjd: 297 mm;
font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
färg: #e2e8f0;
bakgrund: #0f172a;
-webkit-print-color-adjust: exakt;
justering av utskriftsfärg: exakt;
}
.sida {
bredd: 210 mm;
höjd: 297 mm;
max-höjd: 297 mm;
stoppning: 12mm 15mm 10mm;
display: flex;
flex-riktning: kolumn;
mellanrum: 5mm;
bakgrund:
radial-gradient(ellips 120% 80% vid 100% 0%, rgba(56, 189, 248, 0.12) 0%, transparent 55%),
radial-gradient(ellips 90% 60% på 0% 100%, rgba(134, 59, 255, 0.14) 0%, transparent 50%),
linjär-gradient(165deg, #0f172a 0%, #1e293b 45%, #0f172a 100%);
position: relativ;
överflöd: dold;
}
.page::before {
innehåll: "";
position: absolut;
inskjutet: 8mm;
border: 1px solid rgba(148, 163, 184, 0.18);
gränsradie: 4mm;
pekare-händelser: ingen;
}
sidhuvud {
display: flex;
align-items: center;
mellanrum: 5mm;
flex-krympning: 0;
position: relativ;
z-index: 1;
}
.logo {
bredd: 16mm;
höjd: 16 mm;
flex-krympning: 0;
objektanpassning: innehålla;
}
.title-block h1 {
teckenstorlek: 23pt;
typsnittsvikt: 700;
bokstavsavstånd: -0,02em;
färg: #f8fafc;
Linjehöjd: 1.1;
}
.title-block p {
teckenstorlek: 12pt;
färg: #94a3b8;
marginal-topp: 1,5 mm;
}
.badge {
marginal-vänster: auto;
align-self: flex-start;
bakgrund: linjär-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
färg: #1e293b;
font-storlek: 11pt;
typsnittsvikt: 800;
bokstavsavstånd: 0.12em;
stoppning: 2,5 mm 4,5 mm;
gränsradie: 2mm;
text-transform: versaler;
}
.intro {
teckenstorlek: 12pt;
radhöjd: 1,5;
färg: #cbd5e1;
flex-krympning: 0;
max-bredd: 95%;
position: relativ;
z-index: 1;
}
.intro strong {
färg: #f8fafc;
}
.skärmdumpar {
display: rutnät;
grid-template-kolumner: repeat(3, 1fr);
mellanrum: 3mm;
flex-krympning: 0;
position: relativ;
z-index: 1;
}
.skärmdump-kort {
gränsradie: 2,5 mm;
överflöde: dold;
kant: 1px solid rgba(148, 163, 184, 0.22);
bakgrund: rgba(15, 23, 42, 0.55);
display: flex;
flex-riktning: kolumn;
min-bredd: 0;
}
.skärmdumpskort img {
bredd: 100%;
höjd: 50mm;
objektanpassning: innehålla;
objekt-position: övre mitten;
display: block;
bakgrund: #0b1220;
}
.skärmdump-bildtext {
teckenstorlek: 9pt;
färg: #94a3b8;
text-align: center;
stoppning: 1,5 mm 2 mm;
Linjehöjd: 1,3;
flex-krympning: 0;
}
.funktioner {
display: rutnät;
grid-template-kolumner: 1fr 1fr;
mellanrum: 1,8mm 6mm;
flex-krympning: 0;
position: relativ;
z-index: 1;
}
.feature {
display: flex;
mellanrum: 2,5 mm;
linje-objekt: flex-start;
teckenstorlek: 10,5pt;
radhöjd: 1,28;
färg: #e2e8f0;
}
.feature-ikon {
färg: #38bdf8;
typsnittsvikt: 700;
flex-krympning: 0;
bredd: 4 mm;
}
.lang-lista {
display: inline-flex;
flex-wrap: wrap;
linje-punkter: mitt;
mellanrum: 1,5 mm;
}
.lang-objekt {
display: inline-flex;
anpassa objekt: mitt;
mellanrum: 1,2 mm;
white-space: nowrap;
}
.feature-flag {
display: inline-block;
bredd: 5mm;
höjd: 3,5 mm;
gränsradie: 0,3 mm;
flex-krympning: 0;
box-shadow: 0 0 0 0,15mm rgba(0, 0, 0, 0, 0,25);
}
.lang-sep {
färg: #94a3b8;
}
.beta-box {
bakgrund: rgba(30, 41, 59, 0,85);
border: 1px solid rgba(251, 191, 36, 0.35);
gräns-vänster: 3px solid #fbbf24;
gränsradie: 3mm;
stoppning: 5mm 6mm;
flex-krympning: 0;
position: relativ;
z-index: 1;
}
.beta-box h2 {
teckenstorlek: 12,5pt;
färg: #fbbf24;
marginal-botten: 2mm;
typsnittsvikt: 700;
}
.beta-box p {
teckenstorlek: 10,5pt;
Linjehöjd: 1,5;
färg: #cbd5e1;
}
.cta {
display: flex;
justera-objekt: mitt;
mellanrum: 7mm;
bakgrund: rgba(15, 23, 42, 0.6);
border: 1px solid rgba(148, 163, 184, 0.2);
gränsradie: 4mm;
stoppning: 5mm 6mm;
flex-krympning: 0;
position: relativ;
z-index: 1;
}
.qr {
bredd: 32mm;
höjd: 32 mm;
bakgrund: #fff;
stoppning: 2mm;
gräns-radie: 2mm;
flex-krympning: 0;
}
.qr img {
bredd: 100%;
höjd: 100%;
display: block;
}
.cta-text h3 {
teckenstorlek: 14,5pt;
färg: #38bdf8;
typsnittsvikt: 700;
marginal-botten: 2mm;
}
.cta-text p {
teckenstorlek: 11pt;
färg: #94a3b8;
Linjehöjd: 1,5;
}
.tags {
display: flex;
flex-wrap: wrap;
mellanrum: 2mm;
marginal-topp: 3mm;
}
.tag {
teckenstorlek: 9,5pt;
typsnittsvikt: 600;
bokstavsavstånd: 0.04em;
text-transform: versaler;
färg: #64748b;
border: 1px solid rgba(100, 116, 139, 0.4);
gränsradie: 1,5 mm;
stoppning: 1 mm 2,5 mm;
}
sidfot {
border-top: 1px solid rgba(148, 163, 184, 0.15);
stoppning-topp: 3mm;
marginal-topp: auto;
flex-krympning: 0;
teckenstorlek: 9,5pt;
Linjehöjd: 1,5;
färg: #64748b;
position: relativ;
z-index: 1;
}
sidfot strong {
färg: #94a3b8;
typsnittsvikt: 600;
}
</style>
</head>
<body>
<article class="page">
<header>
<img class="logo" src="../../client/public/logo.png" alt="Kapteins Daagbok" />
<div class="title-block">
<h1>Kapteins Daagbok</h1>
<p>Digital loggbok för båtar - gratis &amp; reklamfri</p>
</div>
<span class="badge">Beta</span>
</header>
<p class="intro">
Förvara din loggbok ombord digitalt: resdagar, GPS-spår, besättnings- och fartygsdata
<strong>End-to-end-kryptering</strong>kan installeras som en app och
<strong>också offline</strong> användbar till sjöss.
</p>
<section class="features" aria-label="Funktionen">
<div class="feature"><span class="feature-icon">✦</span><span>Resdagar i nautiskt loggboksformat (hamn, väder, segel, besättning, bränslenivåer)</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Offline-kompatibel PWA - körs på alla smartphones och surfplattor</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Enkel lösenordsfri Passkey-inloggning</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>End-to-end-kryptering</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Uppladdning av GPS-spår (GPX/KML) med kartvisning</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Statistik över rutter</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Fotobilagor per resdag</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Fotoavatarbilder för skeppare och besättning</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Bjud in besättningen - arbeta tillsammans med loggboken</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>PDF- &amp; CSV-Export</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Krypterad säkerhetskopiering och återställning</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Dela loggbok med vänner</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Valfritt antal fartyg och loggböcker</span></div>
<div class="feature"><span class="feature-icon">✦</span><span class="lang-list"><span class="lang-item"><svg class="feature-flag" viewBox="0 0 16 10" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="16" height="10" fill="#006AA7"/><rect x="5" width="2" height="10" fill="#FECC00"/><rect y="4" width="16" height="2" fill="#FECC00"/></svg>Svenska</span><span class="lang-sep">&amp;</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 5 3" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><rect width="5" height="1" fill="#000"/><rect y="1" width="5" height="1" fill="#D00"/><rect y="2" width="5" height="1" fill="#FFCE00"/></svg>Deutsch</span><span class="lang-sep">&amp;</span><span class="lang-item"><svg class="feature-flag" viewBox="0 0 60 30" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><clipPath id="gb-a"><path d="M0 0v30h60V0z"/></clipPath><clipPath id="gb-b"><path d="M30 15h30v15zv15H0z"/></clipPath><g clip-path="url(#gb-a)"><path d="M0 0v30h60V0z" fill="#012169"/><path d="M0 0l60 30m0-30L0 30" stroke="#fff" stroke-width="6"/><path d="M0 0l60 30m0-30L0 30" clip-path="url(#gb-b)" stroke="#C8102E" stroke-width="4"/><path d="M30 0v30M0 15h60" stroke="#fff" stroke-width="10"/><path d="M30 0v30M0 15h60" stroke="#C8102E" stroke-width="6"/></g></svg>Engelsk</span></span></div>
<div class="feature"><span class="feature-icon">✦</span><span>3 teman, vart och ett med en ljus och en mörk variant</span></div>
<div class="feature"><span class="feature-icon">✦</span><span>Tillverkad i Kiel.Sailing.City..</span></div>
</section>
<section class="screenshots" aria-label="App-Screenshots">
<figure class="screenshot-card">
<img src="assets/screenshot-login.png" alt="Anmeldung mit Passkey und Demo" />
<figcaption class="screenshot-caption">Registrering &amp; Passkey</figcaption>
</figure>
<figure class="screenshot-card">
<img src="assets/screenshot-logbook.png" alt="Logbuch-Journal mit Reisetagen" />
<figcaption class="screenshot-caption">Loggboksjournal</figcaption>
</figure>
<figure class="screenshot-card">
<img src="assets/screenshot-vessel.png" alt="Schiffs-Stammdaten mit Yachtfoto" />
<figcaption class="screenshot-caption">Fartygsdata</figcaption>
</figure>
</section>
<section class="beta-box">
<h2>Betafas - din feedback är viktig</h2>
<p>
Kapteins Daagbok är en<strong>Privat hobbyprojekt utan vinstsyfte</strong>.
Som betatestare hjälper du till att förbättra appen för skeppare och besättning i vardagen - feedback är uttryckligen välkommen.
Feedback är uttryckligen välkommen.
</p>
</section>
<section class="cta">
<div class="qr">
<img src="assets/qr-kapteins-daagbok.eu.png" alt="QR-Code: kapteins-daagbok.eu" />
</div>
<div class="cta-text">
<h3>kapteins-daagbok.eu</h3>
<p>Öppna i webbläsaren eller lägg till som en app på hemskärmen. Registrera dig med Passkey - ingen appbutik krävs.</p>
<div class="tags">
<span class="tag">Kostnadsfritt</span>
<span class="tag">Reklamfri</span>
<span class="tag">E2E-krypterad</span>
</div>
</div>
</section>
<footer>
<strong>Avtryck</strong><br />
KnorrLabs - Markus F.J. Busche - Knorrstr. 16 · 24106 Kiel - elpatron+kd@mailbox.org
</footer>
</article>
</body>
</html>