progress-stepper/src/progress-stepper-page-layout/progress-stepper-page-layout.component.ts
Progress Stepper Page Layout is a pre-built layout component that provides a full-page layout for Progress Stepper. It is typically used in an Overlay context. It implements Workspace Simple (horizontal layout) and Content Layout (vertical layout) with projection slots for a Workspace Header and a sticky Progress Stepper Footer Additionally it provides a sticky Progress Stepper Header.
This layout component acts as a wrapper for Progress Stepper's sections. Here's a breakdown of the layout structure.
Example :<talenra-progress-stepper-page-layout>
<talenra-workspace-header />
<talenra-progress-stepper-body>
<talenra-progress-stepper-banner>...</talenra-progress-stepper-banner>
<talenra-progress-step>...</talenra-progress-step>
<talenra-progress-step>...</talenra-progress-step>
<talenra-progress-step>...</talenra-progress-step>
</talenra-progress-stepper-body>
<talenra-progress-stepper-footer>...</talenra-progress-stepper-footer>
</talenra-progress-stepper-page-layout>See ProgressStepperBodyComponent See OverlayService
| changeDetection | ChangeDetectionStrategy.OnPush |
| host | { |
| providers |
contentLayoutServiceFactory
|
| selector | talenra-progress-stepper-page-layout |
| imports |
WorkspaceSimpleComponent
ProgressStepperHeaderComponent
|
| templateUrl | ./progress-stepper-page-layout.component.html |
| styleUrl | ./progress-stepper-page-layout.component.scss |
Inputs |
| workspaceWidth |
Type : TWorkspaceWidth
|
Default value : WorkspaceWidth.L
|
|
Determines the width of the layout. Defaults to See WorkspaceWidth |