move to top banner
This commit is contained in:
@@ -5,18 +5,20 @@
|
||||
</head>
|
||||
<body id="top">
|
||||
<a class="skip" href="#content">Skip to content</a>
|
||||
<div class="page">
|
||||
{{ partial "header.html" . }}
|
||||
<main class="col" id="content" tabindex="-1">
|
||||
{{ block "main" . }}{{ end }}
|
||||
{{ partial "footer.html" . }}
|
||||
</main>
|
||||
</div>
|
||||
{{ partial "header.html" . }}
|
||||
<main id="content" tabindex="-1">
|
||||
{{ block "main" . }}{{ end }}
|
||||
</main>
|
||||
{{ partial "footer.html" . }}
|
||||
<script>
|
||||
/* Progressive only: fade sections in as they scroll into view, and mark
|
||||
the rail's "On this page" link for the section being read. */
|
||||
/* Progressive only: fade sections in as they scroll into view, and
|
||||
darken the top bar once the page has scrolled. */
|
||||
(function () {
|
||||
var root = document.documentElement;
|
||||
var head = document.querySelector('.site-head');
|
||||
function onScroll() { if (head) head.classList.toggle('is-scrolled', scrollY > 8); }
|
||||
addEventListener('scroll', onScroll, { passive: true });
|
||||
onScroll();
|
||||
if (!('IntersectionObserver' in window)) return;
|
||||
root.classList.add('js');
|
||||
|
||||
@@ -26,21 +28,6 @@
|
||||
});
|
||||
}, { rootMargin: '0px 0px -8% 0px' });
|
||||
document.querySelectorAll('[data-reveal]').forEach(function (el) { io.observe(el); });
|
||||
|
||||
var links = [].slice.call(document.querySelectorAll('.nav-here a'));
|
||||
if (!links.length) return;
|
||||
var targets = links.map(function (a) { return document.getElementById(decodeURIComponent(a.hash.slice(1))); });
|
||||
var ticking = false;
|
||||
function update() {
|
||||
ticking = false;
|
||||
var current = -1;
|
||||
targets.forEach(function (t, i) { if (t && t.getBoundingClientRect().top < innerHeight * 0.3) current = i; });
|
||||
links.forEach(function (a, i) {
|
||||
if (i === current) a.setAttribute('aria-current', 'location'); else a.removeAttribute('aria-current');
|
||||
});
|
||||
}
|
||||
addEventListener('scroll', function () { if (!ticking) { ticking = true; requestAnimationFrame(update); } }, { passive: true });
|
||||
update();
|
||||
})();
|
||||
|
||||
/* Pricing: a link to a plan panel's id (e.g. /pricing/#hosted) selects its tab. */
|
||||
|
||||
@@ -1,10 +1,14 @@
|
||||
{{/* Long-form legal text (Privacy Policy, Terms): a plain heading, then the Markdown body. */}}
|
||||
{{ define "main" }}
|
||||
<header class="hero hero-compact">
|
||||
<h1 class="statement">{{ .Title }}</h1>
|
||||
{{ with .Params.effective }}<p class="dek">Effective date: {{ . }}</p>{{ end }}
|
||||
<div class="wrap">
|
||||
<div class="hero-copy">
|
||||
<h1 class="statement">{{ .Title }}</h1>
|
||||
{{ with .Params.effective }}<p class="dek">Effective date: {{ . }}</p>{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<section class="section">
|
||||
<div class="prose doc">{{ .Content }}</div>
|
||||
<section class="section section-doc">
|
||||
<div class="wrap"><div class="prose doc">{{ .Content }}</div></div>
|
||||
</section>
|
||||
{{ end }}
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
{{ define "main" }}
|
||||
<section class="form-band">
|
||||
<div class="wrap">
|
||||
<div class="form-page" data-reveal>
|
||||
<p class="eyebrow">Sign In</p>
|
||||
<h1 class="statement">{{ .Params.heading | default "Welcome back" }}</h1>
|
||||
@@ -16,7 +18,7 @@
|
||||
<label><input type="checkbox" name="remember"> Remember me</label>
|
||||
<a href="#">Forgot password?</a>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary"><span class="btn-label">Sign In</span></button>
|
||||
<button type="submit" class="btn btn-primary">Sign In</button>
|
||||
</form>
|
||||
|
||||
<p class="form-foot">
|
||||
@@ -28,4 +30,6 @@
|
||||
Having trouble signing in? <a href="mailto:{{ .Site.Params.supportEmail }}">Contact Support</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{{ end }}
|
||||
|
||||
@@ -5,15 +5,18 @@
|
||||
*/}}
|
||||
{{ define "main" }}
|
||||
<header class="hero hero-compact">
|
||||
<div class="wrap"><div class="hero-copy">
|
||||
<p class="note" data-reveal><span class="note-live" aria-hidden="true"></span><span class="note-text">{{ .Params.eyebrow | default "Software Library" }}</span></p>
|
||||
<h1 class="statement" data-reveal style="--d:80ms">{{ .Params.headline | default .Title | markdownify }}</h1>
|
||||
{{ with .Params.dek }}<p class="dek" data-reveal style="--d:140ms">{{ . | markdownify }}</p>{{ end }}
|
||||
<div class="actions" data-reveal style="--d:200ms">
|
||||
{{ partial "sections/ctas.html" (slice (dict "label" "Start 7-Day Free Trial" "url" "/start-now/" "style" "primary") (dict "label" "Book a Demo" "url" site.Params.demoUrl "style" "ghost")) }}
|
||||
</div>
|
||||
</div></div>
|
||||
</header>
|
||||
|
||||
<section class="section" data-reveal>
|
||||
<section class="section section-facts" data-reveal>
|
||||
<div class="wrap">
|
||||
<dl class="app-facts">
|
||||
{{ with .Params.replaces }}<div><dt>Replaces</dt><dd>{{ . }}</dd></div>{{ end }}
|
||||
<div><dt>Hosted plans</dt><dd>{{ with .Params.plans }}Included in {{ . }}{{ else }}Add to any plan{{ end }}{{ with $.Params.price }} · {{ . }} on its own{{ end }}</dd></div>
|
||||
@@ -21,10 +24,11 @@
|
||||
{{ with .Params.projectUrl }}<div><dt>Project</dt><dd><a href="{{ . }}" target="_blank" rel="noopener">{{ replaceRE `^https?://(www\.)?([^/]+).*$` "$2" . }}<span class="arrow" aria-hidden="true">↗</span></a></dd></div>{{ end }}
|
||||
</dl>
|
||||
<p class="app-facts-more"><a class="more" href="{{ "/pricing/" | relURL }}">See pricing<span class="arrow" aria-hidden="true">→</span></a> <a class="more" href="{{ "/product/software-library/" | relURL }}">Browse the Software Library<span class="arrow" aria-hidden="true">→</span></a></p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section" data-reveal>
|
||||
<div class="prose doc">{{ .Content }}</div>
|
||||
<section class="section section-doc" data-reveal>
|
||||
<div class="wrap"><div class="prose doc">{{ .Content }}</div></div>
|
||||
</section>
|
||||
|
||||
{{ partial "sections/final-cta.html" (dict
|
||||
|
||||
@@ -1,31 +1,35 @@
|
||||
<footer class="foot" data-reveal>
|
||||
<div class="foot-brand">
|
||||
<a href="{{ "/" | relURL }}" class="foot-mark" aria-label="Federated Computer, home">
|
||||
<img src="{{ "images/logo.png" | relURL }}" alt="Federated Computer" class="brand-logo" width="775" height="129">
|
||||
</a>
|
||||
<p class="foot-line">The open-source operating system for your business — and the private AI that runs on it.</p>
|
||||
<span class="foot-place">Colorado Springs, Colorado</span>
|
||||
<ul class="foot-social">
|
||||
{{ range site.Menus.footer_social }}<li><a href="{{ .URL }}" target="_blank" rel="noopener">{{ .Name }}<span class="arrow" aria-hidden="true">↗</span></a></li>{{ end }}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="foot-grid">
|
||||
{{ range (slice (dict "title" "Solutions" "menu" "footer_solutions") (dict "title" "Product" "menu" "footer_product") (dict "title" "Company" "menu" "footer_company") (dict "title" "Get Started" "menu" "footer_start")) }}
|
||||
<nav class="foot-group" aria-label="{{ .title }}">
|
||||
<span class="foot-head">{{ .title }}</span>
|
||||
<ul class="foot-links">
|
||||
{{ range index site.Menus .menu }}
|
||||
<li><a href="{{ if or (hasPrefix .URL "mailto:") (hasPrefix .URL "http") }}{{ .URL }}{{ else }}{{ .URL | relURL }}{{ end }}">{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
<footer class="foot">
|
||||
<div class="wrap">
|
||||
<div class="foot-top-row">
|
||||
<div class="foot-brand">
|
||||
<a href="{{ "/" | relURL }}" class="foot-mark" aria-label="Federated Computer, home">
|
||||
<img src="{{ "images/logo.png" | relURL }}" alt="Federated Computer" class="brand-logo" width="775" height="129">
|
||||
</a>
|
||||
<p class="foot-line">The open-source operating system for your business — and the private AI that runs on it.</p>
|
||||
<span class="foot-place">Colorado Springs, Colorado</span>
|
||||
<ul class="foot-social">
|
||||
{{ range site.Menus.footer_social }}<li><a href="{{ .URL }}" target="_blank" rel="noopener">{{ .Name }}<span class="arrow" aria-hidden="true">↗</span></a></li>{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="foot-legal">
|
||||
<span class="foot-copy">© {{ now.Format "2006" }} Federated Computer, Inc. FedQ'd in Colorado Springs — built on Federated Computer by a team around the world.</span>
|
||||
{{ range site.Menus.footer_legal }}<a class="foot-policy" href="{{ .URL | relURL }}">{{ .Name }}</a>{{ end }}
|
||||
<a class="foot-top" href="#top">Back to top<span class="foot-up" aria-hidden="true">↑</span></a>
|
||||
<div class="foot-grid">
|
||||
{{ range (slice (dict "title" "Solutions" "menu" "footer_solutions") (dict "title" "Product" "menu" "footer_product") (dict "title" "Company" "menu" "footer_company") (dict "title" "Get Started" "menu" "footer_start")) }}
|
||||
<nav class="foot-group" aria-label="{{ .title }}">
|
||||
<span class="foot-head">{{ .title }}</span>
|
||||
<ul class="foot-links">
|
||||
{{ range index site.Menus .menu }}
|
||||
<li><a href="{{ if or (hasPrefix .URL "mailto:") (hasPrefix .URL "http") }}{{ .URL }}{{ else }}{{ .URL | relURL }}{{ end }}">{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="foot-legal">
|
||||
<span class="foot-copy">© {{ now.Format "2006" }} Federated Computer, Inc. FedQ'd in Colorado Springs — built on Federated Computer by a team around the world.</span>
|
||||
{{ range site.Menus.footer_legal }}<a class="foot-policy" href="{{ .URL | relURL }}">{{ .Name }}</a>{{ end }}
|
||||
<a class="foot-top" href="#top">Back to top<span class="foot-up" aria-hidden="true">↑</span></a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
@@ -2,8 +2,8 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{{ if .IsHome }}{{ .Site.Title }} — {{ .Site.Params.tagline }}{{ else }}{{ .Title }} · {{ .Site.Title }}{{ end }}</title>
|
||||
<meta name="description" content="{{ if .Description }}{{ .Description }}{{ else }}{{ .Site.Params.tagline }}{{ end }}">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<meta name="theme-color" content="#001a2b">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600&family=Geist+Mono:wght@400;500&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="{{ "css/style.css" | relURL }}">
|
||||
|
||||
@@ -1,15 +1,47 @@
|
||||
{{/*
|
||||
The rail: logo, the site's pages ("doors"), the two account actions, and
|
||||
an index of the sections on this page. Sticky beside the column on wide
|
||||
screens; a one-line bar with a Menu toggle below 1000px.
|
||||
The top bar: logo, the site's pages (with dropdown panels for menus that
|
||||
set `dropdown`), and the two account actions. Sticky on every screen;
|
||||
below 1000px the pages fold into a Menu toggle (a <details>, so it works
|
||||
without JS).
|
||||
*/}}
|
||||
{{ $page := . }}
|
||||
<aside class="rail">
|
||||
<div class="rail-bar">
|
||||
<header class="site-head">
|
||||
<div class="wrap head-bar">
|
||||
<a href="{{ "/" | relURL }}" class="brand" aria-label="Federated Computer, home">
|
||||
<img src="{{ "images/logo.png" | relURL }}" alt="Federated Computer" class="brand-logo" width="775" height="129">
|
||||
</a>
|
||||
|
||||
<nav class="head-nav" aria-label="Site">
|
||||
{{ range .Site.Menus.main }}
|
||||
{{ if ne .URL "/" }}
|
||||
{{ $m := . }}
|
||||
{{ $active := hasPrefix $page.RelPermalink .URL }}
|
||||
{{ with .Params.dropdown }}
|
||||
<div class="nav-item has-drop">
|
||||
<a href="{{ $m.URL | relURL }}" class="nav-link"{{ if $active }} aria-current="page"{{ end }}>{{ $m.Name }}<svg class="nav-caret" viewBox="0 0 10 6" width="10" height="6" aria-hidden="true"><path d="M1 1l4 4 4-4" fill="none" stroke="currentColor" stroke-width="1.5"/></svg></a>
|
||||
<div class="drop">
|
||||
<div class="drop-panel">
|
||||
{{ range index $page.Site.Menus . }}
|
||||
<a href="{{ .URL | relURL }}" class="drop-link"{{ if eq $page.RelPermalink .URL }} aria-current="page"{{ end }}>
|
||||
<span class="drop-name">{{ .Name }}</span>
|
||||
{{ with .Params.desc }}<span class="drop-desc">{{ . }}</span>{{ end }}
|
||||
</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{ else }}
|
||||
<a href="{{ $m.URL | relURL }}" class="nav-link"{{ if $active }} aria-current="page"{{ end }}>{{ $m.Name }}</a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</nav>
|
||||
|
||||
<div class="head-actions">
|
||||
<a href="{{ "/sign-in/" | relURL }}" class="head-signin"{{ if eq $page.RelPermalink "/sign-in/" }} aria-current="page"{{ end }}>Sign in</a>
|
||||
<a href="{{ "/start-now/" | relURL }}" class="btn btn-primary btn-sm">Start now</a>
|
||||
</div>
|
||||
|
||||
<details class="menu">
|
||||
<summary><span class="menu-word">Menu</span><span class="menu-glyph" aria-hidden="true"><i></i><i></i></span></summary>
|
||||
<nav class="menu-panel" aria-label="Site">
|
||||
@@ -27,72 +59,4 @@
|
||||
</nav>
|
||||
</details>
|
||||
</div>
|
||||
|
||||
<nav class="nav nav-doors" aria-label="Site">
|
||||
{{ range .Site.Menus.main }}
|
||||
{{ $active := or (eq $page.RelPermalink .URL) (and (ne .URL "/") (hasPrefix $page.RelPermalink .URL)) }}
|
||||
<a href="{{ .URL | relURL }}"{{ if $active }} aria-current="page"{{ end }}>{{ .Name }}</a>
|
||||
{{ if $active }}
|
||||
{{ with .Params.dropdown }}
|
||||
<div class="nav-sub">
|
||||
{{ range index $page.Site.Menus . }}
|
||||
<a href="{{ .URL | relURL }}"{{ if eq $page.RelPermalink .URL }} aria-current="page"{{ end }}>{{ .Name }}</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</nav>
|
||||
|
||||
<div class="rail-actions">
|
||||
<a href="{{ "/start-now/" | relURL }}" class="btn btn-primary btn-sm"><span class="btn-label">Start Now</span></a>
|
||||
<a href="{{ "/sign-in/" | relURL }}" class="rail-signin"{{ if eq $page.RelPermalink "/sign-in/" }} aria-current="page"{{ end }}>Sign In</a>
|
||||
</div>
|
||||
|
||||
{{ $toc := slice }}
|
||||
{{ range .Params.sections }}
|
||||
{{ $label := or .toc .kicker .headline }}
|
||||
{{ if and $label (not (in (slice "hero" "divider" "final-cta") .type)) }}
|
||||
{{ $toc = $toc | append (dict "label" ($label | plainify) "id" (partial "section-id.html" .)) }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if $toc }}
|
||||
<hr class="rail-rule">
|
||||
<nav class="nav nav-here" aria-label="On this page">
|
||||
{{ range $toc }}<a href="#{{ .id }}">{{ .label }}</a>{{ end }}
|
||||
</nav>
|
||||
{{ end }}
|
||||
|
||||
{{/*
|
||||
"Apps + AI": a slowly scrolling wall of app tiles pinned to the bottom of
|
||||
the rail (wide screens only). The list is repeated once, hidden from
|
||||
assistive tech and focus, so the scroll can loop seamlessly. Tiles come
|
||||
from data/app_wall.yaml; icons from the sprite at images/app-icons.svg.
|
||||
*/}}
|
||||
{{ with hugo.Data.app_wall }}
|
||||
{{ $sprite := "images/app-icons.svg" | relURL }}
|
||||
<nav class="app-wall" aria-label="Apps + AI">
|
||||
<a class="app-wall-head" href="{{ "/product/software-library/" | relURL }}">
|
||||
<span class="app-wall-title">Apps + AI</span>
|
||||
<span class="app-wall-count">Catalog<span class="arrow" aria-hidden="true">→</span></span>
|
||||
</a>
|
||||
<div class="app-wall-view">
|
||||
<div class="app-wall-scroll">
|
||||
{{ range $copy := slice 0 1 }}
|
||||
<ul class="app-wall-grid"{{ if $copy }} aria-hidden="true"{{ end }}>
|
||||
{{ range hugo.Data.app_wall }}
|
||||
<li>
|
||||
<a class="app-tile" href="{{ .url | relURL }}"{{ if $copy }} tabindex="-1"{{ end }}>
|
||||
{{ with .icon }}<svg class="app-tile-icon" aria-hidden="true"><use href="{{ $sprite }}#{{ . }}"></use></svg>
|
||||
{{ else }}<span class="app-tile-icon app-tile-letter" aria-hidden="true">{{ substr .name 0 1 }}</span>{{ end }}
|
||||
<span class="app-tile-name">{{ .name }}</span>
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
{{ end }}
|
||||
</aside>
|
||||
</header>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{{/*
|
||||
Anchor id for a section: its own `id`, else one made from its `toc`,
|
||||
`kicker`, or `headline`. Shared by the section wrapper and the rail's
|
||||
"On this page" index so the two always agree.
|
||||
`kicker`, or `headline`. Used by the section wrapper and by the pricing
|
||||
switch.
|
||||
*/}}
|
||||
{{ $id := "" }}
|
||||
{{ with .id }}
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
{{/*
|
||||
An announcement banner: a dark rounded plate with an optional `badge`
|
||||
(short label on the left), `kicker`, `headline`, `body`, and `ctas`.
|
||||
*/}}
|
||||
{{ $s := . }}
|
||||
<div class="banner">
|
||||
{{ with $s.badge }}<div class="banner-badge"><span>{{ . }}</span></div>{{ end }}
|
||||
<div class="banner-copy">
|
||||
{{ with $s.kicker }}<p class="eyebrow">{{ . }}</p>{{ end }}
|
||||
{{ with $s.headline }}<h2 class="banner-title">{{ . | markdownify }}</h2>{{ end }}
|
||||
{{ with $s.body }}<p class="banner-text">{{ . | markdownify }}</p>{{ end }}
|
||||
</div>
|
||||
{{ if $s.ctas }}<div class="actions">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
</div>
|
||||
@@ -0,0 +1,22 @@
|
||||
{{/*
|
||||
A grid of cards: `items`, each with `title`, `body`, optional `label`
|
||||
(a small tag above the title), `image`, and `link` (+ `linktext`).
|
||||
Without an image, `visual: true` draws a gradient panel in its place.
|
||||
*/}}
|
||||
{{ $s := . }}
|
||||
{{ partial "sections/head.html" $s }}
|
||||
<ul class="card-grid{{ with $s.columns }} cols-{{ . }}{{ end }}">
|
||||
{{ range $i, $c := $s.items }}
|
||||
<li class="card{{ if or $c.image $s.visual }} has-visual{{ end }}">
|
||||
{{ with $c.image }}<img class="card-visual" src="{{ . | relURL }}" alt="" loading="lazy">
|
||||
{{ else }}{{ if $s.visual }}<span class="card-visual card-art" style="--i:{{ $i }}" aria-hidden="true"></span>{{ end }}{{ end }}
|
||||
<div class="card-body">
|
||||
{{ with $c.label }}<span class="card-label">{{ . }}</span>{{ end }}
|
||||
<h3 class="card-title">{{ $c.title | markdownify }}</h3>
|
||||
{{ with $c.body }}<p class="card-text">{{ . | markdownify }}</p>{{ end }}
|
||||
{{ with $c.link }}<a class="more card-link" href="{{ . | relURL }}">{{ replaceRE `\s*[→↗]\s*$` "" ($c.linktext | default "Learn more") }}<span class="arrow" aria-hidden="true">→</span></a>{{ end }}
|
||||
</div>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ if $s.ctas }}<div class="cta-row">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
@@ -1,7 +1,7 @@
|
||||
{{/*
|
||||
Buttons. `primary` is the solid blue button with a leading arrow tile,
|
||||
`ghost` the pale blue secondary with corner ticks, `text` a quiet link
|
||||
with an arrow. Any trailing "→" in a label is dropped — the arrow is drawn.
|
||||
Buttons. `primary` is the solid lime button, `ghost` the outlined
|
||||
secondary, `text` a quiet link with an arrow. Any trailing "→" in a
|
||||
label is dropped — the arrow is drawn.
|
||||
*/}}
|
||||
{{ range . }}
|
||||
{{ $label := replaceRE `\s*[→↗]\s*$` "" .label }}
|
||||
@@ -12,9 +12,6 @@
|
||||
{{ else if eq .style "text" }}
|
||||
<a href="{{ $href }}" class="more">{{ $label }}<span class="arrow" aria-hidden="true">{{ if $external }}↗{{ else }}→{{ end }}</span></a>
|
||||
{{ else }}
|
||||
<a href="{{ $href }}" class="btn btn-primary">
|
||||
<span class="btn-tile" aria-hidden="true"><svg viewBox="0 0 16 16" width="14" height="14" fill="none"><path d="M3 8h9M8.5 4.5 12 8l-3.5 3.5" stroke="currentColor" stroke-width="1.5" stroke-linecap="square"/></svg></span>
|
||||
<span class="btn-label">{{ $label }}</span>
|
||||
</a>
|
||||
<a href="{{ $href }}" class="btn btn-primary">{{ $label }}<span class="arrow" aria-hidden="true">{{ if $external }}↗{{ else }}→{{ end }}</span></a>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
||||
@@ -1,6 +1,10 @@
|
||||
{{ $s := . }}
|
||||
<aside class="cta" data-reveal>
|
||||
<h2 class="cta-title">{{ $s.headline | markdownify }}</h2>
|
||||
{{ with $s.body }}<p class="cta-text">{{ . | markdownify }}</p>{{ end }}
|
||||
{{ if $s.ctas }}<div class="actions">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
<div class="wrap cta-inner">
|
||||
<div class="cta-copy">
|
||||
<h2 class="cta-title">{{ $s.headline | markdownify }}</h2>
|
||||
{{ with $s.body }}<p class="cta-text">{{ . | markdownify }}</p>{{ end }}
|
||||
</div>
|
||||
{{ if $s.ctas }}<div class="actions">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
@@ -1,26 +1,30 @@
|
||||
{{/*
|
||||
The opening of every page: an optional note (the eyebrow), the statement,
|
||||
the dek, the actions — then either the layer panel (when `fit:` is set)
|
||||
or the field, a blue plate with the platform's four layers drawn as bars.
|
||||
`bars: false` drops the field.
|
||||
The opening of every page: a full-bleed dark band. On the left, an
|
||||
optional note (the eyebrow), the statement, the dek, the actions; on the
|
||||
right, the agent log (when `log:` is set), the layer panel (when `fit:`
|
||||
is set), or the field — the platform's four layers drawn as bars.
|
||||
`bars: false` drops the field. `logImage` sets a photo behind the whole band.
|
||||
*/}}
|
||||
{{ $s := . }}
|
||||
<header class="hero{{ if $s.compact }} hero-compact{{ end }}">
|
||||
{{ $visual := or $s.log $s.fit (ne $s.bars false) }}
|
||||
<header class="hero{{ if $s.compact }} hero-compact{{ end }}{{ if $visual }} has-visual{{ end }}{{ if $s.logImage }} has-image{{ end }}">
|
||||
{{ with $s.logImage }}<img class="hero-bg" src="{{ . | relURL }}" alt="" fetchpriority="high">{{ end }}
|
||||
<div class="wrap hero-grid">
|
||||
<div class="hero-copy">
|
||||
{{ with $s.eyebrow }}<p class="note" data-reveal><span class="note-live" aria-hidden="true"></span><span class="note-text">{{ . }}</span></p>{{ end }}
|
||||
<h1 class="statement" data-reveal style="--d:80ms">{{ $s.title | markdownify }}</h1>
|
||||
{{ with $s.subhead }}<p class="dek" data-reveal style="--d:140ms">{{ . | markdownify }}</p>{{ end }}
|
||||
{{ if $s.ctas }}<div class="actions" data-reveal style="--d:200ms">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
</div>
|
||||
|
||||
{{ with $s.log }}
|
||||
{{/*
|
||||
An agent's activity log, typed out line by line (see the script below).
|
||||
Lines take `tag` + `text`; `think: true` marks a reasoning step (greyed,
|
||||
with a pause); `done: true` closes the run. The window keeps a fixed
|
||||
height and scrolls as lines arrive. `logImage` swaps the blue field for
|
||||
a photo; `logCaption` credits it.
|
||||
height and scrolls as lines arrive. `logCaption` credits the photo.
|
||||
*/}}
|
||||
<figure class="hero-field hero-log{{ if $s.logImage }} has-image{{ end }}" data-reveal style="--d:260ms">
|
||||
{{ with $s.logImage }}<img class="log-bg" src="{{ . | relURL }}" alt="" fetchpriority="high">{{ end }}
|
||||
<figure class="hero-log" data-reveal style="--d:260ms">
|
||||
<div class="log-window">
|
||||
<div class="log-bar">
|
||||
<span class="log-title">{{ $s.logTitle | default "agent · your-company.federated.computer" }}</span>
|
||||
@@ -37,7 +41,6 @@
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
{{ with $s.logCaption }}<figcaption class="log-caption">{{ . }}</figcaption>{{ end }}
|
||||
</figure>
|
||||
<script>
|
||||
(function () {
|
||||
@@ -106,4 +109,6 @@
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ with $s.logCaption }}<p class="hero-caption">{{ . }}</p>{{ end }}
|
||||
</header>
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
<span class="entry-title">{{ $item.title }}</span>
|
||||
<span class="entry-text">{{ $item.body | markdownify }}</span>
|
||||
</span>
|
||||
<span class="entry-go">{{ with $item.linktext }}{{ replaceRE `\s*[→↗]\s*$` "" . }}{{ end }}<span class="arrow" aria-hidden="true">→</span></span>
|
||||
<span class="entry-go">{{ replaceRE `\s*[→↗]\s*$` "" ($item.linktext | default "Learn more") }}<span class="arrow" aria-hidden="true">→</span></span>
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
{{/*
|
||||
A logo wall. `source: "apps"` fills it from data/app_wall.yaml (icons from
|
||||
the sprite at images/app-icons.svg; a tile without an icon shows its first
|
||||
letter). Otherwise `items`, each a `name` and optional `url`, render as
|
||||
wordmarks.
|
||||
*/}}
|
||||
{{ $s := . }}
|
||||
{{ partial "sections/head.html" $s }}
|
||||
{{ $sprite := "images/app-icons.svg" | relURL }}
|
||||
{{ $items := cond (eq $s.source "apps") hugo.Data.app_wall ($s.items | default slice) }}
|
||||
<ul class="logo-wall">
|
||||
{{ range $items }}
|
||||
<li>
|
||||
{{ if .url }}<a class="logo-tile" href="{{ .url | relURL }}">{{ else }}<span class="logo-tile">{{ end }}
|
||||
{{ if eq $s.source "apps" }}
|
||||
{{ with .icon }}<svg class="logo-icon" aria-hidden="true"><use href="{{ $sprite }}#{{ . }}"></use></svg>
|
||||
{{ else }}<span class="logo-icon logo-letter" aria-hidden="true">{{ substr .name 0 1 }}</span>{{ end }}
|
||||
{{ end }}
|
||||
<span class="logo-name">{{ .name }}</span>
|
||||
{{ if .url }}</a>{{ else }}</span>{{ end }}
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ if $s.ctas }}<div class="cta-row">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
@@ -0,0 +1,20 @@
|
||||
{{/*
|
||||
"What's new": a grid of linked cards. `items`, each with `tag` (e.g.
|
||||
Blog, Video, Event), `title`, optional `date`, `url`, and `image`
|
||||
(a gradient panel shows without one).
|
||||
*/}}
|
||||
{{ $s := . }}
|
||||
{{ partial "sections/head.html" $s }}
|
||||
<ul class="news-grid">
|
||||
{{ range $i, $n := $s.items }}
|
||||
<li>
|
||||
<a class="news-card" href="{{ $n.url | default "#" | relURL }}">
|
||||
{{ with $n.image }}<img class="news-visual" src="{{ . | relURL }}" alt="" loading="lazy">
|
||||
{{ else }}<span class="news-visual card-art" style="--i:{{ $i }}" aria-hidden="true">{{ if eq $n.tag "Video" }}<span class="news-play"></span>{{ end }}</span>{{ end }}
|
||||
<span class="news-meta">{{ with $n.tag }}<span class="news-tag">{{ . }}</span>{{ end }}{{ with $n.date }}<span class="news-date">{{ . }}</span>{{ end }}</span>
|
||||
<span class="news-title">{{ $n.title }}</span>
|
||||
</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
{{ if $s.ctas }}<div class="cta-row">{{ partial "sections/ctas.html" $s.ctas }}</div>{{ end }}
|
||||
@@ -1,5 +1,7 @@
|
||||
{{ $s := . }}
|
||||
{{ $id := partial "section-id.html" $s }}
|
||||
<section class="section section-{{ $s.type }}"{{ with $id }} id="{{ . }}"{{ end }} data-reveal>
|
||||
{{ partial (printf "sections/%s.html" $s.type) $s }}
|
||||
<div class="wrap">
|
||||
{{ partial (printf "sections/%s.html" $s.type) $s }}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user