the only question remotely close to mine I have found is this one. I want to make a custom stepper with the tabs / navigation in a different div then the content for design purposes.
I would have a stepper like this
<app-main-title title="VPN"></app-main-title>
<div class="stepper-container">
<div class="stepper-wrapper">
<mat-horizontal-stepper class="mat-horizontal-content-container">
<mat-step
label="{{ 'Creating' }}">
</mat-step>
<mat-step
label="{{ 'Installing' }}">
</mat-step>
<mat-step
label="{{ 'Connecting' }}">
</mat-step>
</mat-horizontal-stepper>
</div>
</div>
<div class="main-content-container">
<p>CONTENT SHOULD BE DISPLAYED HERE/p>
</div>
How would I go about this? The closest thing I've found to what I want is using a router store and list-items, but I'd like to use the functionality built-in the material stepper.