diff --git a/apps/web/src/components/bits/BitAura.tsx b/apps/web/src/components/bits/BitAura.tsx index a7427c2..5ca4e9f 100644 --- a/apps/web/src/components/bits/BitAura.tsx +++ b/apps/web/src/components/bits/BitAura.tsx @@ -4,8 +4,8 @@ import * as React from "react"; type AuraSource = "top" | "right" | "bottom" | "left" | "around"; type AuraTone = "dark" | "light"; -/** How the energy behaves: `sparks` drift off the edge, `rain` falls onto it, `pulse` sends rings outward. */ -type AuraMotion = "sparks" | "rain" | "pulse"; +/** How the energy behaves: `sparks` drift off the edge, `rain` falls onto it. */ +type AuraMotion = "sparks" | "rain"; interface BitAuraProps { /** The edge the energy sits on, or `around` to let it travel round the element. */ @@ -53,8 +53,6 @@ interface Palette { core: string; digit: string; gain: number; - /** Opacity of the pulse rings at the edge. */ - ring: number; /** Share of the digit sparks that are kept (1 = all). */ density: number; } @@ -86,7 +84,6 @@ const LIGHT_PALETTE: Palette = { digit: "15, 23, 42", // No haze on light backgrounds: coloured light only reads on dark. Ink digits only. gain: 0, - ring: 0.45, density: 0.6, }; @@ -96,21 +93,16 @@ const DARK_PALETTE: Palette = { core: "224, 231, 255", digit: "199, 210, 254", gain: 1, - ring: 0.8, density: 1, }; const MOTION_DENSITY: Record = { sparks: 0.45, rain: 0.3, - pulse: 0.2, }; -const PULSE_RINGS = 3; -const PULSE_PERIOD_S = 4.2; /** How often a drifting digit switches between 0 and 1. */ const FLIPS_PER_S = 0.9; -const PULSE_REACH = 56; const fraction = (value: number) => value - Math.floor(value); @@ -150,12 +142,6 @@ const spotsAt = ( t: number, box: Box, ): readonly Spot[] => { - if (motion === "pulse") { - return [0, 1, 2, 3].map((corner) => ({ - at: (corner + 0.5) / 4, - power: 0.45 + 0.25 * Math.sin(t * 0.8 - corner * 1.57), - })); - } if (source === "around") { return [ { at: fraction(t * 0.03), power: 1 }, @@ -327,26 +313,6 @@ export const BitAura: React.FC = ({ } } - if (motion === "pulse") { - context.setLineDash([3, 7]); - context.lineWidth = 1.5; - for (let ring = 0; ring < PULSE_RINGS; ring++) { - const phase = fraction(clock / PULSE_PERIOD_S + ring / PULSE_RINGS); - const grow = phase * PULSE_REACH; - context.strokeStyle = `rgba(${palette.core}, ${(1 - phase) ** 2 * palette.ring})`; - context.beginPath(); - context.roundRect( - -grow, - -grow, - box.width + 2 * grow, - box.height + 2 * grow, - radius + grow, - ); - context.stroke(); - } - context.setLineDash([]); - } - context.fillStyle = `rgb(${palette.digit})`; context.textAlign = "center"; context.textBaseline = "middle"; diff --git a/apps/web/src/components/illustrations/AutomationFlow.tsx b/apps/web/src/components/illustrations/AutomationFlow.tsx index f98eec8..b834f14 100644 --- a/apps/web/src/components/illustrations/AutomationFlow.tsx +++ b/apps/web/src/components/illustrations/AutomationFlow.tsx @@ -252,7 +252,7 @@ export const AutomationFlow: React.FC = () => { {flow.summary}

- +
{flow.name}