feat: emphasize growth analyst promotion

This commit is contained in:
2026-08-21 16:50:21 +08:00
parent e3ead133f4
commit d914e8735d
3 changed files with 32 additions and 7 deletions

View File

@@ -132,6 +132,7 @@ The approved Persian-first baseline remains authoritative where the shipped arti
| Version | Date | Decision |
| ------- | ---------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 0.11.1 | 2026-08-21 | Hardened narrow-screen shell, calendar, and chart behavior: the navbar wordmark and duplicate drawer terminal selector are hidden on mobile, exact-period fields cannot overlap, payment charts keep their readable width with horizontal scrolling, and the growth teaser gains an action-blue emphasis with a restrained reduced-motion-safe pulse. |
| 0.11.0 | 2026-08-21 | Added the feature-gated AI growth analyst: a cache-first 90-day forecast view with count/amount modes, P10–P90 uncertainty band, keyboard and tabular alternatives, evidence-linked Persian campaign guidance, preserved-content refresh states, and restrained semantic opportunity/risk styling. |
| 0.10.0 | 2026-08-20 | Reframed retry guidance around the share of failed payment paths retried, including an explicit zero state; made payment-flow bars proportional to counts; and removed single-day hover styling from whole-week selection. |
| 0.9.3 | 2026-08-20 | Replaced stacked field focus outlines with one narrow semantic-blue border across text fields, textareas, native selects, and custom select triggers; other keyboard targets retain a subtle 1px outline. |

View File

@@ -7,12 +7,17 @@
let { href = '/growth' }: { href?: string } = $props();
</script>
<Card class="border-primary/20 bg-primary/[.035] mt-4 rounded-lg shadow-xs">
<Card class="border-primary/35 bg-primary/[.06] relative mt-4 overflow-hidden rounded-lg shadow-xs">
<CardContent class="flex flex-col gap-4 p-5 sm:flex-row sm:items-center sm:justify-between">
<div class="flex items-start gap-3">
<SparklesIcon class="text-primary mt-1 size-5 shrink-0" />
<span
class="growth-promotion-icon bg-primary text-primary-foreground grid size-11 shrink-0 place-items-center rounded-md"
aria-hidden="true"
>
<SparklesIcon class="size-5" />
</span>
<div>
<h2 class="font-bold">تحلیل‌گر رشد</h2>
<h2 class="text-primary font-bold">تحلیل‌گر رشد</h2>
<p class="text-muted-foreground mt-1 text-sm leading-7">
فرصت‌های پیش رو و دوره‌های کم‌رونق احتمالی را با تکیه بر داده‌های خودتان ببینید.
</p>
@@ -20,10 +25,29 @@
</div>
<a
{href}
class="border-primary/25 text-primary hover:bg-accent inline-flex min-h-11 shrink-0 items-center justify-center gap-2 rounded-md border px-4 text-sm font-bold"
class="bg-primary text-primary-foreground hover:bg-primary/90 inline-flex min-h-11 shrink-0 items-center justify-center gap-2 rounded-md px-4 text-sm font-bold transition-colors"
>
دیدن تحلیل ۹۰ روزه
<ArrowLeftIcon class="size-4" />
</a>
</CardContent>
</Card>
<style>
.growth-promotion-icon {
animation: growth-attention 2.8s ease-in-out infinite;
}
@keyframes growth-attention {
0%,
68%,
100% {
box-shadow: 0 0 0 0 color-mix(in srgb, var(--primary) 24%, transparent);
transform: scale(1);
}
82% {
box-shadow: 0 0 0 8px color-mix(in srgb, var(--primary) 0%, transparent);
transform: scale(1.04);
}
}
</style>

View File

@@ -7,9 +7,9 @@ describe('GrowthTeaser', () => {
it('links to the growth analyst without starting a generation request', () => {
render(GrowthTeaser, { href: '/growth?terminal=terminal-1' });
expect(screen.getByRole('link', { name: /دیدن تحلیل ۹۰ روزه/ }).getAttribute('href')).toBe(
'/growth?terminal=terminal-1',
);
const link = screen.getByRole('link', { name: /دیدن تحلیل ۹۰ روزه/ });
expect(link.getAttribute('href')).toBe('/growth?terminal=terminal-1');
expect(link.className).toContain('bg-primary');
expect(screen.getByText('تحلیل‌گر رشد')).not.toBeNull();
});
});