Styleguide

01

Inputs & actions

Button, Input, Label, Field, InputGroup, Textarea -- token-driven, docs/spec/ui.md §7.

Button

Field, Input & Textarea

Shown to other operators.

Enter a valid email address.

At least 8 characters.

Optional context for the team.

02

Selection & structure

Checkbox, Separator, Select (custom + native), density ToggleGroup, chevron link, benefit pill.

Checkbox + Label

Select (custom trigger/popup)

Native select

ToggleGroup (density)

Chevron link

Back to sign in

Benefit pill

No setup feePay by the minute

03

Display & feedback

Card, Badge, StatusDot, Skeleton, Toast, Banner -- live.

Card

Rig-02

Short supporting description of the card panel.

Panel content area.

Badge

DefaultOutlineSuccessWarnInfoDestructive

StatusDot

LivePreparingInfoFailed

Skeleton (loading state)

Toast

Banner (dismissible)

Scheduled maintenance tonight 02:00-03:00 Amman time.

04

Auth & composed forms

OTPField, password strength meter, countdown text, icon-art, brand mark -- live.

OTPField -- empty

OTPField -- filled

2
4
8
1
9
3

Password strength

Weak

Ok

Strong

Countdown text

Resend in0:24

Icon art

05

Rows & lists

Row, sticky action bar, KPI tile, result list, Empty -- live.

Row

Two-factor authentication

Add an extra layer of security to your account.

Delete account

Permanently remove your account and all its data.

Sticky action bar

All changes saved

Unsaved changes

KPI tile

Hour credits

342

min

8.550 JD

Hour credits

Empty

No sessions found

Try clearing your filters.

End of feed

Result list -- divided (populated)

LiveSession no. 48245 min - Balanced profile
2026-09-17 14:02
EndedSession no. 48130 min - Performance profile
2026-09-17 09:41
FailedSession no. 48012 min - Balanced profile
2026-09-16 21:18

Result list -- divided (end of feed)

LiveSession no. 48245 min - Balanced profile
2026-09-17 14:02
EndedSession no. 48130 min - Performance profile
2026-09-17 09:41
FailedSession no. 48012 min - Balanced profile
2026-09-16 21:18

End of feed

Result list -- card grid (populated)

Session no. 482

Live

45 min - Balanced profile

2026-09-17 14:02

Session no. 481

Ended

30 min - Performance profile

2026-09-17 09:41

Session no. 480

Failed

12 min - Balanced profile

2026-09-16 21:18

Result list -- empty (no results)

No sessions found

Try adjusting your filters.

Result list -- loading

Result list -- error

06

Overlays & pages

Modal, confirm dialog, 404, status page, Timeline -- live.

Modal (form/create, open state)

Confirm dialog (destructive, open state)

404 / not-found

Page not found

The page you're looking for doesn't exist or has moved.

Take me home

Status page

System status

All times shown in UTC.

Components

Streaming APIOperational
Control planeDegraded performance
Host agentsMajor outage

Incidents

Degraded

Elevated latency on EU hosts

  1. 14:32 UTCOperator

    Identified root cause; rolling out a fix to affected hosts.

  2. 14:02 UTCMonitoring

    Latency alarms triggered on 3 EU hosts.

Timeline (severity nodes, expandable diff)

  1. 09:14:02Lease Guard

    Host silence exceeded the freshness bound; session ended.

    host_id=rig-07

  2. 09:12:41Node Agent

    Heartbeat missed.

  3. 09:10:00Customer

    Session started.

    - state: PENDING
+ state: ACTIVE

Timeline (no events)

No events yet.

Timeline (loading)

07

Composed & complex

Pricing card and owner availability scheduler -- live.

Pricing / package card (emphasized tier)

Starter

5 JD

5 hours, one-time top-up

Enough for a couple of sessions.

  • 5 hours of play credit
  • Any available rig
  • Credits never expire

Prepaid -- no auto-renew

Most popular

Standard

15 JD

18 hours, one-time top-up

The most popular pick for regular players.

  • 18 hours of play credit
  • Any available rig
  • Credits never expire
  • Priority queue placement

Prepaid -- no auto-renew

Plus

30 JD

40 hours, one-time top-up

For weekly regulars who don't want to think about it.

  • 40 hours of play credit
  • Any available rig
  • Credits never expire
  • Priority queue placement

Prepaid -- no auto-renew

Availability scheduler

Populated

September 2026

Loading (fetching)

08

Bilingual (EN/AR)

Non-mirrored: one LTR document, per-run bdi isolation for Arabic text and for Latin digits/references embedded in Arabic runs (ui.md §10).

Split-atmosphere sign-in -- English-dominant

SeatHub (سيت هَب)

One account, every rented rig.

Enter your phone number

We'll send a code on WhatsApp

أدخل رقم هاتفك

Split-atmosphere sign-in -- Arabic-dominant

SeatHub (سيت هَب)

سيارة واحدة، أي جهاز مستأجر.

أدخل رقم هاتفك

سنرسل رمزًا على واتساب

Enter your phone number

Data surface (wallet credit + top-up reference) -- English-dominant

Your credit

35

min

Send 3 JOD to this CliQ alias and include reference SH-4F7KQ2

Waiting for confirmation

Data surface (wallet credit + top-up reference) -- Arabic-dominant

رصيدك

35

min

أرسل ٣ د.أ إلى هذا العنوان واذكر الرقم المرجعي SH-4F7KQ2

بانتظار التأكيد