Actions overview

NbActionsComponent

Shows a horizontal list of actions, available in multiple sizes. Aligns items vertically.

Basic actions setup:

<nb-actions size="small">
  <nb-action icon="nb-search"></nb-action>
  <nb-action icon="nb-power-circled"></nb-action>
  <nb-action icon="nb-person"></nb-action>
</nb-actions>

Installation

Import NbActionsModule to your feature module.

@NgModule({
  imports: [
    // ...
    NbActionsModule,
  ],
})
export class PageModule { }

Usage

Multiple sizes example:

It is also possible to specify a badge value:

and we can set it to full a width of a parent component

Action dot mode

NbActionComponent

Action item, display a link with an icon, or any other content provided instead.