30 lines
822 B
Svelte
30 lines
822 B
Svelte
<script>
|
|
let { signal } = $props();
|
|
|
|
const cls = () => {
|
|
if (signal?.includes('Strong')) return 'strong';
|
|
if (signal?.includes('Momentum')) return 'momentum';
|
|
if (signal?.includes('Speculation')) return 'spec';
|
|
if (signal?.includes('Neutral')) return 'neutral';
|
|
return 'avoid';
|
|
};
|
|
</script>
|
|
|
|
<span class="badge {cls()}">{signal ?? '—'}</span>
|
|
|
|
<style>
|
|
.badge {
|
|
display: inline-block;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
padding: 3px 10px;
|
|
border-radius: 20px;
|
|
white-space: nowrap;
|
|
}
|
|
.strong { background: #14532d33; color: #4ade80; }
|
|
.momentum { background: #1e3a5f33; color: #60a5fa; }
|
|
.spec { background: #7c2d1233; color: #fb923c; }
|
|
.neutral { background: #1e293b; color: #94a3b8; }
|
|
.avoid { background: #450a0a33; color: #f87171; }
|
|
</style>
|