Design System

Le code de cette page est visible dans le fichier app/views/pages/design_system.html.erb.

N'hésitez pas à copier/coller le code, cette page existe pour faciliter la vie des développeurs, montrer les helpers disponibles et servir d'exemple dans le code afin de gagner du temps et comprendre en quelques secondes comment ils s'utilisent.

Timeline

Badges

Badge Badge Badge Badge Badge Badge Type: Outline Badge Badge

Alerts

Un exemple d'alerte de type :danger

Un exemple d'alerte de type :warning

Un exemple d'alerte de type :success

Un exemple d'alerte de type :info

Un exemple d'alerte qui peut être fermé grâce à "has_dismiss: true".

Button

legacy_button_to

default

disabled

Primary & second link

primary_link secondary_link

Modals

Side Panel

Inputs

Address Form

Choices

Choisissez une option

Option A

Option B

Avec une valeur par défaut

Mensuel

Annuel

Collection Checkboxes

Mon label

Lorem ipsum dolor sit amet

Lorem2

Ipsum2

Dolor2

Responsive Table

Heat	Tastiness	Price
Bread	Heat Warm	Tastiness Excellent	Price $10
Corn	Heat Mild	Tastiness Good	Price $8
Tomato soup	Heat Hot	Tastiness Very Good	Price $12
Chorizo	Heat Spicy	Tastiness Excellent	Price $15
Pizza	Heat Medium	Tastiness Average	Price $9
Burger	Heat Mild	Tastiness Fair	Price $7
Ramen	Heat Hot	Tastiness Good	Price $11
Udon	Heat Warm	Tastiness Fair	Price $6

Table

Heat	Tastiness	Price
Warm	Excellent	$10
Mild	Good	$8
Hot	Very Good	$12
Spicy	Excellent	$15
Medium	Average	$9
Mild	Fair	$7
Hot	Good	$11
Warm	Fair	$6