Commit 87ac3b7c authored by Tifenn Guillas's avatar Tifenn Guillas
Browse files

Merge branch '58-design-output-selectbox' into 'develop'

Resolve "Design output selectbox"

Closes #58

See merge request !51
parents cc3a42df 1f49fdac
Pipeline #1505 passed with stages
in 9 minutes and 20 seconds
......@@ -14,7 +14,7 @@
}
.selectbox button:hover {
background-color: #F8F9FA;
background-color: #ECECEC;
}
.selectbox button:focus {
......
<p class="mb-3"><em>{{ categoryLabel }}</em></p>
<div class="row mb-1">
<div class="col pr-1">
<button (click)="selectAll()" [disabled]="isAllSelected" class="btn btn-sm btn-block btn-outline-secondary letter-spacing">Select All</button>
<button (click)="selectAll()" [disabled]="isAllSelected"
class="btn btn-sm btn-block btn-outline-secondary letter-spacing">Select All</button>
</div>
<div class="col pl-1">
<button (click)="unselectAll()" [disabled]="isAllUnselected" class="btn btn-sm btn-block btn-outline-secondary letter-spacing">Unselect All</button>
<button (click)="unselectAll()" [disabled]="isAllUnselected"
class="btn btn-sm btn-block btn-outline-secondary letter-spacing">Unselect All</button>
</div>
</div>
<div class="selectbox py-1">
<button *ngFor="let attribute of getAttributeListSortedByDisplay()" class="btn btn-block text-left py-0 m-0"
(click)="toggleSelection(attribute.id)">
<div *ngIf="isSelected(attribute.id); then selected else unselected"></div>
{{ attribute.form_label }}
</button>
</div>
<ng-template #selected>
<span class="fa-stack fa-1x">
<i class="far fa-square fa-stack-1x text-secondary"></i>
<i class="fas fa-check fa-stack-1x anis-color"></i>
</span>
</ng-template>
<ng-template #unselected>
<span class="fa-stack fa-1x">
<i class="far fa-square fa-stack-1x text-secondary"></i>
</span>
</ng-template>
\ No newline at end of file
<div class="selectbox p-0">
<div *ngFor="let attribute of getAttributeListSortedByDisplay()">
<div *ngIf="isSelected(attribute.id)">
<button class="btn btn-block text-left py-1 m-0 rounded-0"
(click)="toggleSelection(attribute.id)">
<i class="fas fa-fw fa-check-square anis-color"></i> {{ attribute.form_label }}
</button>
</div>
<div *ngIf="!isSelected(attribute.id)">
<button class="btn btn-block text-left py-1 m-0 rounded-0" (click)="toggleSelection(attribute.id)">
<i class="far fa-fw fa-square text-secondary"></i> {{ attribute.form_label }}
</button>
</div>
</div>
</div>
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment