- EffortBar: remove unused \`total\` derived variable
- VarietyWarningCards: add border border-[var(--yellow-light)] to cards
- variety page: protein abbreviation uses split(' ')[0].slice(0,3).toUpperCase()
- variety page: breadcrumb separator span gets aria-hidden="true"
Addresses Kai blocker: unused total. Atlas blockers: yellow-light border,
protein abbreviation, breadcrumb aria.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
23 lines
571 B
Svelte
23 lines
571 B
Svelte
<script lang="ts">
|
|
interface Warning {
|
|
title: string;
|
|
explanation: string;
|
|
}
|
|
|
|
let { warnings }: { warnings: Warning[] } = $props();
|
|
</script>
|
|
|
|
{#each warnings as warning}
|
|
<div
|
|
data-testid="warning-card"
|
|
class="rounded-[var(--radius-lg)] border border-[var(--yellow-light)] bg-[var(--yellow-tint)] px-4 py-3"
|
|
>
|
|
<p class="font-[var(--font-sans)] text-[13px] font-medium text-[var(--yellow-text)]">
|
|
{warning.title}
|
|
</p>
|
|
<p class="mt-1 font-[var(--font-sans)] text-[13px] text-[var(--color-text-muted)]">
|
|
{warning.explanation}
|
|
</p>
|
|
</div>
|
|
{/each}
|