definicao de layout
This commit is contained in:
238
public/assets/pug/pages/template/touchspin.pug
Normal file
238
public/assets/pug/pages/template/touchspin.pug
Normal file
@@ -0,0 +1,238 @@
|
||||
- var touchspin = true;
|
||||
- var theme_customizer = true;
|
||||
|
||||
doctype html
|
||||
html(lang='en')
|
||||
include ../../components/header-files
|
||||
body
|
||||
include ../../components/loader
|
||||
// page-wrapper Start
|
||||
#pageWrapper.page-wrapper
|
||||
include ../../components/header
|
||||
// Page Body Start
|
||||
.page-body-wrapper.horizontal-menu
|
||||
include ../../components/sidebar
|
||||
.page-body
|
||||
.container-fluid
|
||||
.page-header
|
||||
.row
|
||||
.col-sm-6
|
||||
h3
|
||||
| Touchspin
|
||||
ol.breadcrumb
|
||||
li.breadcrumb-item
|
||||
a(href='index.html')
|
||||
| Home
|
||||
li.breadcrumb-item Forms
|
||||
li.breadcrumb-item Form Widgets
|
||||
li.breadcrumb-item.active Touchspin
|
||||
.col-sm-6
|
||||
include ../../components/bookmark
|
||||
// Container-fluid starts
|
||||
|
||||
// Container-fluid starts
|
||||
.container-fluid
|
||||
// Bootstrap TouchSpin Spinners start
|
||||
.bootstrap-touchspin
|
||||
.row
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Default Touchspin
|
||||
span
|
||||
| Add
|
||||
code .touchspin
|
||||
| class to input to add touchspin input group.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='40')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title vertical Touchspin
|
||||
span
|
||||
| Add
|
||||
code .touchspin-vertical
|
||||
| class for vertical touchspin input group.
|
||||
.card-body
|
||||
fieldset
|
||||
.touchspin-vertical-tab
|
||||
input.touchspin-vertical(type='text', value='55')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin with Postfix
|
||||
span
|
||||
| Add
|
||||
code data-bts-postfix="POSTFIX_VALUE"
|
||||
| attribute to input to add postfix to touchspin input group.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='40', data-bts-postfix='%')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin with Prefix
|
||||
span
|
||||
| Add
|
||||
code data-bts-prefix="PREFIX_VALUE"
|
||||
| attribute to input to add prefix to touchspin input group.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='40', data-bts-prefix='#')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Min Max Value of Touchspin
|
||||
span
|
||||
| Use
|
||||
code data-bts-min="VALUE" data-bts-max="VALUE"
|
||||
| attribute to input to set min and max value of touchspin input.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='40', data-bts-min='1', data-bts-max='100')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin with initial Value
|
||||
span
|
||||
| Add
|
||||
code data-bts-init-val="VALUE"
|
||||
| attribute attribute to set initial value for input group.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', data-bts-init-val='20')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin steps
|
||||
span
|
||||
| Add
|
||||
code data-bts-step="VALUE"
|
||||
| attribute for increament and decrement steps to touchspin input group.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='40', data-bts-step='10')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Decimal Value of Touchspin
|
||||
span
|
||||
| Use
|
||||
code data-bts-decimal="VALUE"
|
||||
| attribute to use decimal value of touchspin input.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='50.00', data-bts-step='0.25', data-bts-decimals='2')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Change Button Class to link
|
||||
span
|
||||
| Add
|
||||
code data-bts-button-down-class & data-bts-button-up-class
|
||||
| attribute to change button Class.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='40', data-bts-button-down-class='btn btn-link', data-bts-button-up-class='btn btn-link')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin With Icon
|
||||
span
|
||||
| Add icon class in
|
||||
code data-bts-postfix
|
||||
| attribute to icon to postfix as well prefix.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', data-bts-postfix="<i class='fa fa-check'></i>", value='40')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin Icon Button
|
||||
span
|
||||
| Use
|
||||
code data-bts-button-down-txt & data-bts-button-up-txt
|
||||
| attribute to set touchspin icon button.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='50.00', data-bts-button-down-txt="<i class='fa fa-angle-down'></i>", data-bts-button-up-txt="<i class='fa fa-angle-up'></i>")
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin With Dropdown
|
||||
span
|
||||
| Use
|
||||
code data-bts-prefix & data-bts-postfix
|
||||
| attribute to set Prefix and Postfix to touchspin input with button.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin(type='text', value='50.00', data-bts-prefix='Pre', data-bts-postfix='Post')
|
||||
.dropdown-basic
|
||||
.dropdown
|
||||
.btn-group.mb-0.me-0
|
||||
button.dropbtn.btn-light.txt-dark(type='button')
|
||||
| Action
|
||||
span
|
||||
i.icofont.icofont-arrow-down
|
||||
.dropdown-content
|
||||
a(href='#') Action
|
||||
a(href='#') Another Action
|
||||
a(href='#') Something Else Here
|
||||
.dropdown-divider
|
||||
a(href='#') Separated Link
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Touchspin mousewheel Disable
|
||||
span
|
||||
| Add
|
||||
code .touchspin-stop-mousewheel
|
||||
| class to diable mousewheel.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group
|
||||
input.touchspin-stop-mousewheel(type='text', value='40')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Small Horizontal Touchspin
|
||||
span
|
||||
| Add
|
||||
code .input-group-sm
|
||||
| class to input-group.
|
||||
.card-body
|
||||
fieldset
|
||||
.input-group.input-group-sm
|
||||
input.touchspin(type='text', value='60')
|
||||
.col-sm-12.col-md-6
|
||||
.card
|
||||
.card-header.pb-0
|
||||
h5.card-title Large Horizontal Touchspin
|
||||
.card-body
|
||||
p
|
||||
| Add
|
||||
code .input-group-lg
|
||||
| class to input-group.
|
||||
fieldset
|
||||
.input-group.input-group-lg
|
||||
input.touchspin(type='text', value='40')
|
||||
// Bootstrap TouchSpin Spinners End
|
||||
// Container-fluid Ends
|
||||
|
||||
// Container-fluid Ends
|
||||
|
||||
// Container-fluid Ends
|
||||
include ../../components/footer
|
||||
include ../../components/footer-files
|
||||
Reference in New Issue
Block a user