Blacked and isorted the python files

Prettied and eslinted the typescript/html files

bookie/src/app/roles/role-detail/role-detail.component.html

@@ -5,19 +5,31 @@
     </mat-card-title-group>
     <mat-card-content>
       <form [formGroup]="form" fxLayout="column">
-        <div fxLayout="row" fxLayoutAlign="space-around start" fxLayout.lt-md="column" fxLayoutGap="20px"
-             fxLayoutGap.lt-md="0px">
+        <div
+          fxLayout="row"
+          fxLayoutAlign="space-around start"
+          fxLayout.lt-md="column"
+          fxLayoutGap="20px"
+          fxLayoutGap.lt-md="0px"
+        >
           <mat-form-field fxFlex>
             <mat-label>Name</mat-label>
-            <input matInput #nameElement placeholder="Name" formControlName="name">
+            <input matInput #nameElement placeholder="Name" formControlName="name" />
           </mat-form-field>
         </div>
         <mat-divider></mat-divider>
         <div formArrayName="permissions">
-          <div fxLayout="row" *ngFor="let p of item.permissions; index as i" [formGroupName]="i" fxLayout="row"
-               fxLayoutAlign="space-around start" fxLayout.lt-md="column" fxLayoutGap="20px"
-               fxLayoutGap.lt-md="0px">
-            <mat-checkbox formControlName="permission" fxFlex>{{p.name}}</mat-checkbox>
+          <div
+            fxLayout="row"
+            *ngFor="let p of item.permissions; index as i"
+            [formGroupName]="i"
+            fxLayout="row"
+            fxLayoutAlign="space-around start"
+            fxLayout.lt-md="column"
+            fxLayoutGap="20px"
+            fxLayoutGap.lt-md="0px"
+          >
+            <mat-checkbox formControlName="permission" fxFlex>{{ p.name }}</mat-checkbox>
           </div>
         </div>
       </form>