angularangular-materialsteppermat-stepper

Angular Material Vertical Stepper | Extend vertical line in last step


Is it possible to extend the vertical line in the last step?

The template script prevents it:

<div class="mat-vertical-content-container" [class.mat-stepper-vertical-line]="!isLast">

This is what it is now in the last step: Current

This is desired: Desired

Thanks for any advice.


Solution

  • In your css:

    ::ng-deep .mat-step:last-child .mat-vertical-content-container {
      border-left: 1px solid rgba(0, 0, 0, 0.12) !important;
    }