openaire-library/sdg/sdg-selection/sdg-selection.component.html

<div *ngIf="loading">
	<loading></loading>
</div>
<div *ngIf="!loading">
	<div class="uk-flex uk-flex-around">
		<div>
			<div *ngFor="let control of firstColumn; let i = index"
				class="uk-margin-bottom">
				<label [class.uk-text-bolder]="subjects?.includes(control.value.id)">
					<input [formControl]="control.get('checked')"
						type="checkbox" class="uk-checkbox uk-margin-small-right">
					<span *ngIf="isFeedback" class="uk-text-uppercase uk-margin-xsmall-right">Goal</span>
					<span>{{control.value.id}}</span>
				</label>
			</div>
		</div>
		<div>
			<div *ngFor="let control of secondColumn; let i = index"
				class="uk-margin-bottom">
				<label [class.uk-text-bolder]="subjects?.includes(control.value.id)">
					<input [formControl]="control.get('checked')"
						type="checkbox" class="uk-checkbox uk-margin-small-right">
					<span *ngIf="i !== secondColumn.length - 1 && isFeedback" 
						class="uk-text-uppercase uk-margin-xsmall-right">Goal</span>
					<span>{{control.value.id}}</span>
				</label>
			</div>
		</div>
	</div>
</div>