States the width each of the site's images is laid out at, which App.css
sets, so that imageProps asks the server for a copy no larger. A number
is a fixed width in CSS pixels, a string a sizes attribute for a width
that follows the viewport's. The components that show a thumbnail, a cover
or a player's artwork take theirs from here; an avatar's is its size.
The width of each image, by the place it is shown.
-
compactThumbnail: number
A compact thumbnail at its widest, in a dump card's preview; the rows that show it smaller take the same copy.
-
journal: { feature; wide; tall; square; }
A journal tile's image, by the tile's shape.
-
playerArtwork: number
The artwork in the global player's header.
-
playlistBanner: string
A playlist's cover as the banner of its page.
-
playlistThumb: number
A playlist's cover in a row of a list.
-
playlistTile: string
A playlist's cover as a tile of the grid, two to a row when narrow.
-
richThumbnail: string
A link's thumbnail beside its text, above it on a narrow screen.
Usage
import * as mod from "src/config/imageSizes.ts";