diff --git a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.html b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.html index 9d3ecfa643..1048df034d 100644 --- a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.html +++ b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.html @@ -7,7 +7,11 @@ class="adf-cloud-form-container adf-cloud-form-{{ displayConfiguration?.options?.fullscreen ? 'fullscreen' : 'inline' }}-container" [style]="formStyle" > -
+
@@ -38,6 +42,7 @@ appearance="outlined" class="adf-cloud-form-content-card" [class.adf-cloud-form-content-card-fullscreen]="displayMode === 'fullScreen'" + [class.adf-cloud-form-content-card-fullscreen-toolbar]="displayMode === 'fullScreen' && displayConfiguration?.options?.displayToolbar" >
diff --git a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.scss b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.scss index a053078df4..6d0ce96e3a 100644 --- a/lib/process-services-cloud/src/lib/form/components/form-cloud.component.scss +++ b/lib/process-services-cloud/src/lib/form/components/form-cloud.component.scss @@ -10,7 +10,14 @@ } .adf-cloud-form { + &-content-standalone-fullscreen { + background-color: transparent; + border-radius: 14px; + } + &-container { + border-radius: 14px; + .adf-cloud-form-content { @extend .adf-full-screen; @@ -22,11 +29,22 @@ } &-fullscreen-container { + position: fixed; + top: 0; + left: 0; + z-index: 100000; + background-color: var(--adf-theme-mat-grey-color-a400); + display: block; + height: 100%; + width: 100vw; + overflow-y: auto; + border-radius: 0 0 14px; + .adf-cloud-form-content { - position: fixed; - top: 0; - left: 0; - z-index: 100000; + width: calc(100% - 80px); + max-width: 1366px; + height: auto; + margin: 40px auto; } } @@ -34,9 +52,10 @@ @extend .adf-full-screen; } - &-toolbar { + &-toolbar ::ng-deep { #{ms.$mat-toolbar} { background-color: var(--adf-theme-background-card-color-087); + border-radius: 14px 14px 0 0; } } @@ -72,6 +91,7 @@ overflow-y: auto; position: static; height: 70%; + border-radius: 14px; &-fullscreen { padding: 0; @@ -79,6 +99,10 @@ width: 100%; position: relative; + &-toolbar { + border-radius: 0 0 14px 14px; + } + &-container { display: flex; flex-direction: column;