Bootstrap UI
Alert Messages
Alert Messages with Link
Alert Messages With Icon
Labels
We restyled the default options for labels and we added the filled class,that can be used in any combination.
DefaultPrimarySuccessInfoWarningDanger<spanclass="badge badge-default">Default</span><spanclass="badge badge-primary">Primary</span><spanclass="badge badge-success">Success</span><spanclass="badge badge-info">Info</span><spanclass="badge badge-warning">Warning</span><spanclass="badge badge-danger">Danger</span>
Accordion
Accordion Link
Multiple targets Accordion
Accordion style two with backgorund
Lorem ipsum
Lorem ipsum dolor sit amet,consectetur adipisicing elit. Placeat,quibusdam!Voluptate nobis,beatae tempora praesentium,illum quis illo,maiores quod similique placeat,saepe mollitia dolor officiis aspernatur deleniti debitis commodi!
Dolor sit amet
Lorem ipsum dolor sit amet,consectetur adipisicing elit. Reprehenderit quos,accusamus!Enim labore totam dicta quibusdam? Eveniet quis asperiores reprehenderit eaque atque in iure voluptate,explicabo,placeat,id earum architecto!
Consectetur adipisicing elit
Lorem ipsum dolor sit amet,consectetur adipisicing elit. Reprehenderit quos,accusamus!Enim labore totam dicta quibusdam? Eveniet quis asperiores reprehenderit eaque atque in iure voluptate,explicabo,placeat,id earum architecto!
Lorem ipsum
Lorem ipsum dolor sit amet,consectetur adipisicing elit. Placeat,quibusdam!Voluptate nobis,beatae tempora praesentium,illum quis illo,maiores quod similique placeat,saepe mollitia dolor officiis aspernatur deleniti debitis commodi!
Dolor sit amet
Lorem ipsum dolor sit amet,consectetur adipisicing elit. Reprehenderit quos,accusamus!Enim labore totam dicta quibusdam? Eveniet quis asperiores reprehenderit eaque atque in iure voluptate,explicabo,placeat,id earum architecto!
Consectetur adipisicing elit
Lorem ipsum dolor sit amet,consectetur adipisicing elit. Reprehenderit quos,accusamus!Enim labore totam dicta quibusdam? Eveniet quis asperiores reprehenderit eaque atque in iure voluptate,explicabo,placeat,id earum architecto!
Pagination
Default
Working with icons
Disabled and active states
Tooltips
Popovers
Position
Common values
<divclass="position-static">...</div><divclass="position-relative">...</div><divclass="position-absolute">...</div><divclass="position-fixed">...</div><divclass="position-sticky">...</div>
Sticky top
<divclass="sticky-top">...</div>
Fixed top
<divclass="fixed-bottom">...</div>
Fixed bottom
<divclass="fixed-bottom">...</div>
Borders
Subtractive
Border color
Border-radius







Shadows
<divclass="shadow-none p-3 mb-5 bg-light rounded">No shadow</div><divclass="shadow-sm p-3 mb-5 bg-white rounded">Small shadow</div><divclass="shadow p-3 mb-5 bg-white rounded">Regular shadow</div><divclass="shadow-lg p-3 mb-5 bg-white rounded">Larger shadow</div>