@repo/ui

Testovacia plocha globálnych komponentov

Kompletný katalóg zdieľaných komponentov z balíka @repo/ui — každý komponent je viditeľný na jednej zo štyroch demo stránok. Slúži len na testovanie a vizuálnu QA.

Domov · základné UI

16 komponentov

Button · Card · Container · Section · Input · Textarea · Badge · IconBox · SectionHeader · FeatureCard · TestimonialCard · ImageCard · StatsCard/Grid (center) · FormField · CtaBanner

/zaklady · primitívy & médiá

17 komponentov

Hero (page + spotlight) · Accordion · Tabs · RatingStars · CheckList · Breadcrumbs · LogoMarquee · BeforeAfterSlider/Showcase · StatsGrid (start) · ImageWithSkeleton · VideoBackground · Lightbox · CountryFlag · Reveal · CounterNumber · FormField (error)

/sekcie · sekčné komponenty

21 komponentov

ProofBentoGrid · TrustLedger · CaseStudyTimeline · ImageStoryStrip · DecisionPath · FitGuide · ObjectionResolver · ScopeMatrix · PriceFactors · QuoteTriggerPanel · ServiceScenarioExplorer · ProcessMap · RealityCheckBlock · AppPreviewFrame · DocumentFlowPreview · EmptyState · ProjectTeardown · StickyProofCTA · ComparisonNarrative · FeatureSpotlight · LocalAreaProof

/konverzie · konverzné komponenty

13 komponentov

Hero (split) · HeroVisualGrid · ContactFormShell · WebsiteAuditPanel · PricingGrid (PricingCard) · TimelineComparison · ReviewWall (ReviewCard) · PortfolioGrid · ServiceDetailSection · ServiceDepthTabs · ExpectationSetter · FAQSection · FloatingContactDock

Button

Card

Default

Základná karta s plným povrchom a jemným okrajom.

Elevated

Zvýraznená karta s "sheen" gradientom a tieňom.

Outline + interactive

Priehľadná karta, ktorá reaguje na hover.

Input & Textarea

Container — veľkosti

narrow — max-w-4xl

default — max-w-6xl

wide — max-w-7xl

StatsCard & StatsGrid

Číslo sa naanimuje z 0, keď sa karta dostane do viewportu. Animácia sa spustí iba raz (pokiaľ nie je zapnuté replayOnView).

0Ukážková metrika A

0Ukážková metrika B

0Ukážková metrika C (formátovanie tisícov)

0+Samostatná StatsCard so suffixom a formátovaním tisícov

Badge & IconBox

Eyebrow s čiarkouEyebrow mutedPill primaryPill muted

SectionHeader

Eyebrow

Zarovnaný nadpis sekcie

Zdieľaný SectionHeader s eyebrow, nadpisom a popisom. Podporuje zarovnanie a veľkosti.

FeatureCard

/ 01

Stack layout

Karta s ikonou hore, meta vpravo a popisom.

Viac

/ 02

Eyebrow namiesto ikony

Vhodné pre kroky procesu bez ikony.

/ 03

Row layout

Ikona vľavo (steel tón), obsah vpravo.

TestimonialCard & ImageCard

„Ukážkový citát spokojného zákazníka pre vizuálnu kontrolu karty.“

Jana Nováková

Projektová manažérka

ImageCard s popisom

Overlay, popis a hover akcia.

FormField

CtaBanner

Veľký CTA banner

Použiteľný na konci stránok. Veľkosti sm / md / lg.