fix(angular-material): added padding on "mat cards"

JBBianchi · Dec 19, 2023 · 19af601 · 19af601
1 parent 6ec6c9d
commit 19af601
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 2 deletions.
diff --git a/packages/angular-material/src/layouts/array-layout.renderer.ts b/packages/angular-material/src/layouts/array-layout.renderer.ts
@@ -90,7 +90,7 @@ import {
           first as first
         "
       >
-        <mat-card appearance="outlined">
+        <mat-card class="array-item" appearance="outlined">
           <mat-card-content>
             <jsonforms-outlet [renderProps]="getProps(idx)"></jsonforms-outlet>
           </mat-card-content>
@@ -154,6 +154,9 @@ import {
       .array-layout-toolbar > span {
         flex: 1 1 auto;
       }
+      .array-item {
+        padding: 16px;
+      }
       ::ng-deep .error-message-tooltip {
         white-space: pre-line;
       }

diff --git a/packages/angular-material/src/layouts/group-layout.renderer.ts b/packages/angular-material/src/layouts/group-layout.renderer.ts
@@ -56,6 +56,7 @@ import { JsonFormsAngularService } from '@jsonforms/angular';
         display: flex;
         flex-direction: column;
         gap: 16px;
+        padding: 16px;
       }
       .group-layout > div {
         flex: 1 1 auto;

diff --git a/packages/angular-material/src/other/object.renderer.ts b/packages/angular-material/src/other/object.renderer.ts
@@ -45,7 +45,7 @@ import { cloneDeep } from 'lodash';
 @Component({
   selector: 'ObjectRenderer',
   template: `
-    <mat-card appearance="outlined">
+    <mat-card class="object-layout" appearance="outlined">
       <jsonforms-outlet
         [uischema]="detailUiSchema"
         [schema]="scopedSchema"
@@ -54,6 +54,13 @@ import { cloneDeep } from 'lodash';
       </jsonforms-outlet>
     </mat-card>
   `,
+  styles: [
+    `
+      .object-layout {
+        padding: 16px;
+      }
+    `,
+  ],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class ObjectControlRenderer extends JsonFormsControlWithDetail {