diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/alert/properties/alert-properties/alert-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/alert/properties/alert-properties/alert-properties.component.html
index 31d0e1f21..c9428e218 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/alert/properties/alert-properties/alert-properties.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/alert/properties/alert-properties/alert-properties.component.html
@@ -1,4 +1,9 @@
-<dxc-heading [level]="4" weight="normal" text="Properties" [margin]="{bottom:'small'}"></dxc-heading>
+<dxc-heading
+  [level]="4"
+  weight="normal"
+  text="Properties"
+  [margin]="{ bottom: 'small' }"
+></dxc-heading>
 <dxc-table>
   <tr>
     <th>Name</th>
@@ -6,14 +11,14 @@
     <th>Description</th>
   </tr>
   <tr>
-    <td>type: string ('info' | 'confirm' | 'warning' | 'error')</td>
+    <td>type: 'info' | 'confirm' | 'warning' | 'error'</td>
     <td>
       <code>'info'</code>
     </td>
     <td>Uses on of the available alert types.</td>
   </tr>
   <tr>
-    <td>mode: string ('inline' | 'modal')</td>
+    <td>mode: 'inline' | 'modal'</td>
     <td>
       <code>'inline'</code>
     </td>
@@ -21,17 +26,16 @@
       Uses on of the available alert modes:
       <ul>
         <li>
-          <strong>inline:</strong> If onClose function is received, close
-          button will be visible and the function will be executed when it's
-          clicked. There is no overlay layer. Position should be decided by
-          the user.
+          <strong>inline:</strong> If onClose function is received, close button
+          will be visible and the function will be executed when it's clicked.
+          There is no overlay layer. Position should be decided by the user.
         </li>
         <li>
-          <strong>modal:</strong> The alert will be displayed in the middle
-          of the screen with an overlay layer behind. The onClose function
-          will be executed when the X button or the overlay is clicked. The
-          user has the responsibility of hidding the modal in the onClose
-          function, otherwise the modal will remain visible.
+          <strong>modal:</strong> The alert will be displayed in the middle of
+          the screen with an overlay layer behind. The onClose function will be
+          executed when the X button or the overlay is clicked. The user has the
+          responsibility of hidding the modal in the onClose function, otherwise
+          the modal will remain visible.
         </li>
       </ul>
     </td>
@@ -44,33 +48,34 @@
   <tr>
     <td>tabIndexValue: number</td>
     <td><code>0</code></td>
-    <td>
-      Tabindex value given to the close button.
-    </td>
+    <td>Tabindex value given to the close button.</td>
   </tr>
   <tr>
     <td>onClose: EventEmitter</td>
     <td></td>
     <td>
-      This function will be called when the user clicks the close button. If
-      there is no function we should close the alert by default.
+      This event will emit in case the user clicks the close button. If
+      there is no event we should close the alert by default.
     </td>
   </tr>
   <tr>
-    <td>margin: any (string | object)</td>
+    <td>margin: string | object</td>
     <td></td>
     <td>
-      Size of the margin to be applied to the component ('xxsmall' |
-      'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). You
-      can pass an object with 'top', 'bottom', 'left' and 'right' properties
-      in order to specify different margin sizes.
+      Size of the margin to be applied to the component ('xxsmall' | 'xsmall' |
+      'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). You can pass an
+      object with 'top', 'bottom', 'left' and 'right' properties in order to
+      specify different margin sizes.
     </td>
   </tr>
   <tr>
-    <td>size: any (string | object)</td>
+    <td>size: string</td>
     <td>
       <code>'fitContent'</code>
     </td>
-    <td>Size of the component ('small' | 'medium' | 'large' | 'fillParent' | 'fitContent').</td>
+    <td>
+      Size of the component ('small' | 'medium' | 'large' | 'fillParent' |
+      'fitContent').
+    </td>
   </tr>
-</dxc-table>
\ No newline at end of file
+</dxc-table>
diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/card/properties/card-table-properties/card-table-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/card/properties/card-table-properties/card-table-properties.component.html
index 016dd9085..1d861fd82 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/card/properties/card-table-properties/card-table-properties.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/card/properties/card-table-properties/card-table-properties.component.html
@@ -21,7 +21,7 @@
     <td>Color of the image background.</td>
   </tr>
   <tr>
-    <td>imagePadding: any (string | object)</td>
+    <td>imagePadding: string | object</td>
     <td></td>
     <td>
       Size of the padding to be applied to the image section of the component
@@ -31,14 +31,14 @@
     </td>
   </tr>
   <tr>
-    <td>imagePosition: string ('after' | 'before')</td>
+    <td>imagePosition: 'after' | 'before'</td>
     <td>
       <code>'before'</code>
     </td>
     <td>Whether the image should appear in relation to the content.</td>
   </tr>
   <tr>
-    <td>contentPadding: any (string | object)</td>
+    <td>contentPadding: string | object</td>
     <td></td>
     <td>
       Size of the padding to be applied to the content section of the component
@@ -59,8 +59,8 @@
     <td>onClick: EventEmitter</td>
     <td></td>
     <td>
-      This event will emit when the user clicks the card. Component will
-      show some visual feedback on hover.
+      This event will emit when the user clicks the card. Component will show
+      some visual feedback on hover.
     </td>
   </tr>
   <tr>
@@ -69,7 +69,7 @@
     <td>Whether the image must cover the whole image area of the card.</td>
   </tr>
   <tr>
-    <td>margin: any (string | object)</td>
+    <td>margin: string | object</td>
     <td></td>
     <td>
       Size of the margin to be applied to the component ('xxsmall' | 'xsmall' |
@@ -86,8 +86,6 @@
   <tr>
     <td>outlined: boolean</td>
     <td><code>true</code></td>
-    <td>Whether the card must be outlined.
-    </td>
+    <td>Whether the card must be outlined.</td>
   </tr>
-
 </dxc-table>
diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html
index 798b3da5c..d1a856c6a 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/dropdown/properties/dropdown-table-properties.component.html
@@ -39,7 +39,7 @@
     <td>Whether the arrow next to the label is displayed or not.</td>
   </tr>
   <tr>
-    <td>margin: any (string | object)</td>
+    <td>margin: string | object</td>
     <td></td>
     <td>
       Size of the margin to be applied to the component ('xxsmall' | 'xsmall' |
@@ -50,7 +50,7 @@
   </tr>
   <tr>
     <td>size: string</td>
-    <td><code>'fitContent' </code></td>
+    <td><code>'fitContent'</code></td>
     <td>
       Size of the component ('small' | 'medium' | 'large' | 'fillParent' |
       'fitContent').
diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/header/properties/header-table-properties/header-table-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/header/properties/header-table-properties/header-table-properties.component.html
index 2513b0f71..a8a5eeab0 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/header/properties/header-table-properties/header-table-properties.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/header/properties/header-table-properties/header-table-properties.component.html
@@ -59,7 +59,7 @@
     </td>
   </tr>
   <tr>
-    <td>padding: any (string | object)</td>
+    <td>padding: string | object</td>
     <td></td>
     <td>
       Size of the padding to be applied to the custom area of the component
diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/radio/properties/radio-properties/radio-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/radio/properties/radio-properties/radio-properties.component.html
index b71604bcd..1091c69b4 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/radio/properties/radio-properties/radio-properties.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/radio/properties/radio-properties/radio-properties.component.html
@@ -1,88 +1,93 @@
-<dxc-heading [level]="4" weight="normal" text="Properties" [margin]="{bottom:'small'}"></dxc-heading>
+<dxc-heading
+  [level]="4"
+  weight="normal"
+  text="Properties"
+  [margin]="{ bottom: 'small' }"
+></dxc-heading>
 <dxc-table>
-        <tr>
-                <th>Name</th>
-                <th>Default</th>
-                <th>Description</th>
-              </tr>
-              <tr>
-                <td>checked: boolean</td>
-                <td>
-                  <code>false</code>
-                </td>
-                <td>
-                  If true, the radio is selected. If undefined the component will be
-                  uncontrolled and the value will be managed internally by the
-                  component.
-                </td>
-              </tr>
-              <tr>
-                <td>value: any</td>
-                <td></td>
-                <td>
-                  Will be passed to the value attribute of the html input element. 
-                  When inside a form, this value will be only submitted if the radio is checked.
-                </td>
-              </tr>
-              <tr>
-                <td>label: string</td>
-                <td></td>
-                <td>Text to be placed next to the radio.</td>
-              </tr>
-              <tr>
-                <td>labelPosition: string ('before' | 'after')</td>
-                <td>
-                  <code>'before'</code>
-                </td>
-                <td>Whether the label should appear after or before the radio.</td>
-              </tr>
-              <tr>
-                <td>name: string</td>
-                <td></td>
-                <td>Name attribute of the input element.</td>
-              </tr>
-              <tr>
-                <td>disabled: boolean</td>
-                <td>
-                  <code>false</code>
-                </td>
-                <td>If true, the component will be disabled.</td>
-              </tr>
-              <tr>
-                <td>required: boolean</td>
-                <td>
-                  <code>false</code>
-                </td>
-                <td>
-                  If true, the radio will change its appearence, showing that the value
-                  is required.
-                </td>
-              </tr>
-              <tr>
-                <td>onChange: EventEmitter</td>
-                <td></td>
-                <td>
-                  This function will be called when the user clicks the radio. The new
-                  value will be passed as a parameter.
-                </td>
-              </tr>
-              <tr>
-                <td>margin: any (string | object)</td>
-                <td></td>
-                <td>
-                  Size of the margin to be applied to the component ('xxsmall' |
-                  'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). You
-                  can pass an object with 'top', 'bottom', 'left' and 'right' properties
-                  in order to specify different margin sizes.
-                </td>
-              </tr>
-              <tr>
-                <td>size: any (string | object)</td>
-                <td>
-                  <code>'fitContent'</code>
-                </td>
-                <td>
-                  Size of the component ('small' | 'medium' | 'large' | 'fillParent' | 'fitContent').
-                </td>
-              </tr>
+  <tr>
+    <th>Name</th>
+    <th>Default</th>
+    <th>Description</th>
+  </tr>
+  <tr>
+    <td>checked: boolean</td>
+    <td>
+      <code>false</code>
+    </td>
+    <td>
+      If true, the radio is selected. If undefined the component will be
+      uncontrolled and the value will be managed internally by the component.
+    </td>
+  </tr>
+  <tr>
+    <td>value: string</td>
+    <td></td>
+    <td>
+      Will be passed to the value attribute of the html input element. When
+      inside a form, this value will be only submitted if the radio is checked.
+    </td>
+  </tr>
+  <tr>
+    <td>label: string</td>
+    <td></td>
+    <td>Text to be placed next to the radio.</td>
+  </tr>
+  <tr>
+    <td>labelPosition: 'before' | 'after'</td>
+    <td>
+      <code>'before'</code>
+    </td>
+    <td>Whether the label should appear after or before the radio.</td>
+  </tr>
+  <tr>
+    <td>name: string</td>
+    <td></td>
+    <td>Name attribute of the input element.</td>
+  </tr>
+  <tr>
+    <td>disabled: boolean</td>
+    <td>
+      <code>false</code>
+    </td>
+    <td>If true, the component will be disabled.</td>
+  </tr>
+  <tr>
+    <td>required: boolean</td>
+    <td>
+      <code>false</code>
+    </td>
+    <td>
+      If true, the radio will change its appearence, showing that the value is
+      required.
+    </td>
+  </tr>
+  <tr>
+    <td>onChange: EventEmitter</td>
+    <td></td>
+    <td>
+      This event will emit in case the user clicks the radio. The new value
+      will be passed as a parameter.
+    </td>
+  </tr>
+  <tr>
+    <td>margin: string | object</td>
+    <td></td>
+    <td>
+      Size of the margin to be applied to the component ('xxsmall' | 'xsmall' |
+      'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). You can pass an
+      object with 'top', 'bottom', 'left' and 'right' properties in order to
+      specify different margin sizes.
+    </td>
+  </tr>
+  <tr>
+    <td>size: string</td>
+    <td>
+      <code>'fitContent'</code>
+    </td>
+    <td>
+      Size of the component ('small' | 'medium' | 'large' | 'fillParent' |
+      'fitContent').
+    </td>
+  </tr>
 </dxc-table>
diff --git a/projects/dxc-ngx-cdk-site/src/app/components/examples/tabs/properties/tabs-table-properties.component.html b/projects/dxc-ngx-cdk-site/src/app/components/examples/tabs/properties/tabs-table-properties.component.html
index 510c9880d..4142665a2 100644
--- a/projects/dxc-ngx-cdk-site/src/app/components/examples/tabs/properties/tabs-table-properties.component.html
+++ b/projects/dxc-ngx-cdk-site/src/app/components/examples/tabs/properties/tabs-table-properties.component.html
@@ -16,12 +16,12 @@
     <td>The index of the active tab.</td>
   </tr>
   <tr>
-    <td>iconPosition: string ('top' | 'left')</td>
+    <td>iconPosition: 'top' | 'left'</td>
     <td><code>'left'</code></td>
     <td>Position of icons in tabs.</td>
   </tr>
   <tr>
-    <td>margin: any (string | object)</td>
+    <td>margin: string | object</td>
     <td></td>
     <td>
       Size of the margin to be applied to the component ('xxsmall' | 'xsmall' |
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-alert/dxc-alert.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-alert/dxc-alert.component.ts
index 70a05aaa5..b207b5a8d 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-alert/dxc-alert.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-alert/dxc-alert.component.ts
@@ -80,9 +80,10 @@ export class DxcAlertComponent implements OnChanges {
   @Output() onClose: EventEmitter<void> = new EventEmitter<void>();
 
   /**
-   * Size of the margin to be applied to the component. You can pass an object with
-   * 'top', 'bottom', 'left' and 'right' properties in order to specify different
-   * margin sizes.
+   * Size of the margin to be applied to the component 
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). 
+   * You can pass an object with 'top', 'bottom', 'left' and 'right' properties 
+   * in order to specify different margin sizes.
    */
   @Input() margin: Space | Margin;
 
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-card/dxc-card.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-card/dxc-card.component.ts
index 666183624..e9efc4618 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-card/dxc-card.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-card/dxc-card.component.ts
@@ -54,7 +54,8 @@ export class DxcCardComponent implements OnInit {
   @Input() imageBgColor: string = "black";
 
   /**
-   * Size of the padding to be applied to the image section of the component.
+   * Size of the padding to be applied to the image section of the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
    * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
    * in order to specify different padding sizes.
    */
@@ -66,7 +67,8 @@ export class DxcCardComponent implements OnInit {
   @Input() imagePosition: "after" | "before" = "before";
 
   /**
-   * Size of the padding to be applied to the content section of the component.
+   * Size of the padding to be applied to the content section of the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
    * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
    * in order to specify different padding sizes.
    */
@@ -97,9 +99,10 @@ export class DxcCardComponent implements OnInit {
   private _imageCover = false;
 
   /**
-   * Size of the margin to be applied to the component. You can pass an object
-   * with 'top', 'bottom', 'left' and 'right' properties in order to specify
-   * different margin sizes.
+   * Size of the margin to be applied to the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). 
+   * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in 
+   * order to specify different margin sizes.
    */
   @Input() margin: Space | Size;
 
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-checkbox/dxc-checkbox.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-checkbox/dxc-checkbox.component.ts
index 52a202b8a..6c3735098 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-checkbox/dxc-checkbox.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-checkbox/dxc-checkbox.component.ts
@@ -116,8 +116,10 @@ export class DxcCheckboxComponent implements OnInit {
   @Output() onChange: EventEmitter<boolean>;
 
   /**
-   * Size of the margin to be applied to the component. You can pass an object with 'top',
-   * 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+   * Size of the margin to be applied to the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). 
+   * You can pass an object with 'top', 'bottom', 'left' and 'right' properties 
+   * in order to specify different margin sizes.
    */
   @Input() margin: Space | Margin;
 
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.ts
index b06d8d216..380716bc8 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-dropdown/dxc-dropdown.component.ts
@@ -78,8 +78,10 @@ export class DxcDropdownComponent implements OnChanges {
   private _caretHidden = false;
 
   /**
-   * Size of the margin to be applied to the component. You can pass an object with 'top',
-   * 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+   * Size of the margin to be applied to the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). 
+   * You can pass an object with 'top', 'bottom', 'left' and 'right' properties 
+   * in order to specify different margin sizes.
    */
   @Input() margin: Space | Margin;
 
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header-dropdown/dxc-header-dropdown.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header-dropdown/dxc-header-dropdown.component.ts
index 6993dc35c..24e5c4250 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header-dropdown/dxc-header-dropdown.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header-dropdown/dxc-header-dropdown.component.ts
@@ -56,8 +56,10 @@ export class DxcHeaderDropdownComponent implements OnChanges {
   @Input() caretHidden: boolean = false;
 
   /**
-   * Size of the margin to be applied to the component. You can pass an object with 'top',
-   * 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+   * Size of the margin to be applied to the component 
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). 
+   * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in 
+   * order to specify different margin sizes.
    */
   @Input() margin: Space | Margin;
 
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header.component.ts
index 9fd90181e..600d89b23 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-header/dxc-header.component.ts
@@ -81,12 +81,14 @@ export class DxcHeaderComponent implements OnChanges {
   private _tabIndexValue = 0;
 
   /**
-   * Size of the bottom margin to be applied to the footer.
+   * Size of the bottom margin to be applied to the footer
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
    */
   @Input() margin: Space;
 
   /**
-   * Size of the padding to be applied to the custom area of the component.
+   * Size of the padding to be applied to the custom area of the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
    * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to
    * specify different padding sizes.
    */
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-radio/dxc-radio.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-radio/dxc-radio.component.ts
index edede91a4..e303d059a 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-radio/dxc-radio.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-radio/dxc-radio.component.ts
@@ -101,8 +101,10 @@ export class DxcRadioComponent implements OnInit {
   @Output() onChange: EventEmitter<boolean>;
 
   /**
-   * Size of the margin to be applied to the component. You can pass an object with 'top',
-   * 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
+   * Size of the margin to be applied to the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). 
+   * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in 
+   * order to specify different margin sizes.
    */
   @Input() margin: Space | Margin;
 
diff --git a/projects/dxc-ngx-cdk/src/lib/dxc-tabs/dxc-tabs.component.ts b/projects/dxc-ngx-cdk/src/lib/dxc-tabs/dxc-tabs.component.ts
index 36731b1a4..f5c5a9635 100644
--- a/projects/dxc-ngx-cdk/src/lib/dxc-tabs/dxc-tabs.component.ts
+++ b/projects/dxc-ngx-cdk/src/lib/dxc-tabs/dxc-tabs.component.ts
@@ -74,9 +74,10 @@ export class DxcTabsComponent implements OnChanges {
   @Input() iconPosition: "top" | "left" = "left";
 
   /**
-   * Size of the margin to be applied to the component. You can pass an object
-   * with 'top', 'bottom', 'left' and 'right' properties in order to specify
-   * different margin sizes.
+   * Size of the margin to be applied to the component
+   * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge'). 
+   * You can pass an object with 'top', 'bottom', 'left' and 'right' properties 
+   * in order to specify different margin sizes.
    */
   @Input() margin: Space | Margin;