diff --git a/src/app/core/service-detail/service-detail.component.css b/src/app/core/service-detail/service-detail.component.css index bf35caaa89275b42b8df074b5e5f3458580254b5..f294588ea18aadff978ed41a0dce9916a67ad218 100644 --- a/src/app/core/service-detail/service-detail.component.css +++ b/src/app/core/service-detail/service-detail.component.css @@ -12,4 +12,8 @@ .trash-icon:hover { color: hsl(0, 100%, 40%); +} + +.ordering-arrow { + color: gray; } \ No newline at end of file diff --git a/src/app/core/service-detail/service-detail.component.html b/src/app/core/service-detail/service-detail.component.html index 72c4b0a9f4be9687136bae65dad32c1f7d44d16e..74a7a59c2e231445c6014c96b7292e3c10f43ad0 100644 --- a/src/app/core/service-detail/service-detail.component.html +++ b/src/app/core/service-detail/service-detail.component.html @@ -82,13 +82,13 @@ Története </h5> <div> - <button class='btn mt-auto' *ngIf='currentHistoryOrderState === historyOrderState.Descending && service.history.length >=2' - (click)='toggleHistoryOrder(historyOrderState.Ascending)'> - ↑ + <button class='btn' *ngIf='currentHistoryOrderState === historyOrderState.Descending && service.history.length >=2' + (click)='toggleHistoryOrder(historyOrderState.Ascending)'> + <fa-icon [icon]='faArrowUp' class="ordering-arrow"></fa-icon> </button> <button class='btn' *ngIf='currentHistoryOrderState === historyOrderState.Ascending && service.history.length >= 2' - (click)='toggleHistoryOrder(historyOrderState.Descending)'> - ↓ + (click)='toggleHistoryOrder(historyOrderState.Descending)'> + <fa-icon [icon]='faArrowDown' class="ordering-arrow"></fa-icon> </button> <button class='btn btn-link' *ngIf='isLoggedIn' (click)='updateState(serviceDetailComponentState.CREATE_HISTORY)'> diff --git a/src/app/core/service-detail/service-detail.component.ts b/src/app/core/service-detail/service-detail.component.ts index 14c9ad6f2f29b35e317d1ff7474afc5d744d3ff4..1ad84bbcefd3579bebdf84353b865888ac2d5de9 100644 --- a/src/app/core/service-detail/service-detail.component.ts +++ b/src/app/core/service-detail/service-detail.component.ts @@ -5,7 +5,7 @@ import { faCheckCircle, faTrashAlt, faPlusSquare } from '@fortawesome/free-regular-svg-icons'; -import { faCaretLeft } from '@fortawesome/free-solid-svg-icons'; +import { faCaretLeft, faArrowUp, faArrowDown } from '@fortawesome/free-solid-svg-icons'; import { ActivatedRoute, Router } from '@angular/router'; import { Service } from '../../models/service.model'; import { ServicesService } from '../../services/services.service'; @@ -68,6 +68,14 @@ export class ServiceDetailComponent implements OnInit { * ADD icon */ faPlusSquare = faPlusSquare; + /** + * ARROW UP icon + */ + faArrowUp = faArrowUp; + /** + * ARROW DOWN icon + */ + faArrowDown = faArrowDown; /** * Current service that is displayed */