[editor] Add export-mode ui element via extra menu

projects/editor/src/app/components/unit-view/unit-view.component.css

@@ -62,7 +62,7 @@ aspect-page-canvas {
   pointer-events: auto;
 }
 
-/* History-button tab label */
-:host ::ng-deep .mat-mdc-tab-labels>div:last-child {
+/* Align menu buttons to right side. */
+:host ::ng-deep .mat-mdc-tab-labels>div:nth-last-child(2) {
   margin-left: auto !important;
 }

projects/editor/src/app/components/unit-view/unit-view.component.html

@@ -74,7 +74,7 @@
 <!--          </ng-template>-->
 <!--        </mat-tab>-->
 
-        <mat-tab disabled>
+        <mat-tab disabled class="align-right">
           <ng-template mat-tab-label>
             <button mat-icon-button [matMenuTriggerFor]="numberingMenu">
               <mat-icon>format_list_numbered</mat-icon>
@@ -92,6 +92,21 @@
             </mat-menu>
           </ng-template>
         </mat-tab>
+        <mat-tab disabled class="align-right">
+          <ng-template mat-tab-label>
+            <button mat-icon-button [matMenuTriggerFor]="extrasMenu">
+              <mat-icon>menu</mat-icon>
+            </button>
+            <mat-menu #extrasMenu="matMenu" (click)="$event.stopPropagation()">
+              <div [style.padding]="'0 20px 10px'" (click)="$event.stopPropagation()">
+                <h3>erweiterte Ansicht</h3>
+                <mat-checkbox [ngModel]="unitService.expertMode" (change)="setExpertMode($event)">
+                  Expertenmodus aktivieren
+                </mat-checkbox>
+              </div>
+            </mat-menu>
+          </ng-template>
+        </mat-tab>
 
       </mat-tab-group>
     </mat-drawer-content>

projects/editor/src/app/components/unit-view/unit-view.component.ts

@@ -44,4 +44,8 @@ export class UnitViewComponent {
   setSectionNumberingPosition(event: MatCheckboxChange) {
     this.unitService.setSectionNumberingPosition(event.checked ? 'above' : 'left');
   }
+
+  setExpertMode(event: MatCheckboxChange) {
+    this.unitService.setSectionExpertMode(event.checked);
+  }
 }

projects/editor/src/app/services/unit-services/unit.service.ts

@@ -33,6 +33,7 @@ export class UnitService {
   sectionCountUpdated: Subject<void> = new Subject<void>();
   referenceManager: ReferenceManager;
   savedSectionCode: string | undefined;
+  expertMode: boolean = false;
 
   constructor(private selectionService: SelectionService,
               private veronaApiService: VeronaAPIService,
@@ -229,4 +230,8 @@ export class UnitService {
   getSelectedPage() {
     return this.unit.pages[this.selectionService.selectedPageIndex];
   }
+
+  setSectionExpertMode(checked: boolean) {
+    this.expertMode = checked;
+  }
 }