Boomla UI kit
Pages
Page example 1
Page example 2
Page example 3
Components
Text
Gallery
Features
Testimonials
Team
Pricing
Contact form
Footer
Restaurant menu entry
Elements
Menu 1
Menu 2
Subpage list
Button
Image Shaper
Feature
Gallery
Testimonial
Icon
Text
Contact form
Anchor
Google Analytics
Powered by Boomla
Layouts
Grid
Horizontal container
Hero layout
Paper
CSS Elems
Buttons
Buttons with icons
Buttons icons only
Input text
Select
Checkbox
Radio
File upload
Textarea
Range
Input group
Icons
Alert
Pagination
CSS Utils
Fonts
Colors
Shadows
Background pattern
Typography
Pagination M action
1
2
3
<? var c = require('/apps/utils/tailwindlang').init(f); ?> <div class="<?== c('flex') ?>"> <button class="<?== c('iconBtnInline-m-tertiaryAction mr-8') ?>"> <svg class="<?== c('btnIcon-m') ?>" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M7.05 9.293L6.343 10 12 15.657l1.414-1.414L9.172 10l4.242-4.243L12 4.343z" fill-rule="evenodd"/></svg> </button> <button class="<?== c('iconBtnInline-m-tertiaryAction mr-8') ?>">1</button> <button class="<?== c('iconBtnInline-m-primaryAction mr-8') ?>">2</button> <button class="<?== c('iconBtnInline-m-tertiaryAction mr-8') ?>">3</button> <button class="<?== c('iconBtnInline-m-tertiaryAction mr-8') ?>"> <svg class="<?== c('btnIcon-m') ?>" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12.95 10.707l.707-.707L8 4.343 6.586 5.757 10.828 10l-4.242 4.243L8 15.657l4.95-4.95z" fill-rule="evenodd"/></svg> </button> </div> <? c.flush(response); ?>
Pagination S gray
1
2
3
<? var c = require('/apps/utils/tailwindlang').init(f); ?> <div class="<?== c('flex') ?>"> <button class="<?== c('iconBtnInline-s-tertiaryNeutral mr-8') ?>"> <svg class="<?== c('btnIcon-s') ?>" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M7.05 9.293L6.343 10 12 15.657l1.414-1.414L9.172 10l4.242-4.243L12 4.343z" fill-rule="evenodd"/></svg> </button> <button class="<?== c('iconBtnInline-s-tertiaryNeutral mr-8') ?>">1</button> <button class="<?== c('iconBtnInline-s-primaryNeutral mr-8') ?>">2</button> <button class="<?== c('iconBtnInline-s-tertiaryNeutral mr-8') ?>">3</button> <button class="<?== c('iconBtnInline-s-tertiaryNeutral mr-8') ?>"> <svg class="<?== c('btnIcon-s') ?>" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M12.95 10.707l.707-.707L8 4.343 6.586 5.757 10.828 10l-4.242 4.243L8 15.657l4.95-4.95z" fill-rule="evenodd"/></svg> </button> </div> <? c.flush(response); ?>