mirror of
https://github.com/akveo/ngx-admin.git
synced 2025-12-16 15:40:11 +01:00
37 lines
2 KiB
HTML
37 lines
2 KiB
HTML
<div class="row">
|
|
<div class="col-md-12 col-lg-6 col-xxxl-4">
|
|
<nb-card>
|
|
<nb-card-header>Tooltip With Icon</nb-card-header>
|
|
<nb-card-body>
|
|
<button nbTooltip="This is a tooltip" nbTooltipIcon="home-outline" nbButton matRipple>Show Tooltip</button>
|
|
<button nbTooltip="" nbTooltipIcon="alert-triangle" nbTooltipStatus="danger" nbButton matRipple>Show Tooltip</button>
|
|
</nb-card-body>
|
|
</nb-card>
|
|
</div>
|
|
|
|
<div class="col-md-12 col-lg-6 col-xxxl-4">
|
|
<nb-card>
|
|
<nb-card-header>Tooltip Placements</nb-card-header>
|
|
<nb-card-body>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="top" nbButton matRipple>Top</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="right" nbButton matRipple>Right</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="bottom" nbButton matRipple>Bottom</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="left" nbButton matRipple>Left</button>
|
|
</nb-card-body>
|
|
</nb-card>
|
|
</div>
|
|
|
|
<div class="col-md-12 col-lg-6 col-xxxl-4">
|
|
<nb-card>
|
|
<nb-card-header>Colored Tooltips</nb-card-header>
|
|
<nb-card-body>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="top" nbButton matRipple>Default</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="top" nbTooltipStatus="primary" nbButton matRipple>Primary</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="top" nbTooltipStatus="success" nbButton matRipple>Success</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="top" nbTooltipStatus="danger" nbButton matRipple>Danger</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="top" nbTooltipStatus="info" nbButton matRipple>Info</button>
|
|
<button nbTooltip="This is a tooltip" nbTooltipPlacement="top" nbTooltipStatus="warning" nbButton matRipple>Warning</button>
|
|
</nb-card-body>
|
|
</nb-card>
|
|
</div>
|
|
</div>
|