timescale.info
Sign inSign up

How OpenChronology was built

Every merged pull request of openchronology/timeline-app, its first week of commits and its releases; and before them the 2020 PureScript editor, from snapshots of its deleted repositories in the Wayback Machine. Written to this server through the HTTP API.

327 moments · 2020-03-09T00:15:08Z CE – 2026-11-02T20:11:21Z CE · by @athan · @athan

#252 · A new logo, with favicons and app icons from it (#251)

  • timeline-app
  • pull request

Closes #251. A new logo, halfway between the original OpenChronology logo and the placeholder clock icon. It keeps the original's design: a C-shaped clock face with its last hours cut off as a separate arc, and L-shaped hands. It's drawn flat in the site's colors: a light green C, with the arc and hands in gold, on the header's dark green. ## What it adds - **`logo/`**: the sources. `mark.svg` is the full drawing. `small.svg` is a bolder, flat version for 16–32 px, where the gaps and shading would blur. `logo.svg` is the logo on its tile. - **`scripts/icons.mjs`**: draws every icon from those sources with sharp, which comes with Next.js. Its output is committed. - **Site favicons**, through Next.js's file conventions: - `icon.svg` and `favicon.ico` (16, 32 and 48 px) for browser tabs. - `apple-icon.png` (180 px, full bleed) for iPhone and iPad home screens. - `manifest.js`, which serves `/manifest.webmanifest` with 192 and 512 px icons, a maskable 512 px icon that keeps the mark inside Android's crop circle, and the theme and background colors. - `themeColor` and `appleWebApp` metadata. - **The headers**: the mark replaces the ◷ glyph in the site's header (`/logo-mark.svg`) and the editor's header (inline SVG, so it works in the offline file). - **The editor's tab icon**: an inline data-URI icon in `src/index.html`. The offline build used to add its own copy of the old icon and now uses this one. - **Desktop app**: new `icon.png`, `icon.ico` (16–256 px) and `icon.icns` (16–1024 px, with macOS's margin around the tile). ## Tests - `test/next-platform.mjs` checks the icon, Apple touch icon, manifest and theme-color tags, and that every icon in the manifest is served with its type. - The header checks in `next-platform` and `next-postgres` look for the logo instead of ◷. - `npm test` (303), `npm run test:platform` and `npm run test:platform:postgres` pass.

Sources

Open #252 · A new logo, with favicons and app icons from it (#251) in the timeline