feat: add spacing between title and table when title is set (#718)

* feat: add spacing between title and table when title is set

* fix: removed margin prop from table header

Author: jake-bassett

projects/dashboards/src/widgets/header/widget-header.model.ts

@@ -49,10 +49,4 @@ export class WidgetHeaderModel {
     } as ModelModelPropertyTypeInstance
   })
   public link?: LinkWidgetModel;
-
-  @ModelProperty({
-    key: 'top-margin',
-    type: BOOLEAN_PROPERTY.type
-  })
-  public topMargin?: boolean = false;
 }

projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-base.model.ts

@@ -23,14 +23,6 @@ import { TableWidgetControlCheckboxOptionModel } from './table-widget-control-ch
 import { TableWidgetControlSelectOptionModel } from './table-widget-control-select-option.model';
 
 export abstract class TableWidgetBaseModel extends BaseModel {
-  @ModelProperty({
-    key: 'title',
-    displayName: 'Title',
-    type: STRING_PROPERTY.type
-  })
-  // @deprecated
-  public title?: string;
-
   @ModelProperty({
     // tslint:disable-next-line: no-object-literal-type-assertion
     type: {

projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-renderer.component.scss

@@ -2,6 +2,10 @@
 
 .table-content-container {
   @include flex-layout(column);
+
+  &.titled {
+    padding-top: 12px;
+  }
 }
 
 .table {

projects/distributed-tracing/src/shared/dashboard/widgets/table/table-widget-renderer.component.ts

@@ -47,11 +47,12 @@ import { TableWidgetModel } from './table-widget.model';
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: `
     <ht-titled-content
+      class="table-title"
       [title]="this.model.header?.title | htDisplayTitle"
       [link]="this.model.header?.link?.url"
       [linkLabel]="this.model.header?.link?.displayText"
     >
-      <div class="table-content-container">
+      <div class="table-content-container" [class.titled]="this.model.header?.title !== undefined">
         <ht-table-controls
           class="table-controls"
           [searchEnabled]="!!this.api.model.getSearchAttribute()"
@@ -68,7 +69,6 @@ import { TableWidgetModel } from './table-widget.model';
 
         <ht-table
           class="table"
-          [ngClass]="{ 'header-margin': this.model.header?.topMargin }"
           [columnConfigs]="this.columnConfigs$ | async"
           [metadata]="this.metadata$ | async"
           [mode]="this.model.mode"

projects/observability/src/pages/apis/backend-detail/overview/backend-overview.component.ts

@@ -452,8 +452,7 @@ export class BackendOverviewComponent {
         style: TableStyle.Embedded,
         header: {
           type: 'widget-header',
-          title: 'Services',
-          'top-margin': true
+          title: 'Services'
         },
         pageable: false,
         columns: [