mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-04-27 02:23:10 +00:00
101 lines
3.3 KiB
HTML
101 lines
3.3 KiB
HTML
<div id="main" [ngClass]="{'boxed':fuseConfig.layout.width === 'boxed'}">
|
|
|
|
<!-- TOOLBAR: Above -->
|
|
<ng-container *ngIf="fuseConfig.layout.toolbar.position === 'above'">
|
|
<ng-container *ngTemplateOutlet="toolbar"></ng-container>
|
|
</ng-container>
|
|
<!-- / TOOLBAR: Above -->
|
|
|
|
<!-- NAVBAR: Top -->
|
|
<ng-container>
|
|
<ng-container *ngTemplateOutlet="topNavbar"></ng-container>
|
|
</ng-container>
|
|
<!-- / NAVBAR: Top -->
|
|
|
|
<!-- TOOLBAR: Below -->
|
|
<ng-container *ngIf="fuseConfig.layout.toolbar.position === 'below'">
|
|
<ng-container *ngTemplateOutlet="toolbar"></ng-container>
|
|
</ng-container>
|
|
<!-- / TOOLBAR: Below -->
|
|
|
|
<div id="container-1" class="container">
|
|
|
|
<!-- NAVBAR: Left -->
|
|
<ng-container>
|
|
<ng-container *ngTemplateOutlet="leftNavbar"></ng-container>
|
|
</ng-container>
|
|
<!-- / NAVBAR: Left -->
|
|
|
|
<div id="container-2" class="container">
|
|
|
|
<div id="container-3" class="container" fusePerfectScrollbar
|
|
[fusePerfectScrollbarOptions]="{suppressScrollX: true, updateOnRouteChange : true}">
|
|
|
|
<!-- CONTENT -->
|
|
<content></content>
|
|
<!-- / CONTENT -->
|
|
|
|
<!-- FOOTER: Below -->
|
|
<ng-container *ngIf="fuseConfig.layout.footer.position === 'above-static'">
|
|
<ng-container *ngTemplateOutlet="footer"></ng-container>
|
|
</ng-container>
|
|
<!-- / FOOTER: Below -->
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- FOOTER: Above -->
|
|
<ng-container *ngIf="fuseConfig.layout.footer.position === 'above-fixed'">
|
|
<ng-container *ngTemplateOutlet="footer"></ng-container>
|
|
</ng-container>
|
|
<!-- FOOTER: Above -->
|
|
|
|
</div>
|
|
|
|
<!-- QUICK PANEL -->
|
|
<fuse-sidebar name="quickPanel" position="right" class="quick-panel">
|
|
<quick-panel></quick-panel>
|
|
</fuse-sidebar>
|
|
<!-- / QUICK PANEL -->
|
|
|
|
<!-- ----------------------------------------------------------------------------------------------------- -->
|
|
<!-- @ PARTIALS
|
|
<!-- ----------------------------------------------------------------------------------------------------- -->
|
|
|
|
<!-- TOOLBAR -->
|
|
<ng-template #toolbar>
|
|
<toolbar *ngIf="!fuseConfig.layout.toolbar.hidden"
|
|
[ngClass]="[fuseConfig.layout.toolbar.position, fuseConfig.layout.toolbar.background]"></toolbar>
|
|
</ng-template>
|
|
<!-- / TOOLBAR -->
|
|
|
|
<!-- FOOTER -->
|
|
<ng-template #footer>
|
|
<footer *ngIf="!fuseConfig.layout.footer.hidden"
|
|
[ngClass]="[fuseConfig.layout.footer.position, fuseConfig.layout.footer.background]"></footer>
|
|
</ng-template>
|
|
<!-- / FOOTER -->
|
|
|
|
<!-- TOP NAVBAR -->
|
|
<ng-template #topNavbar>
|
|
<navbar layout="horizontal"
|
|
class="top-navbar" [ngClass]="fuseConfig.layout.navbar.background"
|
|
fxHide fxShow.gt-md
|
|
*ngIf="!fuseConfig.layout.navbar.hidden">
|
|
</navbar>
|
|
</ng-template>
|
|
<!-- / TOP NAVBAR -->
|
|
|
|
<!-- LEFT NAVBAR -->
|
|
<ng-template #leftNavbar>
|
|
<fuse-sidebar name="navbar"
|
|
[folded]="fuseConfig.layout.navbar.folded"
|
|
*ngIf="!fuseConfig.layout.navbar.hidden">
|
|
<navbar class="left-navbar" [ngClass]="fuseConfig.layout.navbar.background" layout="vertical"></navbar>
|
|
</fuse-sidebar>
|
|
</ng-template>
|
|
<!-- / LEFT NAVBAR -->
|