This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="btn-toolbar btn-toolbar-success" [appToolbarLegends]="{position: 'right'}" > | |
<i class="fa fa-bitcoin"></i> | |
</div> | |
<div class="toolbar-icons hidden"> | |
<a href="#"><i class="fa fa-bitcoin"></i></a> | |
<a href="#"><i class="fa fa-eur"></i></a> | |
<a href="#"><i class="fa fa-cny"></i></a> | |
</div> | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { | |
Component, | |
ElementRef, | |
OnInit, | |
ViewChild, | |
Input, | |
Renderer2, | |
ChangeDetectionStrategy, | |
NgZone | |
} from '@angular/core'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<app-toolbar-legends class="btn-toolbar-success" icon="fa-bitcoin" [toolbarConfig]="{position: 'right'}"> | |
<div class="toolbar-icons hidden"> | |
<a href="#"><i class="fa fa-bitcoin"></i></a> | |
<a href="#"><i class="fa fa-eur"></i></a> | |
<a href="#"><i class="fa fa-cny"></i></a> | |
</div> | |
</app-toolbar-legends> | |
<app-toolbar-legends class="btn-toolbar-dark" icon="fa-apple" [toolbarConfig]="{position: 'right', style: 'primary', animation: 'flip'}"> | |
<div class="toolbar-icons hidden"> | |
<a href="#"><i class="fa fa-android"></i></a> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@ViewChild('el', { read: ElementRef }) el: ElementRef; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { | |
Component, | |
ElementRef, | |
OnInit, | |
ViewChild | |
} from '@angular/core'; | |
declare const $: any; | |
@Component({ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<app-toolbar-men> | |
<div id="toolbar-men-options" class="hidden"> | |
<a href="#"><i class="fa fa-heart"></i></a> | |
<a href="#"><i class="fa fa-heart-o"></i></a> | |
<a href="#"><i class="fa fa-heartbeat"></i></a> | |
</div> | |
</app-toolbar-men> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<app-toolbar-men> | |
<div id="toolbar-men-options" class="hidden"> | |
<a href="#"><i class="fa fa-heart"></i></a> | |
<a href="#"><i class="fa fa-heart-o"></i></a> | |
<a href="#"><i class="fa fa-heartbeat"></i></a> | |
</div> | |
</app-toolbar-men> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// boys.directive.ts | |
import { Directive, ElementRef } from '@angular/core'; | |
declare const $: any; | |
@Directive({ | |
selector: '[appToolbarBoys]' | |
}) | |
export class BoysDirective { | |
constructor(private el: ElementRef) { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- Actual toolbar --> | |
<div id="toolbar-boys-options" class="hidden"> | |
<a href="#"><i class="fa fa-plane"></i></a> | |
<a href="#"><i class="fa fa-car"></i></a> | |
<a href="#"><i class="fa fa-bicycle"></i></a> | |
</div> | |
<!-- Invoking the toolbar --> | |
<div appToolbarBoys class="btn-toolbar"><i class="fa fa-cog"></i></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
$('#toolbarBtn').toolbar({ | |
content: '#toolbar', | |
position: 'top' | |
}); |
NewerOlder