Improve likert styling

projects/common/element-components/compound-elements/likert-radio-button-group.component.ts

@@ -7,7 +7,7 @@ import { LikertElementRow } from '../../models/compound-elements/likert-element-
   selector: 'app-likert-radio-button-group',
   template: `
     <mat-radio-group [style.display]="'grid'"
-                     [style.grid-template-columns]="'2fr ' + '1fr '.repeat(elementModel.columnCount)"
+                     [style.grid-template-columns]="'5fr ' + '2fr '.repeat(elementModel.columnCount)"
                      [formControl]="elementFormControl">
       <div [style.grid-column-start]="1"
            [style.grid-column-end]="2"

projects/common/element-components/compound-elements/likert.component.ts

@@ -6,10 +6,10 @@ import { LikertElement } from '../../models/compound-elements/likert-element';
   selector: 'app-likert',
   template: `
     <div [style.display]="'grid'"
-         [style.grid-template-columns]="'2fr ' + '1fr '.repeat(elementModel.answers.length)">
+         [style.grid-template-columns]="'5fr ' + '2fr '.repeat(elementModel.answers.length)">
 
-      <div [style.display]="'grid'"
-           [style.grid-template-columns]="'2fr ' + '1fr '.repeat(elementModel.answers.length)"
+      <div class="headings" [style.display]="'grid'"
+           [style.grid-template-columns]="'5fr ' + '2fr '.repeat(elementModel.answers.length)"
            [style.grid-column-start]="1"
            [style.grid-column-end]="elementModel.answers.length + 2"
            [style.grid-row-start]="1"
@@ -31,7 +31,7 @@ import { LikertElement } from '../../models/compound-elements/likert-element';
 
       <ng-container *ngFor="let question of elementModel.questions; let i = index">
         <app-likert-radio-button-group
-             [ngClass]="{ 'odd': i % 2 ===0 }"
+             [ngClass]="{ 'odd': elementModel.lineColoring && i % 2 === 0 }"
              [style.display]="'grid'"
              [style.grid-column-start]="1"
              [style.grid-column-end]="elementModel.answers.length + 2"
@@ -44,6 +44,7 @@ import { LikertElement } from '../../models/compound-elements/likert-element';
     </div>
   `,
   styles: [
+    '.headings {padding-bottom: 10px}',
     '.odd {background-color: #D0F6E7;}',
     '.answers {text-align: center;}',
     '::ng-deep app-likert mat-radio-button span.mat-radio-container {left: calc(50% - 10px)}'