One geometry in src/iso/mark.ts, drawn by the engine the miniatures use. The favicon follows the system's mode; scripts/favicon.mjs takes its colors from styles.css. Below 768px the header shows the mark alone, its word kept as the link's name.
15 lines
425 B
TypeScript
15 lines
425 B
TypeScript
import { mark, points } from "./iso/mark";
|
|
|
|
const { width, height, polygons } = mark(0.12);
|
|
|
|
/** The E in blocks, in the page's iso colors. */
|
|
export function Mark() {
|
|
return (
|
|
<svg className="mark" viewBox={`0 0 ${width} ${height}`} aria-hidden="true">
|
|
{polygons.map((p, i) => (
|
|
<polygon key={i} className={p.accent ? `${p.face} accent` : p.face} points={points(p.points)} />
|
|
))}
|
|
</svg>
|
|
);
|
|
}
|