Scanner Styling and Login Dialog

apps/adapter/scan/src/lib/scandit/scandit-overlay.component.css

@@ -5,7 +5,11 @@
 .scanner-container {
   width: 100vw;
   max-width: 95vw;
-  max-height: 95vh;
+  max-height: calc(95vh - 120px);
+}
+
+.close-scanner {
+  @apply block px-6 py-4 bg-white text-brand border-2 border-solid border-brand rounded-full text-lg font-bold mx-auto mt-4;
 }
 
 @screen desktop {
@@ -14,9 +18,3 @@
     max-height: 900px;
   }
 }
-
-.close-scanner {
-  @apply absolute bottom-4 z-popover px-6 py-4 bg-brand text-white rounded-full text-lg font-bold;
-  left: 50%;
-  transform: translateX(-50%);
-}

apps/isa-app/src/app/guards/is-authenticated.guard.ts

@@ -3,7 +3,7 @@ import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angul
 import { AuthService } from '@core/auth';
 import { ScanAdapterService } from '@adapter/scan';
 import { AuthService as IsaAuthService } from '@swagger/isa';
-import { UiErrorModalComponent, UiModalService } from '@ui/modal';
+import { UiConfirmModalComponent, UiErrorModalComponent, UiModalService } from '@ui/modal';
 import { DeviceDetectorService } from 'ngx-device-detector';
 
 @Injectable({ providedIn: 'root' })
@@ -36,6 +36,22 @@ export class IsAuthenticatedGuard implements CanActivate {
       return undefined;
     }
 
+    const loginModal = this._modal.open({
+      content: UiConfirmModalComponent,
+      title: 'Anmeldung',
+      data: {
+        message: 'Bitte wählen Sie die Anmeldeoption aus.',
+        rejectLabel: 'Anmeldung mit Logindaten',
+        confirmLabel: 'Anmeldung mit Keycard',
+      },
+    });
+
+    const loginModalResult = await loginModal.afterClosed$.toPromise();
+
+    if (!loginModalResult.data) {
+      return undefined;
+    }
+
     const result = await this._scanService
       .scan({
         exclude: ['Dev', 'Native'],

apps/ui/modal/src/lib/confirm-modal/confirm-modal.component.scss

@@ -7,7 +7,7 @@
 }
 
 .actions {
-  @apply text-right;
+  @apply text-center;
 
   button {
     @apply mx-2;