Camel2.0 — Dokumentacja komponentów UI

2.37 #Components.VoucherCard Voucher Card

Toggle example guides Toggle HTML markup

Karta vouchera z obrazkiem, tytułem, punktami i CTA. Hover (desktop): bg ciemnieje, tytuł zmniejsza się, btn fade-in. Mobile: CTA zawsze widoczny, stała pozycja.

Examples
Default styling

Komponent voucher-card wymaga obrazków voucherów. Podgląd: vouchers.html

.voucher-card--disabled
Szary, brak interakcji, overlay na obrazie

Komponent voucher-card wymaga obrazków voucherów. Podgląd: vouchers.html

.voucher-card--disabled-special
Z badge "NIEDOSTĘPNY" i ikoną kłódki

Komponent voucher-card wymaga obrazków voucherów. Podgląd: vouchers.html

Markup: voucher-card.html
<p style="color:#999; font-style:italic; padding: 20px;">Komponent voucher-card wymaga obrazków voucherów. Podgląd: <a href="../vouchers.html">vouchers.html</a></p>
Source: src/scss/components/_voucher-card.scss, line 1