Загрузка...

Карточка с переключателем для доп. опций. Показывает название, цену и кнопку вкл/выкл. Идеально для чекаута, цен и конфигураторов.
<div class="ring-1 ring-black/10 flex flex-col bg-black/5 rounded-2xl pt-5 pr-5 pb-5 pl-5 justify-between">
<div>
<p class="text-base font-medium tracking-tight font-geist">Need growth acceleration?</p>
<p class="mt-2 text-sm text-black/70 font-geist">Add strategic marketing and SEO optimization.</p>
</div>
<div class="mt-8 flex items-center justify-between">
<div class="text-sm font-geist">
<span class="text-black/90">+ $1,850</span>
</div>
<button type="button" role="switch" aria-checked="false" data-upsell-switch="" class="inline-flex h-6 w-11 items-center rounded-full bg-black/10 ring-1 ring-black/10 transition-colors duration-200">
<span data-upsell-knob="" class="h-4 w-4 translate-x-0 rounded-full bg-black transition-transform duration-200"></span>
<span class="sr-only">Toggle Growth Package add-on</span>
</button>
</div>
</div>