Twig Extension
{% set toto = '12345678900015' %} Siret : {{ toto|siret() }}
Title
Titre de niveau h1 with small
Titre de niveau h2 with small
Titre de niveau h3 with small
Titre de niveau h4 with small
Titre de niveau h5 with small
Titre de niveau h6 with small
Title with class cool
Titre de niveau h1 with small
Titre de niveau h2 with small
Titre de niveau h3 with small
Titre de niveau h4 with small
Titre de niveau h5 with small
Titre de niveau h6 with small
Title with subheader class
Titre de niveau h1
Titre de niveau h1
Titre de niveau h1
Titre de niveau h1
Titre de niveau h1
Titre de niveau h1
Paragraph
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Architecto aut blanditiis cupiditate, debitis dignissimos ea expedita harum hic illo in iure minima, molestiae perspiciatis sed sunt tenetur voluptas voluptate voluptatem!
Utils Typography different weights
Extra bold class fw-600
Bold class fw-500 or txt-bold or b
Medium class fw-400 or txt-regular
Default is 300 p without class, use class fw-300 on what you whant change weight
Light class fw-200 or txt-light
Extra light class fw-100
Lead Paragraph
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet aspernatur assumenda cupiditate debitis fugit illum in laudantium modi nihil, omnis porro qui quo sapiente sunt suscipit tempora totam unde voluptates?
Citation
Those people who think they know everything are a great annoyance to those of us who do. Isaac Asimov
Links
Default without classWith class underline
Abbreviation
Lorem ipsum dolor sit amet, J. R. R. consectetur adipisicing elit. Accusantium amet aut, commodi corporis debitis dolorum ex hic illum, in laborum laudantium magni nobis quae quo saepe sequi suscipit ut voluptatum!
Buttons
So Tiny So Small So Basic So Large Such Expand Wow, Small Expand Primary Secondary Green Red Orange Blue Azur PurpleHelper class for button
Brand Confirm Save Delete Update Cancel Warning Alert Download Word Excel Pdf Google facebook twitter instagramGroup
with icon
Save Annuler Update confirm warning Alert Download Save Annuler Updateicon only
Badge / Label
1 2 3 A B 75 75 75 75Primary Label Red Label Green Label Grey Label Orange Label Azur Label Purple Label Blue Label Brand Label
Progress bar
Progress bar with text
25%
Progress bar small
Progress bar tiny
Breadcrumbs
Breadcrumbs style-1
Pagination
Reveal
Awesome. I Have It.
Your couch. It is mine.
I'm a cool paragraph that lives inside of an even cooler modal. Wins!
Sweet Alert
Table
| Table Header | Table Header | Table Header | Table Header |
|---|---|---|---|
| Content Goes Here | This is longer content Donec id elit non mi porta gravida at eget metus. | Content Goes Here | Content Goes Here |
| Content Goes Here | This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. | Content Goes Here | Content Goes Here |
| Content Goes Here | This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. | Content Goes Here | Content Goes Here |
DataTable
| Table Header | Table Header | Table Header | Table Header |
|---|---|---|---|
| Content Goes Here | This is longer content Donec id elit non mi porta gravida at eget metus. | Content Goes Here | 1 |
| Content Goes Here | This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. | Content Goes Here | 2 |
| Content Goes Here | This is longer Content Goes Here Donec id elit non mi porta gravida at eget metus. | Content Goes Here | 3 |
Datepicker
Tab
Vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend nibh porttitor. Ut in nulla enim. Phasellus molestie magna non est bibendum non venenatis nisl tempor. Suspendisse dictum feugiat nisl ut dapibus.
CKEditor
{# {{ form_start(form) }}#} {# {{ form_end(form) }}#}Icons
FontAweSome 4,7 : More information, options, examples here