rural-attractiveness-cz/src/adjuster/dataset-list.component.html

<div class="d-flex flex-row">
  <div class="p-2 flex-grow-1">
    <span class="glyphicon cursor-pointer"
      [ngClass]="datasetlistVisible ? 'icon-chevron-down' : 'icon-chevron-right'"
      (click)="datasetlistVisible = !datasetlistVisible"></span>
    <label class="pl-2 cursor-pointer" (click)="datasetlistVisible = !datasetlistVisible">{{factor.name}}</label>
  </div>
  <div class="p-2">{{(factor.weight * 100).toFixed(0)}}&nbsp;%</div>
</div>
<input type="range" class="custom-range" [(ngModel)]="factor.weight" min="0"
  max="1.0" step="0.05">
<div [hidden]="!datasetlistVisible">
  <div *ngFor="let dataset of factor.datasets; let descriptionVisible = false">
    <button type="button" class="btn btn-sm btn-light hs-lm-item-visibility"
      [ngClass]="dataset.included ? 'hs-checkmark' : 'hs-uncheckmark'"
      (click)="dataset.included = !dataset.included;$event.stopPropagation()"></button>
    <!-- commented because we do not have descriptions yet -->
    <!--span class="glyphicon cursor-pointer text-secondary"
      [ngClass]="descriptionVisible ? 'icon-chevron-down' : 'icon-chevron-right'"
      (click)="descriptionVisible = !descriptionVisible"></span-->
    <!--label class="pl-2 cursor-pointer text-secondary"
      (click)="descriptionVisible = !descriptionVisible">{{dataset.name}}</label-->
      <label class="pl-2 text-secondary">{{dataset.name}}</label>
    <div class="p-2 mb-2 text-justify text-info" [hidden]="!descriptionVisible">
      {{dataset.desc}}
    </div>
  </div>
</div>