fixed router outlet in sidenav

subscription settings implemented

src/app/app.component.html

@@ -10,29 +10,22 @@
                     <div>{{topBarTitle}}</div>
                 </div>
                 <div class="flex-column" style="text-align: right; align-items: flex-end;">
-                    <button *ngIf="allowThemeChange" mat-icon-button (click)="flipTheme()"><mat-icon>{{(postsService.theme.key === 'default') ? 'brightness_5' : 'brightness_2'}}</mat-icon></button>
+                    <button [matMenuTriggerFor]="menuSettings" mat-icon-button><mat-icon>more_vert</mat-icon></button>
+                    <mat-menu #menuSettings="matMenu">
+                        <button (click)="$event.stopPropagation();" *ngIf="allowThemeChange" mat-menu-item>
+                          <mat-icon>{{(postsService.theme.key === 'default') ? 'brightness_5' : 'brightness_2'}}</mat-icon>
+                          <span>Dark</span>
+                          <mat-slide-toggle class="theme-slide-toggle" [checked]="postsService.theme.key === 'dark'" (change)="flipTheme()"></mat-slide-toggle>
+                        </button>
+                        <button (click)="openSettingsDialog()" mat-menu-item>
+                          <mat-icon>settings</mat-icon>
+                          <span>Settings</span>
+                        </button>
+                    </mat-menu>
                 </div>
             </div>
-            <div class="flex-column" style="text-align: center; margin-top: 5px;">
-                <div>{{topBarTitle}}</div>
-            </div>
-            <div class="flex-column" style="text-align: right; align-items: flex-end;">
-                <button [matMenuTriggerFor]="menuSettings" mat-icon-button><mat-icon>more_vert</mat-icon></button>
-                <mat-menu #menuSettings="matMenu">
-                    <button (click)="$event.stopPropagation();" *ngIf="allowThemeChange" mat-menu-item>
-                      <mat-icon>{{(postsService.theme.key === 'default') ? 'brightness_5' : 'brightness_2'}}</mat-icon>
-                      <span>Dark</span>
-                      <mat-slide-toggle class="theme-slide-toggle" [checked]="postsService.theme.key === 'dark'" (change)="flipTheme()"></mat-slide-toggle>
-                    </button>
-                    <button (click)="openSettingsDialog()" mat-menu-item>
-                      <mat-icon>settings</mat-icon>
-                      <span>Settings</span>
-                    </button>
-                </mat-menu>
-            </div>
-        </div>
-    </mat-toolbar>
-
+        </mat-toolbar>
+    </div>
     <div style="height: calc(100% - 64px)">
         <mat-sidenav-container style="height: 100%">
             <mat-sidenav #sidenav>

src/app/settings/settings.component.html

@@ -159,6 +159,37 @@
     </div>
 </mat-expansion-panel>
 
+<!-- Subscriptions -->
+<mat-expansion-panel class="settings-expansion-panel">
+    <mat-expansion-panel-header>
+        <mat-panel-title>
+            Subscriptions
+        </mat-panel-title>
+    </mat-expansion-panel-header>
+    <div *ngIf="new_config" class="container-fluid">
+        <div class="row">
+            <div class="col-12">
+                <mat-checkbox [(ngModel)]="new_config['Subscriptions']['allow_subscriptions']">Allow subscriptions</mat-checkbox>
+            </div>
+            <div class="col-12">
+                <mat-form-field>
+                    <input [disabled]="!new_config['Subscriptions']['allow_subscriptions']" [(ngModel)]="new_config['Subscriptions']['subscriptions_base_path']" matInput placeholder="Subscriptions base path">
+                    <mat-hint></mat-hint>
+                </mat-form-field>
+            </div>
+            <div class="col-12">
+                <mat-form-field>
+                    <input [disabled]="!new_config['Subscriptions']['allow_subscriptions']" [(ngModel)]="new_config['Subscriptions']['subscriptions_check_interval']" matInput placeholder="Check interval">
+                    <mat-hint></mat-hint>
+                </mat-form-field>
+            </div>
+            <div class="col-12">
+                <mat-checkbox [disabled]="!new_config['Subscriptions']['allow_subscriptions']" [(ngModel)]="new_config['Subscriptions']['subscriptions_use_youtubedl_archive']">Use youtube-dl archive</mat-checkbox>
+            </div>
+        </div>
+    </div>
+</mat-expansion-panel>
+
 <!-- Advanced -->
 <mat-expansion-panel class="settings-expansion-panel">
     <mat-expansion-panel-header>