vojo/src/app/styles/horseshoe.ts

24 lines
1.3 KiB
TypeScript

// Shared constants for the Vojo "horseshoe" design language.
//
// The void colour is fixed in design and not theme-driven — the same
// #090909 is painted between every pair of horseshoe surfaces (top
// user-card silhouette, bottom call rail, settings/profile rail, etc.)
// so the seam reads as the same "near-black" no matter where it shows
// up. Originally introduced with the bottom call rail (commit 7054ca2 /
// `HorseshoeContainer.css.ts`); centralised here so consumers don't
// duplicate the literal and the value can be tuned in one place.
export const VOJO_HORSESHOE_VOID_COLOR = '#090909';
// Width (and height where vertical) of the void gap separating two
// horseshoe surfaces — kept identical between the bottom call rail
// and the page-nav <-> chat split so all seams in the app read with
// the same thickness. Pixels, intended for `toRem(...)` at the use
// site.
export const VOJO_HORSESHOE_GAP_PX = 12;
// Corner radius of every horseshoe surface — also pixels, applied via
// `toRem(...)` at the use site. Centralised so the page-nav corners,
// the chat-panel corners, and the bottom call-rail corners stay in
// lockstep, including the bg-image squares painted into those corners
// (which must match the radius exactly to avoid bleed-out).
export const VOJO_HORSESHOE_RADIUS_PX = 32;