702 lines
59 KiB
Plaintext
702 lines
59 KiB
Plaintext
- var prism = true;
|
|
- var clipboard = true;
|
|
- var customcard = true;
|
|
- var theme_customizer = true;
|
|
- var sidebar = true;
|
|
- var scrollbar = 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
|
|
| Raised Buttons
|
|
ol.breadcrumb
|
|
li.breadcrumb-item
|
|
a(href='index.html')
|
|
| Home
|
|
li.breadcrumb-item Buttons
|
|
li.breadcrumb-item.active Raised Style
|
|
.col-sm-6
|
|
include ../../components/bookmark
|
|
// Container-fluid starts
|
|
.container-fluid
|
|
.row
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Default buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .btn-pill
|
|
| and
|
|
code .btn-air-*
|
|
| class for raised button
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-primary.btn-air-primary(type='button' title='btn btn-pill btn-primary btn-air-primary') Primary Button
|
|
button.btn.btn-pill.btn-secondary.btn-air-secondary(type='button' title='btn btn-pill btn-secondary btn-air-secondary') Secondary Button
|
|
button.btn.btn-pill.btn-success.btn-air-success(type='button' title='btn btn-pill btn-success btn-air-success') Success Button
|
|
button.btn.btn-pill.btn-info.btn-air-info(type='button' title='btn btn-pill btn-info btn-air-info') Info Button
|
|
button.btn.btn-pill.btn-warning.btn-air-warning(type='button' title='btn btn-pill btn-warning btn-air-warning') Warning Button
|
|
button.btn.btn-pill.btn-danger.btn-air-danger(type='button' title='btn btn-pill btn-danger btn-air-danger') Danger Button
|
|
button.btn.btn-pill.btn-light.btn-air-light(type='button' title='btn btn-pill btn-light btn-air-light') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-primary btn-air-primary">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-secondary btn-air-secondary">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-success btn-air-success">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-info btn-air-info">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-warning btn-air-warning">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-danger btn-air-danger">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-light btn-air-light">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Large buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| and
|
|
code .btn-lg
|
|
| class for large button
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-primary.btn-air-primary.btn-lg(type='button' title='btn btn-pill btn-primary btn-air-primary btn-lg') Primary Button
|
|
button.btn.btn-pill.btn-secondary.btn-air-secondary.btn-lg(type='button' title='btn btn-pill btn-secondary btn-air-secondary btn-lg') Secondary Button
|
|
button.btn.btn-pill.btn-success.btn-air-success.btn-lg(type='button' title='btn btn-pill btn-success btn-air-success btn-lg') Success Button
|
|
button.btn.btn-pill.btn-info.btn-air-info.btn-lg(type='button' title='btn btn-pill btn-info btn-air-info btn-lg') Info Button
|
|
button.btn.btn-pill.btn-warning.btn-air-warning.btn-lg(type='button' title='btn btn-pill btn-warning btn-air-warning btn-lg') Warning Button
|
|
button.btn.btn-pill.btn-danger.btn-air-danger.btn-lg(type='button' title='btn btn-pill btn-danger btn-air-danger btn-lg') Danger Button
|
|
button.btn.btn-pill.btn-light.btn-air-light.btn-lg(type='button' title='btn btn-pill btn-light btn-air-light btn-lg') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head1', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head1
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-primary btn-air-primary btn-lg">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-secondary btn-air-secondary btn-lg">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-success btn-air-success btn-lg">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-info btn-air-info btn-lg">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-warning btn-air-warning btn-lg">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-danger btn-air-danger btn-lg">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-light btn-air-light btn-lg">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Small buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| and
|
|
code .btn-sm
|
|
| class for small button
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-primary.btn-air-primary.btn-sm(type='button' title='btn btn-pill btn-primary btn-air-primary btn-sm') Primary Button
|
|
button.btn.btn-pill.btn-secondary.btn-air-secondary.btn-sm(type='button' title='btn btn-pill btn-secondary btn-air-secondary btn-sm') Secondary Button
|
|
button.btn.btn-pill.btn-success.btn-air-success.btn-sm(type='button' title='btn btn-pill btn-success btn-air-success btn-sm') Success Button
|
|
button.btn.btn-pill.btn-info.btn-air-info.btn-sm(type='button' title='btn btn-pill btn-info btn-air-info btn-sm') Info Button
|
|
button.btn.btn-pill.btn-warning.btn-air-warning.btn-sm(type='button' title='btn btn-pill btn-warning btn-air-warning btn-sm') Warning Button
|
|
button.btn.btn-pill.btn-danger.btn-air-danger.btn-sm(type='button' title='btn btn-pill btn-danger btn-air-danger btn-sm') Danger Button
|
|
button.btn.btn-pill.btn-light.btn-air-light.btn-sm(type='button' title='btn btn-pill btn-light btn-air-light btn-sm') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head2', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head2
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-primary btn-air-primary btn-sm">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-secondary btn-air-secondary btn-sm">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-success btn-air-success btn-sm">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-info btn-air-info btn-sm">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-warning btn-air-warning btn-sm">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-danger btn-air-danger btn-sm">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-light btn-air-light btn-sm">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Extra Small buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| and
|
|
code .btn-xs
|
|
| class for extra small button
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-primary.btn-air-primary.btn-xs(type='button' title='btn btn-pill btn-primary btn-air-primary btn-xs') Primary Button
|
|
button.btn.btn-pill.btn-secondary.btn-air-secondary.btn-xs(type='button' title='btn btn-pill btn-secondary btn-air-secondary btn-xs') Secondary Button
|
|
button.btn.btn-pill.btn-success.btn-air-success.btn-xs(type='button' title='btn btn-pill btn-success btn-air-success btn-xs') Success Button
|
|
button.btn.btn-pill.btn-info.btn-air-info.btn-xs(type='button' title='btn btn-pill btn-info btn-air-info btn-xs') Info Button
|
|
button.btn.btn-pill.btn-warning.btn-air-warning.btn-xs(type='button' title='btn btn-pill btn-warning btn-air-warning btn-xs') Warning Button
|
|
button.btn.btn-pill.btn-danger.btn-air-danger.btn-xs(type='button' title='btn btn-pill btn-danger btn-air-danger btn-xs') Danger Button
|
|
button.btn.btn-pill.btn-light.btn-air-light.btn-xs(type='button' title='btn btn-pill btn-light btn-air-light btn-xs') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head3', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head3
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-primary btn-air-primary btn-xs">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-secondary btn-air-secondary btn-xs">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-success btn-air-success btn-xs">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-info btn-air-info btn-xs">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-warning btn-air-warning btn-xs">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-danger btn-air-danger btn-xs">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-light btn-air-light btn-xs">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Active Buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .active
|
|
| for active state
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-primary.btn-air-primary.active(type='button' title='btn btn-pill btn-primary btn-air-primary active') Active
|
|
button.btn.btn-pill.btn-secondary.btn-air-secondary.active(type='button' title='btn btn-pill btn-secondary btn-air-secondary active') Active
|
|
button.btn.btn-pill.btn-success.btn-air-success.active(type='button' title='btn btn-pill btn-success btn-air-success active') Active
|
|
button.btn.btn-pill.btn-info.btn-air-info.active(type='button' title='btn btn-pill btn-info btn-air-info active') Active
|
|
button.btn.btn-pill.btn-warning.btn-air-warning.active(type='button' title='btn btn-pill btn-warning btn-air-warning active') Active
|
|
button.btn.btn-pill.btn-danger.btn-air-danger.active(type='button' title='btn btn-pill btn-danger btn-air-danger active') Active
|
|
button.btn.btn-pill.btn-light.btn-air-light.active.txt-dark(type='button' title='btn btn-pill btn-light btn-air-light active') Active
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head4', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head4
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-primary btn-air-primary active">Active</button>
|
|
| <button type="button" class="btn btn-pill btn-secondary btn-air-secondary active">Active</button>
|
|
| <button type="button" class="btn btn-pill btn-success btn-air-success active">Active</button>
|
|
| <button type="button" class="btn btn-pill btn-info btn-air-info active">Active</button>
|
|
| <button type="button" class="btn btn-pill btn-warning btn-air-warning active">Active</button>
|
|
| <button type="button" class="btn btn-pill btn-danger btn-air-danger active">Active</button>
|
|
| <button type="button" class="btn btn-pill btn-light btn-air-light active txt-dark">Active</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Disabled buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .disabled
|
|
| class or
|
|
code disabled="disabled"
|
|
| attribute for disabled button
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-primary.btn-air-primary.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-secondary.btn-air-secondary.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-success.btn-air-success.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-info.btn-air-info.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-warning.btn-air-warning.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-danger.btn-air-danger.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-light.btn-air-light.disabled(type='button') Disabled
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head5', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head5
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-primary btn-air-primary disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-secondary btn-air-secondary disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-success btn-air-success disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-info btn-air-info disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-warning btn-air-warning disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-danger btn-air-danger disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-light btn-air-light disabled txt-dark">Disabled</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Custom state buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| The
|
|
code .btn
|
|
| class used with
|
|
code <button>
|
|
| ,
|
|
code <a>
|
|
| and
|
|
code <input>
|
|
| elements.
|
|
.card-body.btn-showcase
|
|
a.btn.btn-pill.btn-primary.btn-air-primary(href='#', data-toggle='tooltip', title='btn btn-primary', role='button') Link
|
|
input.btn.btn-pill.btn-secondary.btn-air-secondary.btn-air-secondary(type='button', value='Input', data-toggle='tooltip', title='btn btn-secondary')
|
|
input.btn.btn-pill.btn-success.btn-air-success.btn-air-success(type='submit', value='Submit', data-toggle='tooltip', title='btn btn-success')
|
|
button.btn.btn-pill.btn-info.btn-air-info.btn-air-info(type='submit', title='btn btn-info') Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head6', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head6
|
|
| <!-- Cod Box Copy begin -->
|
|
| <a class="btn btn-pill btn-primary btn-air-primary" href="#" data-bs-toggle="tooltip;" title="btn btn-primary" role="button">link</button>
|
|
| <input class="btn btn-pill btn-primary btn-air-primary" type="button" value="Input" data-bs-toggle="tooltip;" title="btn btn-secondary">
|
|
| <input class="btn btn-pill btn-success btn-air-success" type="submit" value="Submit" data-bs-toggle="tooltip" title="btn btn-success">
|
|
| <button class="btn btn-pill btn-info btn-air-info" type="submit">Button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 outline buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| and
|
|
code .btn-outline-*
|
|
| class for button with outline
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-outline-primary.btn-air-primary(type='button' title='btn btn-pill btn-outline-primary btn-air-primary') Primary Button
|
|
button.btn.btn-pill.btn-outline-secondary.btn-air-secondary(type='button' title='btn btn-pill btn-outline-secondary btn-air-secondary') Secondary Button
|
|
button.btn.btn-pill.btn-outline-success.btn-air-success(type='button' title='btn btn-pill btn-outline-success btn-air-success') Success Button
|
|
button.btn.btn-pill.btn-outline-info.btn-air-info(type='button' title='btn btn-pill btn-outline-info btn-air-info') Info Button
|
|
button.btn.btn-pill.btn-outline-warning.btn-air-warning(type='button' title='btn btn-pill btn-outline-warning btn-air-warning') Warning Button
|
|
button.btn.btn-pill.btn-outline-danger.btn-air-danger(type='button' title='btn btn-pill btn-outline-danger btn-air-danger') Danger Button
|
|
button.btn.btn-pill.btn-outline-light.btn-air-light.txt-dark(type='button' title='btn btn-pill btn-outline-light btn-air-light') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head7', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head7
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-outline-primary btn-air-primary">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-secondary btn-air-secondary">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-success btn-air-success">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-info btn-air-info">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-warning btn-air-warning">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-danger btn-air-danger">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-light btn-air-light txt-dark">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 bold Border outline buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| and
|
|
code .btn-outline-*-2x
|
|
| class for button with bold outline
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-outline-primary-2x.btn-air-primary(type='button' title='btn btn-pill btn-outline-primary-2x btn-air-primary') Primary Button
|
|
button.btn.btn-pill.btn-outline-secondary-2x.btn-air-secondary(type='button' title='btn btn-pill btn-outline-secondary-2x btn-air-secondary') Secondary Button
|
|
button.btn.btn-pill.btn-outline-success-2x.btn-air-success(type='button' title='btn btn-pill btn-outline-success-2x btn-air-success') Success Button
|
|
button.btn.btn-pill.btn-outline-info-2x.btn-air-info(type='button' title='btn btn-pill btn-outline-info-2x btn-air-info') Info Button
|
|
button.btn.btn-pill.btn-outline-warning-2x.btn-air-warning(type='button' title='btn btn-pill btn-outline-warning-2x btn-air-warning') Warning Button
|
|
button.btn.btn-pill.btn-outline-danger-2x.btn-air-danger(type='button' title='btn btn-pill btn-outline-danger-2x btn-air-danger') Danger Button
|
|
button.btn.btn-pill.btn-outline-light-2x.btn-air-light.txt-dark(type='button' title='btn btn-pill btn-outline-light-2x btn-air-light') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head8', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head8
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-outline-primary-2x btn-air-primary">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-secondary-2x btn-air-secondary">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-success-2x btn-air-success">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-info-2x btn-air-info">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-warning-2x btn-air-warning">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-danger-2x btn-air-danger">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-light-2x btn-air-light txt-dark">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 outline Large buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| ,
|
|
code .btn-outline-*
|
|
| and
|
|
code .btn-lg
|
|
| class for large button with outline
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-outline-primary.btn-air-primary.btn-lg(type='button' title='btn btn-pill btn-outline-primary btn-air-primary btn-lg') Primary Button
|
|
button.btn.btn-pill.btn-outline-secondary.btn-air-secondary.btn-lg(type='button' title='btn btn-pill btn-outline-secondary btn-air-secondary btn-lg') Secondary Button
|
|
button.btn.btn-pill.btn-outline-success.btn-air-success.btn-lg(type='button' title='btn btn-pill btn-outline-success btn-air-success btn-lg') Success Button
|
|
button.btn.btn-pill.btn-outline-info.btn-air-info.btn-lg(type='button' title='btn btn-pill btn-outline-info btn-air-info btn-lg') Info Button
|
|
button.btn.btn-pill.btn-outline-warning.btn-air-warning.btn-lg(type='button' title='btn btn-pill btn-outline-warning btn-air-warning btn-lg') Warning Button
|
|
button.btn.btn-pill.btn-outline-danger.btn-air-danger.btn-lg(type='button' title='btn btn-pill btn-outline-danger btn-air-danger btn-lg') Danger Button
|
|
button.btn.btn-pill.btn-outline-light.btn-air-light.btn-lg.txt-dark(type='button' title='btn btn-pill btn-outline-light btn-air-light btn-lg') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head9', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head9
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-outline-primary btn-air-primary btn-lg">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-secondary btn-air-secondary btn-lg">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-success btn-air-success btn-lg">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-info btn-air-info btn-lg">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-warning btn-air-warning btn-lg">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-danger btn-air-danger btn-lg">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-light btn-air-light btn-lg txt-dark">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 outline small buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| ,
|
|
code .btn-outline-*
|
|
| and
|
|
code .btn-sm
|
|
| class for small button with outline
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-outline-primary.btn-air-primary.btn-sm(type='button' title='btn btn-pill btn-outline-primary btn-air-primary btn-sm') Primary Button
|
|
button.btn.btn-pill.btn-outline-secondary.btn-air-secondary.btn-sm(type='button' title='btn btn-pill btn-outline-secondary btn-air-secondary btn-sm') Secondary Button
|
|
button.btn.btn-pill.btn-outline-success.btn-air-success.btn-sm(type='button' title='btn btn-pill btn-outline-success btn-air-success btn-sm') Success Button
|
|
button.btn.btn-pill.btn-outline-info.btn-air-info.btn-sm(type='button' title='btn btn-pill btn-outline-info btn-air-info btn-sm') Info Button
|
|
button.btn.btn-pill.btn-outline-warning.btn-air-warning.btn-sm(type='button' title='btn btn-pill btn-outline-warning btn-air-warning btn-sm') Warning Button
|
|
button.btn.btn-pill.btn-outline-danger.btn-air-danger.btn-sm(type='button' title='btn btn-pill btn-outline-danger btn-air-danger btn-sm') Danger Button
|
|
button.btn.btn-pill.btn-outline-light.btn-air-light.btn-sm.txt-dark(type='button' title='btn btn-pill btn-outline-light btn-air-light btn-sm') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head10', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head10
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-outline-primary btn-air-primary btn-sm">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-secondary btn-air-secondary btn-sm">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-success btn-air-success btn-sm">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-info btn-air-info btn-sm">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-warning btn-air-warning btn-sm">Warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-danger btn-air-danger btn-sm">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-light btn-air-light btn-sm txt-dark">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 outline extra small buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| ,
|
|
code .btn-outline-*
|
|
| and
|
|
code .btn-xs
|
|
| class for extra small button with outline
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-outline-primary.btn-air-primary.btn-xs(type='button' title='btn btn-pill btn-outline-primary btn-air-primary btn-xs') Primary Button
|
|
button.btn.btn-pill.btn-outline-secondary.btn-air-secondary.btn-xs(type='button' title='btn btn-pill btn-outline-secondary btn-air-secondary btn-xs') Secondary Button
|
|
button.btn.btn-pill.btn-outline-success.btn-air-success.btn-xs(type='button' title='btn btn-pill btn-outline-success btn-air-success btn-xs') Success Button
|
|
button.btn.btn-pill.btn-outline-info.btn-air-info.btn-xs(type='button' title='btn btn-pill btn-outline-info btn-air-info btn-xs') Info Button
|
|
button.btn.btn-pill.btn-outline-warning.btn-air-warning.btn-xs(type='button' title='btn btn-pill btn-outline-warning btn-air-warning btn-xs') Warning Button
|
|
button.btn.btn-pill.btn-outline-danger.btn-air-danger.btn-xs(type='button' title='btn btn-pill btn-outline-danger btn-air-danger btn-xs') Danger Button
|
|
button.btn.btn-pill.btn-outline-light.btn-air-light.btn-xs.txt-dark(type='button' title='btn btn-pill btn-outline-light btn-air-light btn-xs') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head11', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head11
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-outline-primary btn-air-primary btn-xs">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-secondary btn-air-secondary btn-xs">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-success btn-air-success btn-xs">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-info btn-air-info btn-xs">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-warning btn-air-warning btn-xs">warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-danger btn-air-danger btn-xs">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-light btn-air-light btn-xs txt-dark">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Disabled outline buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
| Add
|
|
code .disabled
|
|
| class or
|
|
code disabled="disabled"
|
|
| attribute for disabled button
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-outline-primary.btn-air-primary.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-outline-secondary.btn-air-secondary.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-outline-success.btn-air-success.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-outline-info.btn-air-info.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-outline-warning.btn-air-warning.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-outline-danger.btn-air-danger.disabled(type='button') Disabled
|
|
button.btn.btn-pill.btn-outline-light.btn-air-light.disabled.txt-dark(type='button') Disabled
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head12', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head12
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-outline-primary btn-air-primary disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-secondary btn-air-secondary disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-success btn-air-success disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-info btn-air-info disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-warning btn-air-warning disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-danger btn-air-danger disabled">Disabled</button>
|
|
| <button type="button" class="btn btn-pill btn-outline-light btn-air-light disabled txt-dark">Disabled</button>
|
|
| <!-- Cod Box Copy end -->
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Gradien buttons
|
|
.setting-list
|
|
ul.list-unstyled.setting-option
|
|
li
|
|
.setting-primary
|
|
i.icon-settings
|
|
li
|
|
i.view-html.fa.fa-code.font-primary
|
|
li
|
|
i.icofont.icofont-maximize.full-card.font-primary
|
|
li
|
|
i.icofont.icofont-minus.minimize-card.font-primary
|
|
li
|
|
i.icofont.icofont-refresh.reload-card.font-primary
|
|
li
|
|
i.icofont.icofont-error.close-card.font-primary
|
|
span
|
|
code .btn-pill
|
|
| ,
|
|
code .btn-air-*
|
|
| ,
|
|
code .btn-*
|
|
| and
|
|
code .btn-*-gradien
|
|
| class for gradien button
|
|
.card-body.btn-showcase
|
|
button.btn.btn-pill.btn-air-primary.btn-primary-gradien(type='button' title='btn btn-pill btn-air-primary btn-primary-gradien') Primary Button
|
|
button.btn.btn-pill.btn-air-secondary.btn-secondary-gradien(type='button' title='btn btn-pill btn-air-secondary btn-secondary-gradien') Secondary Button
|
|
button.btn.btn-pill.btn-air-success.btn-success-gradien(type='button' title='btn btn-pill btn-air-success btn-success-gradien') Success Button
|
|
button.btn.btn-pill.btn-air-info.btn-info-gradien(type='button' title='btn btn-pill btn-air-info btn-info-gradien') Info Button
|
|
button.btn.btn-pill.btn-air-warning.btn-warning-gradien(type='button' title='btn btn-pill btn-air-warning btn-warning-gradien') Warning Button
|
|
button.btn.btn-pill.btn-air-danger.btn-danger-gradien(type='button' title='btn btn-pill btn-air-danger btn-danger-gradien') Danger Button
|
|
button.btn.btn-pill.btn-air-light.btn-light-gradien.txt-dark(type='button' title='btn btn-pill btn-air-light btn-light-gradien') Light Button
|
|
.code-box-copy
|
|
button.code-box-copy__btn.btn-clipboard(data-clipboard-target='#example-head13', title='Copy')
|
|
i.icofont.icofont-copy-alt
|
|
pre
|
|
code.language-html#example-head13
|
|
| <!-- Cod Box Copy begin -->
|
|
| <button type="button" class="btn btn-pill btn-primary btn-air-primary btn-primary-gradien">Primary button</button>
|
|
| <button type="button" class="btn btn-pill btn-secondary btn-air-secondary btn-secondary-gradien">Secondary button</button>
|
|
| <button type="button" class="btn btn-pill btn-success btn-air-success btn-success-gradien">Success button</button>
|
|
| <button type="button" class="btn btn-pill btn-info btn-air-info btn-info-gradien">Info button</button>
|
|
| <button type="button" class="btn btn-pill btn-warning btn-air-warning btn-warning-gradien">warning button</button>
|
|
| <button type="button" class="btn btn-pill btn-danger btn-air-danger btn-danger-gradien">Danger button</button>
|
|
| <button type="button" class="btn btn-pill btn-light btn-air-light btn-light-gradien txt-dark">Light button</button>
|
|
| <!-- Cod Box Copy end -->
|
|
// Container-fluid Ends
|
|
include ../../components/footer
|
|
include ../../components/footer-files |