Layouts

Search…

Layouts

Drift Angular has lots of layout that fullfill your requirements to develop a Amaizing App.
There are following layouts which Drift Angular provides:
Default Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/default-layout/default-layout.module#DefaultLayoutModule'
SAAS Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/saas-layout/saas-layout.module#SaasLayoutModule'
Listing Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/listing-layout/listing-layout.module#ListingLayoutModule'
Intranet Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/intranet-layout/intranet-layout.module#IntranetLayoutModule'
Back Office Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/back-office-layout/back-office-layout.module#BackOfficeLayoutModule'
Back Office Minimal Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/back-office-mini-layout/back-office-mini-layout.module#BackOfficeMiniLayoutModule'
Modern Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/modern-layout/modern-layout.module#ModernLayoutModule'
CRM Layout
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/default-layout/crm-layout.module#CrmLayoutModule'
Common Layouts
There are two common layouts for authentication and frontend pages.
Auth Layout
Auth layout will use to authenticate user. Here user can signup and sign-in.
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/auth-layout/auth.module#AuthModule'
and add AuthGuard to other reoutes to stop access without sign-in.
canActivate: [AuthGuard]
Frontend Layout
Frontend layout will use to for frontent pages in Drift Angular.
To use this layout add following route in src/app/app-routing.module.ts file:
loadChildren: './layouts/frontend-layout/frontend-layout.module#FrontendLayoutModule'

Structure - Previous

Folders and Files Structure

Next - Structure

Drift Icons

Last modified 2yr ago

Copy link

Outline

Default Layout

SAAS Layout

Listing Layout

Intranet Layout

Back Office Layout

Back Office Minimal Layout

Modern Layout

CRM Layout

Common Layouts