src/widgets/control-sidebar/control-sidebar.component.ts
| selector | app-control-sidebar |
| styleUrls | control-sidebar.component.css |
| templateUrl | ./control-sidebar.component.html |
constructor(_sidebar: ControlSidebarService)
|
||||||||
|
Parameters :
|
import { Component, Input } from '@angular/core';
import { ControlSidebarService } from '../../services/control-sidebar.service';
@Component( {
selector: 'app-control-sidebar',
styleUrls: ['./control-sidebar.component.css'],
templateUrl: './control-sidebar.component.html'
})
export class ControlSidebarComponent {
constructor( private _sidebar: ControlSidebarService) { }
}
<!-- Control Sidebar -->
<aside [ngClass]="{
'control-sidebar': true,
'control-sidebar-dark': true,
'control-sidebar-open': _sidebar.getCurrent() | async
}" >
<!-- Create the tabs -->
<ul class="nav nav-tabs nav-justified control-sidebar-tabs">
<li class="active"><a href="#control-sidebar-home-tab"
data-toggle="tab"><i class="fa fa-home"></i></a></li>
<li><a href="#control-sidebar-settings-tab" data-toggle="tab"><i
class="fa fa-gears"></i></a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<!-- Home tab content -->
<div class="tab-pane active" id="control-sidebar-home-tab">
<h3 class="control-sidebar-heading">Recent Activity</h3>
<ul class="control-sidebar-menu">
<li><a href="javascript::;"> <i
class="menu-icon fa fa-birthday-cake bg-red"></i>
<div class="menu-info">
<h4 class="control-sidebar-subheading">Langdon's Birthday</h4>
<p>Will be 23 on April 24th</p>
</div>
</a></li>
</ul>
<!-- /.control-sidebar-menu -->
<h3 class="control-sidebar-heading">Tasks Progress</h3>
<ul class="control-sidebar-menu">
<li><a href="javascript::;">
<h4 class="control-sidebar-subheading">
Custom Template Design <span
class="label label-danger pull-right">70%</span>
</h4>
<div class="progress progress-xxs">
<div class="progress-bar progress-bar-danger" style="width: 70%"></div>
</div>
</a></li>
</ul>
<!-- /.control-sidebar-menu -->
</div>
<!-- /.tab-pane -->
<!-- Stats tab content -->
<div class="tab-pane" id="control-sidebar-stats-tab">Stats Tab
Content</div>
<!-- /.tab-pane -->
<!-- Settings tab content -->
<div class="tab-pane" id="control-sidebar-settings-tab">
<form method="post">
<h3 class="control-sidebar-heading">General Settings</h3>
<div class="form-group">
<label class="control-sidebar-subheading"> Report panel
usage <input type="checkbox" class="pull-right" checked>
</label>
<p>Some information about this general settings option</p>
</div>
<!-- /.form-group -->
</form>
</div>
<!-- /.tab-pane -->
</div>
</aside>
<!-- /.control-sidebar -->
<!-- Add the sidebar's background. This div must be placed
immediately after the control sidebar -->
<div class="control-sidebar-bg"></div>