65 lines
4.6 KiB
Plaintext
65 lines
4.6 KiB
Plaintext
- var tooltip = 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
|
|
| Tooltip
|
|
ol.breadcrumb
|
|
li.breadcrumb-item
|
|
a(href='index.html')
|
|
| Home
|
|
li.breadcrumb-item Base
|
|
li.breadcrumb-item.active Tooltip
|
|
.col-sm-6
|
|
include ../../components/bookmark
|
|
// Container-fluid starts
|
|
.container-fluid
|
|
.row
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Basic Tooltip
|
|
.card-body.btn-showcase
|
|
button.example-popover.btn.btn-primary(type='button', data-container='body', data-bs-toggle='tooltip', data-bs-placement='top', title='Popover title')
|
|
| Hover Me
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0
|
|
h5 Directions
|
|
.card-body.btn-showcase
|
|
button.btn.btn-primary(type='button', data-bs-toggle='tooltip', data-bs-placement='top', title='Tooltip on top')
|
|
| Tooltip on top
|
|
button.btn.btn-primary(type='button', data-bs-toggle='tooltip', data-bs-placement='right', title='Tooltip on right')
|
|
| Tooltip on right
|
|
button.btn.btn-primary(type='button', data-bs-toggle='tooltip', data-bs-placement='bottom', title='Tooltip on bottom')
|
|
| Tooltip on bottom
|
|
button.btn.btn-primary(type='button', data-bs-toggle='tooltip', data-bs-placement='left', title='Tooltip on left')
|
|
| Tooltip on left
|
|
.col-sm-12
|
|
.card
|
|
.card-header.pb-0
|
|
h5 HTML elements
|
|
.card-body.btn-showcase
|
|
button.btn.btn-primary(type='button', data-bs-toggle='m-tooltip', data-bs-trigger='click', data-bs-placement='top', title="<em>Tooltip</em> <u>with</u> <b>HTML</b>", data-bs-html='true', data-content="And here's some amazing <b>HTML</b> content. It's very <code>engaging</code>. Right?", data-original-title='Tooltip <b>with</b> <code>HTML</code>') Click me
|
|
button.btn.btn-primary(type='button', data-bs-toggle='m-tooltip', data-bs-trigger='click', data-bs-placement='right', title="<em>Tooltip</em> <u>with</u> <b>HTML</b>", data-bs-html='true', data-content="And here's some amazing <b>HTML</b> content. It's very <code>engaging</code>. Right?", data-original-title='Tooltip <b>with</b> <code>HTML</code>') Click me
|
|
button.btn.btn-primary(type='button', data-bs-toggle='m-tooltip', data-bs-trigger='click', data-bs-placement='bottom', title="<em>Tooltip</em> <u>with</u> <b>HTML</b>", data-bs-html='true', data-content="And here's some amazing <b>HTML</b> content. It's very <code>engaging</code>. Right?", data-original-title='Tooltip <b>with</b> <code>HTML</code>') Click me
|
|
button.btn.btn-primary(type='button', data-bs-toggle='m-tooltip', data-bs-trigger='click', data-bs-placement='left', title="<em>Tooltip</em> <u>with</u> <b>HTML</b>", data-bs-html='true', data-content="And here's some amazing <b>HTML</b> content. It's very <code>engaging</code>. Right?", data-original-title='Tooltip <b>with</b> <code>HTML</code>') Click me
|
|
// Container-fluid Ends
|
|
include ../../components/footer
|
|
include ../../components/footer-files
|