Pages UI
v5.0.1 - Pages Angular
v5.0.1 - Pages Angular
  • Getting Started
  • Layouts
  • Routing
  • Styles
  • Layout Components
    • Header
    • Menu Items
    • Sidebar
    • Horizontal Menu
    • Secondary Sidebar
    • Quick View
    • Overlay Search
  • Directives
    • Parallax
    • Retina Image
  • Bootstrap Components
  • Forms
    • Checkbox and Radio
    • Form Group
    • Input Helpers
    • Switch Toggle
    • Select
    • Select FX
    • Typeahead
    • Date Picker
    • Time Picker
    • Quill Editor
    • File Uploader
  • UI Components
    • Progress Bar
    • List View
    • Cards
    • Social Cards
    • Collapse
    • Tabs
    • Tree View
    • Sliders
    • Notifications
  • Tables / Datatables
  • Maps
  • Session and other pages
  • Service
  • Dashboards
  • Widgets
  • Charts
  • Change log
Powered by GitBook
On this page

Session and other pages

Pages ship with a few session pages like login, register, & lock screen.

PreviousMapsNextDashboards

Last updated 6 years ago

Session pages are found under the module sessionModule which can be located in src/app/session folder. There is no assigned from these components. Each page / session page is from the router.

app.routing.ts
import { Routes } from '@angular/router';
//Layouts
import { 
  CondensedComponent,
  BlankComponent,
} from './@pages/layouts';

export const AppRoutes: Routes = [

  {
    path: '',
    //Your root layout
    component: BlankComponent,
    children: [{
      path: 'session',
      loadChildren: './session/session.module#SessionModule'
    }]
  }
];

In the sample router note that BlankComponent is imported from @pages - located in the folder @pages/layouts. And this import is used in the component:BlankComponent of the sample code above. Note that in BlankComponent we have only loaded styles relevantly needed for that module. You can see it in @pages/layouts/blank/blank.component.scss

Can we used the condensedLayout for sessionModules / Session Pages

Yes you can, make sure you have imported CondensedLayout from

import { CondensedComponent} from './@pages/layouts';

Then you need to make sure the styles are imported to your @pages/layouts/condensed/condensed.component.scss

Styles that are required for Session Pages

//Login
@import "modules/login.scss";

//Lock screen
@import "modules/lock_screen.scss";

//Error
@import "modules/_error.scss";

You can try this with any layout you like in @pages/layouts

root component / Layout
layout
assigned