Account

Here is the design pattern of the scope account.

CSS components : Betclic/_account/_common/_css/_components/_my_account/**/*.scss

Global structure

Header + Content

Back

Information Sint enim mollit velit eu.

Title Sint magna laboris

Text Consequat nisi tempor quis aliqua. Ex officia et id laborum excepteur officia aliqua do sit. Sit excepteur aliquip mollit ea minim.

Title Incididunt consectetur

Text Lorem commodo deserunt id irure. Esse elit eu aliquip laboris qui eiusmod ipsum. Exercitation commodo in officia velit irure reprehenderit anim adipisicing.

Titles text and link outside a box

Title Id esse nostrud

Text dolor velit mollit sint duis laborum. Aliqua culpa nulla esse Lorem veniam aliqua id ullamco incididunt et officia. Sit exercitation sit in ipsum sit et non aliquip aute nisi aliquip. Magna occaecat est amet exercitation voluptate dolore aliquip laborum cillum nostrud. Cillum mollit enim proident ad deserunt.

Lorem magna

Boxes

Box with title, separator and text

Title Ipsum ad irure

Non quis laborum culpa eiusmod sint ea.

Title Ipsum ad irure

Box with title, special case text (label and value) and buttons

Dolor velit mollit sint duis laborum. Aliqua culpa nulla esse Lorem veniam aliqua id ullamco incididunt et officia. Sit exercitation sit in ipsum sit et non aliquip aute nisi aliquip. Magna occaecat est amet exercitation voluptate dolore aliquip laborum cillum nostrud. Cillum mollit enim proident ad deserunt.

Label cupidatat occaecat : Value ad aute tempor

Box with Personal information list

Title

Title
Title Consectetur exercitation ad est qui consectetur ullamco excepteur aute ipsum id Lorem do irure

Title Excepteur mollit esse sit fugiat tempor excepteur aliqua et consectetur proident tempor aute voluptate

Box with menu list

Title menu 1
Title menu 2
Title menu 3

Box with complex list 1

Label

Value

Label Lorem ipsum dolor sit amet consectetur, adipisicing elit

Value Et ea enim dolor reprehenderit aliqua

Box with complex list 2

Title

Sub title

Tag adipisicing

Title

Error Deserunt minim cupidatat amet tempor anim enim eu esse.
Title Deserunt labore adipisicing culpa aliqua fugiat anim in elit ut velit elit

Sub title Reprehenderit anim ad tempor officia amet

Tag reprehenderit

Title Deserunt labore

Error Est in excepteur consequat non.
Title Deserunt labore adipisicing culpa aliqua fugiat anim in elit ut velit elit

Sub title Reprehenderit anim ad tempor officia amet

Tag reprehenderit
Title Deserunt labore adipisicing culpa aliqua fugiat anim in elit ut velit elit

Sub title Reprehenderit anim ad tempor officia amet

Tag reprehenderit

Title Deserunt labore

Box with mailbox list

Veniam cupidatat laboris et labore consequat ipsum ea proident ad ex

Ad quis ut id do anim minim enim commodo ullamco nisi
Ullamco nulla pariatur consequat magna fugiat sint deserunt amet proident esse proident sint deserunt deserunt

Labore mollit cillum consectetur cillum cupidatat

Box with button aspect items in list

Dolor duis sint velit laborum magna duis nostrud
Dolor duis sint velit laborum magna duis nostrud

Box with separator and with big button aspect in list

Velit labore pariatur

Reprehenderit irure dolor nostrud nostrud duis consectetur nostrud in enim anim adipisicing sint fugiat excepteur

Exercitation enim ad ut consectetur id incididunt ea sunt exercitation
Or
RNostrud duis non laboris excepteur ea sint tempor esse

Laboris nisi eu in velit eiusmod non

Box with basic list

Veniam cupidatat laboris et labore consequat ipsum ea proident ad ex

Veniam cupidatat laboris et labore consequat ipsum ea proident ad ex
Ullamco nulla pariatur consequat magna fugiat sint deserunt amet proident esse proident sint deserunt deserunt
Labore mollit cillum consectetur cillum cupidatat

Box with switch

Occaecat sunt laboris id minim mollit mollit non ea nulla nulla consequat esse reprehenderit occaecat

Proident ea in voluptate esse mollit sunt cillum eu nostrud in nulla