Dizaina sistēma

BidWars izsoļu nama dzīvā stila grāmata. Katrs paraugs tiek attēlots no tēmas marķieriem, tāpēc tas ir pareizs gan gaišajā, gan tumšajā režīmā — pārslēdz tēmu, lai pārbaudītu abus.

Krāsu marķieri

Katrs paraugs ir krāsots ar marķiera klasi (bg-primary, bg-accent…), nekad ar fiksētu hex. Redzamās hex vērtības ir tikai dokumentācijai.

--background

#FFFFFF / #09090B

Pergamenta siltums — lapas virsma

--foreground

#0F1B2D / #FAFAFA

Tumši zila tinte — pamata teksts

--card

--card-foreground

#FFFFFF / #18181B

Paaugstinātās virsmas (kartes, uznirstošie logi)

--primary

--primary-foreground

#0F1B2D / #C9A227

Uzticamība un struktūra — galvenās darbības (tumši zils gaišajā / zelts tumšajā)

--secondary

--secondary-foreground

#F4F4F5 / #27272A

Zema uzsvara darbības un virsmas

--muted

--muted-foreground

#F4F4F5 / #27272A

Mazinātas virsmas + palīgteksts

--accent

--accent-foreground

#C9A227 / #C9A227

Darbība un uzmanības centrs — zelts, izcelšanas/kopīgošanas CTA

--destructive

--destructive-foreground

#B3402A / #E06A4F

Postošas darbības

--warning

--warning-foreground

#FDE8C8 / #3A2E0B

Neizsekojamas sūtīšanas / strīdu stāvokļi

--border

#E4E4E7 / #3F3F46

Robežas un atdalītāji

--input

#E4E4E7 / #71717A

Veidlapu lauku kontūras

--ring

#C9A227 / #C9A227

Fokusa apmales

Tipogrāfija

Virsrakstiem tiek izmantots serif fonts (Fraunces, caur font-display); pamata tekstam — Inter.

Virsraksti — serif (--font-display)

Virsraksts 1 — Āmurs sit vienreiz

Virsraksts 2 — Drīz beidzas

Virsraksts 3 — Izsoles informācija

Pamata teksts — Inter

Pamata teksts — soli kolekciju kartes, komiksus un citus kolekcionējamus priekšmetus saistošās C2C izsolēs ar caurspīdīgām komisijām.

Sīkteksts — Pircēja aizsardzība attiecas uz katru nokārtotu pasūtījumu.

Mazināts — Komisijas vienmēr redzamas pirms solījuma apstiprināšanas.

Komponenti

Kopīgie primitīvi no @auction/ui, attēloti ar variantiem un īsu lietošanas paraugu.

Button

<Button variant="accent" size="lg">…</Button>

Badge

default
secondary
outline
warning
destructive
Izcelts
<Badge variant="warning">…</Badge>
<Badge className="bg-accent text-accent-foreground">…</Badge>

Card

Kartes uzbūve
Galvenes, satura un kājenes vietas

Kartes ir paaugstinātā virsma sludinājumiem, dialogiem un kopsavilkumiem.

<Card>
  <CardHeader><CardTitle>…</CardTitle></CardHeader>
  <CardContent>…</CardContent>
  <CardFooter>…</CardFooter>
</Card>

Input

<Input placeholder="…" />
<Input disabled placeholder="…" />

Skeleton

<Skeleton className="aspect-[4/3] w-full" />

Avatar

AHAH
<Avatar>
  <AvatarImage src="…" alt="…" />
  <AvatarFallback>AH</AvatarFallback>
</Avatar>

Raksti

Kanoniskie salikumi no iepriekš minētajiem primitīviem — kopē tos, neizdomā no jauna.

Izsoles karte

1999 Charizard Holo — PSA 9
Kolekciju kartes

Pašreizējais solījums: €245.00

€250.00 + €12.50 komisija = €262.50

Izcelts
Beidzas pēc 2 h 14 min

Brīdinājuma baneris

Informācijas baneris

Solījumi ir saistoši: uzvarētāja karte tiek automātiski apmaksāta, kad izsole beidzas.