jbergner
33e971bab7
All checks were successful
release-tag / release-image (push) Successful in 1m57s
138 lines
6.0 KiB
HTML
138 lines
6.0 KiB
HTML
{{define "marketing.html"}}
|
|
<!doctype html>
|
|
<html lang="{{.Lang}}">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>{{.Name}} · {{.Marketing.NavFeatures}}</title>
|
|
<meta name="description" content="{{.Marketing.MetaDescription}}">
|
|
<link rel="canonical" href="{{.BaseURL}}/product?lang={{.Lang}}">
|
|
{{if not .WhiteLabel}}
|
|
<meta name="theme-color" content="#F8FAFC">
|
|
<link rel="icon" href="/static/brand/favicon.ico" sizes="any">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/static/brand/ucng-icon-32.png">
|
|
<link rel="icon" type="image/png" sizes="192x192" href="/static/brand/ucng-icon-192.png">
|
|
<link rel="icon" type="image/png" sizes="512x512" href="/static/brand/ucng-icon-512.png">
|
|
<link rel="apple-touch-icon" sizes="192x192" href="/static/brand/ucng-icon-192.png">
|
|
<meta property="og:image" content="{{.BaseURL}}/static/brand/ucng-open-graph.png">
|
|
<meta property="og:image:width" content="1200">
|
|
<meta property="og:image:height" content="630">
|
|
{{end}}
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
</head>
|
|
<body class="marketing-page">
|
|
<header class="site-header marketing-header">
|
|
<a class="brand" href="/product?lang={{.Lang}}">{{if .WhiteLabel}}<span class="brand-text">{{.Name}}</span>{{else}}<img src="/static/brand/ucng-logo.png" width="800" height="233" alt="UCNG — Universal Content Notation Guidelines">{{end}}</a>
|
|
<nav>
|
|
<a href="#features">{{.Marketing.NavFeatures}}</a>
|
|
<a href="#install">{{.Marketing.NavInstall}}</a>
|
|
<a href="/?lang={{.Lang}}#generator">{{.Marketing.NavGenerator}}</a>
|
|
<a href="/background?lang={{.Lang}}">{{.Marketing.NavBackground}}</a>
|
|
</nav>
|
|
<label class="language-switch"><span class="sr-only">{{.Marketing.LanguageLabel}}</span><select id="marketing-language">
|
|
{{range .Languages}}<option value="{{.Code}}" {{if eq $.Lang .Code}}selected{{end}}>{{.Name}}</option>{{end}}
|
|
</select></label>
|
|
</header>
|
|
|
|
<main class="marketing-main">
|
|
<section class="marketing-hero">
|
|
<div class="marketing-hero-copy">
|
|
<p class="eyebrow">{{.Marketing.HeroEyebrow}}</p>
|
|
<h1>{{.Marketing.HeroTitle}}</h1>
|
|
<p class="lead">{{.Marketing.HeroLead}}</p>
|
|
<div class="cta-row">
|
|
<a class="button primary" href="/?lang={{.Lang}}#generator">{{.Marketing.PrimaryCTA}}</a>
|
|
</div>
|
|
<ul class="proof-list" aria-label="Product highlights">
|
|
{{range .Marketing.Proof}}<li>{{.}}</li>{{end}}
|
|
</ul>
|
|
</div>
|
|
<div class="product-demo" aria-label="Badge examples">
|
|
<div class="demo-window">
|
|
<div class="demo-bar"><span></span><span></span><span></span></div>
|
|
<div class="demo-content">
|
|
<p class="demo-url">{{.BaseURL}}/badge/research.svg</p>
|
|
<img src="/badge/research.svg?lang={{.Lang}}&theme=color" alt="Research badge">
|
|
<img src="/badge/summary.svg?lang={{.Lang}}&theme=mono" alt="Summary badge">
|
|
<img src="/badge/full.svg?lang={{.Lang}}&theme=color" alt="Full generation badge">
|
|
<pre><code>{
|
|
"@type": "AIUsageDeclaration",
|
|
"schemaVersion": "1.2",
|
|
"assurance": "selfDeclared"
|
|
}</code></pre>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section id="features" class="marketing-section">
|
|
<div class="section-heading">
|
|
<p class="eyebrow">{{.Marketing.FeaturesEyebrow}}</p>
|
|
<h2>{{.Marketing.FeaturesTitle}}</h2>
|
|
<p>{{.Marketing.FeaturesLead}}</p>
|
|
</div>
|
|
<div class="feature-grid">
|
|
{{range .Marketing.Features}}
|
|
<article class="feature-card">
|
|
<p class="feature-kicker">{{.Kicker}}</p>
|
|
<h3>{{.Title}}</h3>
|
|
<p>{{.Description}}</p>
|
|
</article>
|
|
{{end}}
|
|
</div>
|
|
</section>
|
|
|
|
<section id="install" class="marketing-section install-section">
|
|
<div class="section-heading">
|
|
<p class="eyebrow">{{.Marketing.InstallEyebrow}}</p>
|
|
<h2>{{.Marketing.InstallTitle}}</h2>
|
|
<p>{{.Marketing.InstallLead}}</p>
|
|
</div>
|
|
<div class="install-list">
|
|
{{range $index, $method := .Marketing.InstallMethods}}
|
|
<details class="install-method" {{if eq $index 0}}open{{end}}>
|
|
<summary><span><strong>{{$method.Title}}</strong><small>{{$method.Summary}}</small></span><span aria-hidden="true">+</span></summary>
|
|
<div class="code-block">
|
|
<button type="button" class="copy-code" data-copy-target="install-{{$method.ID}}" data-label="{{$.Marketing.CopyLabel}}" data-copied="{{$.Marketing.CopiedLabel}}">{{$.Marketing.CopyLabel}}</button>
|
|
<pre id="install-{{$method.ID}}"><code>{{$method.Code}}</code></pre>
|
|
</div>
|
|
</details>
|
|
{{end}}
|
|
</div>
|
|
|
|
<div class="config-panel">
|
|
<h3>{{.Marketing.ConfigTitle}}</h3>
|
|
<div class="comparison-wrap">
|
|
<table class="config-table">
|
|
<thead><tr><th>{{.Marketing.ConfigVariable}}</th><th>{{.Marketing.ConfigDefault}}</th><th>{{.Marketing.ConfigMeaning}}</th></tr></thead>
|
|
<tbody>{{range .Marketing.Config}}<tr><td><code>{{.Name}}</code></td><td><code>{{.Default}}</code></td><td>{{.Description}}</td></tr>{{end}}</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="marketing-section faq-section">
|
|
<div class="section-heading">
|
|
<p class="eyebrow">{{.Marketing.FAQEyebrow}}</p>
|
|
<h2>{{.Marketing.FAQTitle}}</h2>
|
|
</div>
|
|
<div class="faq-grid">
|
|
{{range .Marketing.FAQs}}<details><summary>{{.Question}}</summary><p>{{.Answer}}</p></details>{{end}}
|
|
</div>
|
|
</section>
|
|
|
|
<section class="final-cta">
|
|
<h2>{{.Marketing.FinalTitle}}</h2>
|
|
<p>{{.Marketing.FinalLead}}</p>
|
|
<div class="cta-row">
|
|
<a class="button primary" href="/?lang={{.Lang}}#generator">{{.Marketing.FinalPrimary}}</a>
|
|
</div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer><span>{{if not .WhiteLabel}}{{.Marketing.Footer}}{{end}}</span><span><a href="/legal?lang={{.Lang}}">{{legalLabel .Lang "legal"}}</a> · <a href="/privacy?lang={{.Lang}}">{{legalLabel .Lang "privacy"}}</a> · <a href="/accessibility?lang={{.Lang}}">{{legalLabel .Lang "accessibility"}}</a></span></footer>
|
|
<script src="/static/marketing.js" defer></script>
|
|
</body>
|
|
</html>
|
|
{{end}}
|