{# @description Streaks of light flying out from the centre, as if the page were travelling. Best on a dark surface, with invert. #}
{# @prop color:select['primary', 'secondary', 'accent', 'neutral', 'base-100', 'base-200', 'base-300'] | default:"base-100" | description:"The colour of the streaks" #}
{# @prop density:number | default:"1" | description:"How many streaks, as a multiple of the usual forty: 2 is eighty, 0.5 twenty. Stops at three hundred." #}
{# @prop intensity:number | default:"0.6" | description:"How far the streaks come through, from 0 to 1" #}
{# @prop speed:number | default:"1" | description:"How quickly the streaks fly, as a multiple: 2 is twice as fast, 0.5 half" #}
{# @prop class:text | description:"Extra classes on the layer" #}
{% comment %}
The outer element sets a streak's bearing and the inner one flies along it.
Everything about a streak is worked out from its number, `--i` (docs/adr/0004-moving-backgrounds-are-css-only.md).
{% endcomment %}
{% widthratio density|floatformat:'-3u'|default:'1' 1 40 as count %}
{% if count|add:0 > 0 %}
{% with limit=":"|add:count %}
{% for streak in ""|center:300|slice:limit %}
{% endfor %}
{% endwith %}
{% endif %}