diff options
Diffstat (limited to 'ufund-ui/src')
3 files changed, 30 insertions, 4 deletions
diff --git a/ufund-ui/src/app/components/need-list/need-list.component.css b/ufund-ui/src/app/components/need-list/need-list.component.css index c763105..2eb6a8d 100644 --- a/ufund-ui/src/app/components/need-list/need-list.component.css +++ b/ufund-ui/src/app/components/need-list/need-list.component.css @@ -29,7 +29,7 @@ li { border-radius: 5px; margin: 5px; > button { - background-color: var(--list-background-color); + background-color: transparent; width: 88%; float: left; transition: all 0.3s ease; diff --git a/ufund-ui/src/app/components/need-list/need-list.component.html b/ufund-ui/src/app/components/need-list/need-list.component.html index b31ccf0..eaa8a6f 100644 --- a/ufund-ui/src/app/components/need-list/need-list.component.html +++ b/ufund-ui/src/app/components/need-list/need-list.component.html @@ -13,14 +13,14 @@ <h2 *ngIf="searchResults.length == 0"> No Results Found </h2> <ul> - <li *ngFor="let need of searchResults" id="need-button-{{need.id}}" > + <li *ngFor="let need of searchResults" id="need-button-{{need.id}}"> <button [routerLink]="'/need/' + need.id" (mouseenter) ="changeText(need.id, '(details)')" (mouseleave)="changeText(need.id, '')"> <p>{{need.name}}<span id="hover-status-label-{{need.id}}"> </span></p> </button> <button (click)="add(need)" *ngIf="isHelper()">Add To Basket</button> <section *ngIf="isManager()"> - <button (click)="select(need)"> + <button (click)="select(need)" id="need-edit-button-{{need.id}}"> <img class="icon" src="/edit.png" alt="Select"> </button> <button (click)="delete(need.id)" *ngIf="isManager()"> diff --git a/ufund-ui/src/app/components/need-list/need-list.component.ts b/ufund-ui/src/app/components/need-list/need-list.component.ts index e47929b..9ef191a 100644 --- a/ufund-ui/src/app/components/need-list/need-list.component.ts +++ b/ufund-ui/src/app/components/need-list/need-list.component.ts @@ -112,6 +112,32 @@ export class NeedListComponent { } select(need : Need) { - this.selectedNeed = need; + if (this.selectedNeed) { + //revert already selected need to previous style + console.log(need.id); + let button = document.getElementById('need-button-' + this.selectedNeed.id); + if (button) { + console.log(button) + button.style.background = 'lightgray'; + button.style.marginLeft = '0%'; + button.style.width = '98%'; + } + button = document.getElementById('need-edit-button-' + this.selectedNeed.id); + if (button) { + button.style.visibility = 'visible'; + } + } + //change selected need to selected style + this.selectedNeed = need; + let button = document.getElementById('need-button-' + need.id); + if (button) { + button.style.background = 'white'; + button.style.marginLeft = '4%'; + button.style.width = '100%'; + } + button = document.getElementById('need-edit-button-' + need.id); + if (button) { + button.style.visibility = 'hidden'; + } } }
\ No newline at end of file |