Skip to content

Assets: previews, uploading and regenerating

Previews
D-Modem hardware
app menu
bbs go3270
gui brand
suite

README banners

banner/<repo>.svg is the 1280×320 header at the top of each repository's README, rendered to banner/<repo>.png and banner/<repo>@2x.png. banner/suite.png is the organization's own, for the profile and website.

Each repository keeps a copy of its @2x PNG at .github/banner.png and shows it above its title (tools/art.py <repo> --install <checkout> does both):

<img src=".github/banner.png" alt="D-Modem/<repo>: <tagline>" width="100%">

bbs banner

Uploading to GitHub

GitHub has no API for these, so they are uploaded by hand:

  • Org avatar: the organization's Settings → Profile → Profile picture → upload avatar/org-avatar@2x.png.
  • Social previews: each repository's Settings → General → Social preview → Edit → Upload an image → social/<repo>.png.

Making one repository's art

tools/art.py makes a repository's banner and social preview, and can put the banner in its checkout:

python3 tools/art.py menu                       # banner/menu.* and social/menu.*
python3 tools/art.py menu --install ../menu     # also ../menu/.github/banner.png and README.md
python3 tools/art.py menu --only social         # just the social preview

A new repository: add it to REPOS at the top of tools/gen.py (Book, colour, icon, tagline, line below, tags), or try it out first with flags:

python3 tools/art.py foo --book Beige --tag "What foo is" --sub "One more line." --icon wave --chips Go,SIP

python3 tools/art.py -h lists the Books and icons.

Regenerating

The SVGs are generated by tools/gen.py (colors, taglines and tags are at the top of it) and rendered to PNG by tools/render.js with Playwright's Chromium. Sauce Code Pro (SauceCodePro Nerd Font Mono) must be installed for the text to render as intended; the SVGs name it as their font, so viewers without it fall back to another monospace font.

python3 tools/gen.py
python3 tools/app_icon.py
node tools/render.js