How to move Mat expansion indication?

Question

Is it possible to move the mat expansion indicator (Angular, Material Design) to set it before the title ?

No informations about that on material documentation https://material.angular.io/components/expansion/overview

Thank you :)

Answer 1

you can always override default style.

.mat-expansion-panel-header {
  flex-direction: row-reverse;

  .mat-content {
    padding-left: 12px;
  }
}

Answer 2

You can easily do this with the following code!

<mat-accordion>
        <mat-expansion-panel [togglePosition]="'before'">
          <mat-expansion-panel-header >
            <mat-panel-title>

            </mat-panel-title>

          </mat-expansion-panel-header>

        </mat-expansion-panel>
</mat-accordion>

Just add [togglePosition]=" 'before' "