Studio Web

Visual testing

Visual testing is disabled for the moment
Manifest files

Github
Confluence
Jira
Jenkins
Firebase
Browserstack

light_mode

dark_mode

description v26.26.1 palette 4.0.5 palette 2.43.7

Getting started
- visibility Templates overview
- Guidelines
  - insert_photo Iconography
  - font_download Typography
- Components

Guidelines
- Iconography
  - flag Flags
  - sports_soccer Sports
- Typography
  - text_rotation_none Betclic variable
  - text_fields Roboto
Components
- Shared
  - policy DGS
    - Fullscreen Modal
      - Desktop
      - Mobile
    - Banner
      - Desktop
      - Mobile
- Universes
  - person Account
    - Guidelines
    - Modals
  - casino Casino
    - Banners
      - Gamification
        
        Desktop
        
        Mobile
    - Button
      - Play
    - Bottom Sheet
    - Game cards
      - Desktop
      - Mobile
    - Modal
    - Navigation
      - Header
        
        Mobile
    - ProgressBar
    - Prize drop
      - Game card
        
        Mobile
        
        Desktop
      - Overlay
  - smart_toy Chat
    - Banner
    - Button
    - Cards
      - Deposit
      - File
      - Withdrawal
    - Conversation
    - Progress bar
      - Circular
    - Window
      - Desktop
      - Mobile
  - content_paste Content
    - Promotion
      - Alert
      - Block
      - Button
      - Card
      - Chip
      - Hero
      - Layout
      - Link
      - List
      - Media
      - Modal
      - Spacing
      - Tab
      - Table
      - Text
      - Title
  - euro_symbol Payment
    - Deposit
      - Buttons
    - Payment cards
    - Text Input
    - Withdraw
      - Payment card
  - group Social
    - Sport
      - Profile
        
        Avatar
        
        Favorites
        
        Performances
        
        Relations
        
        Statistics
        
        User informations
        
        Visibility
  - sports_soccer Sport
    - Alert
    - Badge
      - Inline
    - Banner
    - Bottom sheet
    - Cards
      - Player card
      - Top multiple
    - Events
      - Cards
        
        Live
        
        Prelive
      - Headers
        
        Live
        
        Prelive
      - Statistics
        
        Bracket
        
        Lineup
        
        Match center
        
        Live
        
        Performances
        
        Players
        
        Ranking
        
        Rounds
        
        Momentum
        
        Momentum v1
        
        Momentum v2
    - Modal
    - Freequest
    - Goalbooster
      - Cards
      - Pickers
      - Timers
    - Hack friday
      - Chat
        
        Conversation
        
        Window
      - Progressbar
      - Program card
    - Pinata
      - Lucky draw
        
        Challenge card
    - Markets
      - Live
      - Prelive
    - Missions
      - Jackpot
        
        Challenge card
    - Modal
    - My bets
      - Cards
        
        Prelive
        
        Canceled
        
        Cashout
        
        Lost
        
        Ongoing
        
        Won
        
        Live
        
        Cashout
        
        Lost
        
        Ongoing
        
        Won
        
        Safebet
    - Onboarding
    - Picker
    - Progressive betting slip
      - Common
        
        Footers
      - Desktop
        
        Cards
        
        Headers
      - Mobile
        
        Cards
        
        Fastbet
        
        Headers
        
        Strips
    - Tag
  - bedroom_baby Turf
    - Badge
    - Boosted cards
    - Button
      - Checkout
    - Freequest
    - Meeting cards
    - Jockey cards
    - Market types
    - My bets
      - Cards
        
        Canceled
        
        Lost
        
        Ongoing
        
        Won
    - Meeting cards
    - Onboarding
    - Performance tag
    - Pinata
      - Lucky draw
        
        Challenge card
    - Progressive betting slip
      - Common
        
        Footers
        
        Cards
      - Mobile
        
        Strips
        
        Headers
        
        Content
        
        Fastbet
      - Desktop
        
        Headers
    - Race cards
    - Race event
    - Ranking
    - Sections
    - Tag
    - Timer
  - widgets Widget
    - Composition football
    - Virtual sport
- Tactics
  - call_to_action Actions
    - Button
      - Betting
      - Cashout
      - Circle
      - Ghost
        
        Ghost
        
        Ghost Interactive
        
        Ghost Primary
        
        Ghost Secondary
        
        Ghost Tertiary
      - Primary
      - Secondary
      - Structure
      - Tertiary
    - Custom keyboard
    - Dropdown
    - Filter (Chip)
    - Link
    - List
    - Segmented control
    - Slider
    - Switch
    - Tab
  - hub Communication
    - Alert
    - Badge
      - Corner
      - Inline
    - Banner
      - Offer
      - Referral
      - Reminder
      - Welcome
    - Bottom sheet
    - Modal
    - Notification
    - Progress bar
    - Snackbar
    - Tag
    - Timer
    - Tooltip
    - Overlay
  - looks Decorative
    - Animations
    - Loader
    - Rive
    - Separator
    - Skeleton
  - mode Forms
  - menu Navigation
    - Bottom navigation
    - Context menu
    - Footer
      - Desktop
      - Mobile
    - Header
      - Desktop
      - Mobile
    - Tab bar

Prelive

Markets

Market boxes available on a prelive match page. They group the betting selections (odds) for an event and come in several variants depending on the market type and the highlight applied.

Sport

TWIG : Domains/BetclicCom/Sport/_common/_twig/_components/_market_box.twig
CSS : Universes/_sport/_common/_css/_components/_market_box.scss
Universes/_sport/_webapp/_css/_components/_market_box.scss
Universes/_sport/_desktop/_css/_components/_market_box.scss

Default link

Main

1X2

Résultat du match

Two outcomes

Vainqueur du match (temps réglementaire)

Standard

Première mi-temps - les deux équipes marquent

Oui

Non

Table

Buteur dans le match

Paris SG

Neymar

Kylian Mbappé

Mauro Icardi

Verrati

Marseille

D. Benedetto

A. Milik

K. De La Fuente

Dimitri Payet

Category title link

When several market boxes belong to the same category, only the first one carries a category_title, which renders as a heading above the group.

Grouped boxes

Périodes

Première mi-temps - les deux équipes marquent

Oui

Non

Nombre de buts en deuxième mi-temps

0 but

1 but

2 buts

Buteurs

Premier buteur du match

Kylian Mbappé

Ousmane Dembélé

Mason Greenwood

Gonçalo Ramos

Un joueur marque un doublé

Oui

Non

Highlights link

EarlyWin

L'équipe possède 2 buts d'avance ou gagne (tps rég.)

ExtraWin

TRAWIN

Buteur - Extra gains à chaque but du joueur

Paris SG

Neymar

Kylian Mbappé

Mauro Icardi

Verrati

Good deals

Bons plans du match

Paris SG mène à la mi-temps & gagne le match

Dembélé buteur & victoire de Paris SG de 2 buts ou +

Dembélé ou Ramos buteurs

Plus de 2,5 buts & victoire de Paris SG

Grouped markets link

Single odd

Nombre de tirs cadrés dans le match

Kylian Mbappé

2.5

9.5

Lionel Messi

2.5

9.5

Neymar

2.5

9.5

Over / Under

Nombre de points par joueur

Lebron James

19.5

45.5

Stephen Curry

19.5

45.5

Jamal Murray

19.5

45.5

Boosted odds link

Boosted

SUPER BOOST

Mbappe marque au moins 1 but en première mi-temps

Mise max. 20€

GROSSE COTE BOOSTÉE

Plus de 2,5 buts dans le match

Mise max. 10€

Betbuilder link

Betbuilder

But du joueur sur la période

Marseille

D. Payet

A. Milik

B. Kamara

G. Under

Empty state link

Error

Les vestiaires sont vides...

Rien par ici, tu peux chercher un nouveau pari.

On this page

Default

Category title

Highlights

Grouped markets

Boosted odds

Betbuilder

Empty state