Federated_Computer/hammerfest
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move to top banner

Browse Source
This commit is contained in:
david
2026-10-05 06:13:52 -06:00
parent e11be8261f
commit 34f0b499fa
70 changed files with 13429 additions and 36197 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+44 -37
View File
@@ -1,18 +1,17 @@
# Federated Computer — Hugo Site
A Hugo template for the Federated Computer site, laid out like
[supermemory.ai](https://supermemory.ai): a sticky left rail (logo, the
site's pages, Start Now / Sign In, and an "On this page" index of the
current page's sections) beside a single narrow reading column. White
page, near-black ink, one electric blue (`#0562ef`), hairline rules,
square corners, no shadows. The product's four layers
(Federated Core → Software Library → Agent Sandbox → Data & Controls)
recur as stacked bars — in the blue hero "field", the layer-fit panels,
and the closing call to action.
[nebius.com](https://nebius.com): a sticky dark navy top bar with dropdown
menus, a full-bleed navy hero (copy left, a visual right), then full-width
bands that alternate white and light grey inside a centered 1280px
container. Big, tight Inter headlines, rounded filled cards, a lime primary
button (`#e0ff4f`) and a violet accent (`#614efa`). Stats, the closing call
to action, and the footer return to navy. Copy still to be written is
filled with "lorem ipsum".
## Requirements
- [Hugo](https://gohugo.io/) (extended version). Tested on v0.123.7.
- [Hugo](https://gohugo.io/) (extended version), recent enough to have `hugo.Data`. Tested on v0.167.0.
## Running it locally
@@ -48,13 +47,13 @@ partial in `layouts/partials/sections/`.
Any section can take:
- `id: "some-id"` — anchor for links (e.g. `/start-now/#pricing`). Without
one, the id is made from `toc`, `kicker`, or `headline`.
- `toc: "Short label"` — the label for the rail's "On this page" index
(defaults to the kicker, then the headline). Sections without any of
these, plus `hero`, `divider`, and `final-cta`, are left out of the index.
Every section opens on a hairline rule, so the older `bordered`, `tinted`,
and `dark` options are accepted but no longer change the look. `final-cta`
always renders as the dark closing plate.
Sections alternate white and grey bands automatically (cards inside take
the opposite tone), so the older `bordered`, `tinted`, and `dark` options
are accepted but no longer change the look. `stats` always renders as a
navy band; `final-cta` always renders as the navy closing band. A `text`
section with a heading puts it on the left and the copy on the right; one
without a heading renders as a large statement.
### Customer paths (Solutions)
@@ -82,11 +81,15 @@ New section types:
- `savings` — a bar comparison (`bars`: `name`, `amount`, `highlight`) and a savings calculator (`apps`: `name`, `cost`, `perSeat`, `selected`; compared with `federatedAnnual`) (Pricing)
- `stats` values that start with a number ("80%+", "100+") count up when scrolled into view
- `quote` takes one `text`/`cite`, or several as `items`. With `cards: true`, items render as a two-column testimonial grid: `text`, `name`, optional `role` and `photo` (initials show when there's no photo). Customer headshots live in `static/images/customers/` (home page). `savings:` adds a compact savings calculator below the quotes: it picks the named `apps` (and ticks `selected`) out of the `savings` section on the page at `from` (e.g. `/pricing`), so app prices live in one place; `more` links to the full calculator
- `logos` — a logo wall. `source: "apps"` fills it from `data/app_wall.yaml` (home); otherwise `items` of `name` + optional `url`
- `cards` — a grid of rounded cards: `items` with `title`, `body`, optional `label`, `image`, `link`/`linktext`; `visual: true` draws a gradient panel where there's no image; `columns: 2` or `3` fixes the grid
- `news` — "What's new" cards: `items` with `tag` (Blog, Video, Event…), `title`, `date`, `url`, optional `image` (home; lorem ipsum for now)
- `banner` — an announcement plate: `badge`, `kicker`, `headline`, `body`, `ctas` (home; lorem ipsum for now)
- `app-directory` items can also take `page:` — the app's own page on this site
- `hero` accepts `log:` — a list of lines (`tag` + `text`; `think: true` for a greyed reasoning step with a spinner and a pause; `done: true` to close the run) typed out in a fixed-height console window that scrolls like a terminal, as an agent's activity log (home page). Without JS or with reduced motion, all lines show at once. `logTitle` sets the window's title; `logImage` puts a photo behind the console in place of the blue field (home: Pikes Peak, `static/images/hero-pikes-peak.jpg`), and `logCaption` adds a small credit in its corner
- `hero` accepts `fit:` to show the layer panel under the actions (in place
of the blue field); `bars: false` drops the field; `compact: true` makes
the field shorter
the field shorter. A photo set with `logImage` sits behind the whole hero band
Every section type now renders `kicker`, `headline`, and an optional `lede`
through `partials/sections/head.html`.
@@ -104,14 +107,15 @@ Some pages are long-form Markdown rather than a `sections:` list:
Site-wide links live in `hugo.toml`: `params.demoUrl` (the booking page),
`params.supportUrl` (the help portal), and the `footer_social` / `footer_legal` menus.
### The "Apps + AI" wall
### The app logo wall
The rail ends with a slowly scrolling grid of app tiles, pinned to the bottom
of the column on screens wider than 1000px and taller than 720px. Tiles come
from `data/app_wall.yaml` (`name`, `url`, optional `icon`). Icons are symbols
in the sprite `static/images/app-icons.svg` (from Simple Icons, CC0; DocuSeal
from its own repo). A tile without an `icon` shows its first letter. The
scroll pauses on hover and focus, and stops for reduced motion.
The home page's `logos` section draws its tiles from `data/app_wall.yaml`
(`name`, `url`, optional `icon`). Icons are symbols in the sprite
`static/images/app-icons.svg` (from Simple Icons, CC0; DocuSeal from its own
repo). A tile without an `icon` shows its first letter.
Dropdown entries in the top bar can carry a one-line description:
`[menu.product.params] desc = "..."` in `hugo.toml`.
### Adding a new page
@@ -156,9 +160,9 @@ layouts/
product/list.html Product overview (renders sections)
partials/
head.html, footer.html
header.html The rail (nav, actions, "On this page")
header.html The top bar (nav with dropdowns, actions, mobile menu)
render-sections.html Dispatches each section to its partial
section-id.html Anchor id shared by sections and the rail index
section-id.html Anchor id for each section
sections/*.html One partial per section type
static/
css/style.css The whole design system
@@ -167,17 +171,20 @@ hugo.toml Site config + nav/footer menus
## Design notes
- **Layout:** `.page` is a two-column grid — the rail (`layouts/partials/header.html`)
and the column (`main.col`, which also holds the footer). Below 1000px the
rail becomes a one-line top bar with a Menu toggle.
- **Type:** Geist (reading) and Geist Mono (caps labels, numbers, buttons),
loaded from Google Fonts in `layouts/partials/head.html`.
- **Layout:** a sticky top bar (`layouts/partials/header.html`), then
`main`, then the footer — all full width. Content sits in `.wrap`
(max 1280px, centered). Below 1080px the nav folds into a Menu toggle.
- **Type:** Inter (headlines and reading) and JetBrains Mono (small caps
labels and numbers), loaded from Google Fonts in `layouts/partials/head.html`.
- **Color tokens** are CSS custom properties at the top of
`static/css/style.css` (`--ink`, `--ink-68`, `--rule`, `--paper`,
`--blue`, etc.) — change the palette there and it cascades everywhere.
- **Buttons:** CTA `style: primary` is the solid blue button with an arrow
tile, `ghost` the pale blue one with corner ticks, `text` a quiet link.
A trailing `→` in a label is dropped; the arrow is drawn for you.
`static/css/style.css` (`--navy-deep`, `--lime`, `--violet`, `--paper`,
`--ink`, `--rule`, etc.) — change the palette there and it cascades
everywhere. Each section sets `--section-bg` and `--surface` (the card
tone), which flip on alternating bands.
- **Buttons:** CTA `style: primary` is the solid lime button (navy on white
bands), `ghost` the outlined one, `text` a violet link. A trailing `→` in
a label is dropped; the arrow is drawn for you.
- **JS is optional.** A small inline script in `baseof.html` fades sections
in and highlights the current "On this page" entry. Without it everything
still shows; the mobile menu, FAQ, and app directory use native `<details>`.
in and darkens the top bar on scroll. Without it everything still shows;
the dropdowns are CSS (hover and focus), and the mobile menu, FAQ, and
app directory use native `<details>`.