[Trunk | Library]: rangeFilter.component.html: Change recentyears (range buttons) according to Natalia's suggestions (+changes in library.css).

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-services-library/trunk/ng-openaire-library/src/app@58621 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
konstantina.galouni 2020-05-07 09:33:13 +00:00
parent c3cc637e89
commit 6ab1945f4c
1 changed files with 18 additions and 49 deletions

View File

@ -39,63 +39,32 @@
</div>
<div>
<!-- <div class="range-button uk-button-group uk-margin-small-top">-->
<!-- &lt;!&ndash; padding: 0 25px;&ndash;&gt;-->
<!-- <button [class]="'uk-button uk-button-default uk-button-small uk-text-small'-->
<!-- + ((stringToNum(filter.selectedFromValue) == currentYear && stringToNum(filter.selectedToValue) == currentYear) ? ' uk-text-bold' : '')"-->
<!-- (click)="yearChanged(0)" [disabled]="isDisabled">This year-->
<!-- </button>-->
<!-- <button [class]="'uk-button uk-button-default uk-button-small uk-text-small'-->
<!-- + ((stringToNum(filter.selectedToValue) == currentYear && stringToNum(filter.selectedFromValue) == currentYear-4) ? ' uk-text-bold' : '')"-->
<!-- (click)="yearChanged(4)" [disabled]="isDisabled">Last 5 years-->
<!-- </button>-->
<!-- <button [class]="'uk-button uk-button-default uk-button-small uk-text-small'-->
<!-- + ((stringToNum(filter.selectedToValue) == currentYear && stringToNum(filter.selectedFromValue) == currentYear-9) ? ' uk-text-bold' : '')"-->
<!-- (click)="yearChanged(9)" [disabled]="isDisabled">Last 10 years-->
<!-- </button>-->
<!-- </div>-->
<!-- <div class="range-button uk-margin-small-top uk-child-width-1-3">-->
<!-- <a [class]="'first-col uk-padding-small uk-padding-remove-vertical uk-text-small uk-text-center portal-link '-->
<!-- + ((stringToNum(filter.selectedFromValue) == currentYear && stringToNum(filter.selectedToValue) == currentYear) ? ' uk-text-bold' : '')-->
<!-- + (isDisabled ? ' uk-disabled uk-text-muted' : '')"-->
<!-- (click)="yearChanged(0)"><span>This year</span>-->
<!-- </a>-->
<!-- <a [class]="'uk-padding-small uk-padding-remove-vertical uk-text-small uk-text-center portal-link '-->
<!-- + ((stringToNum(filter.selectedToValue) == currentYear && stringToNum(filter.selectedFromValue) == currentYear-4) ? ' uk-text-bold' : '')-->
<!-- + (isDisabled ? ' uk-disabled uk-text-muted' : '')"-->
<!-- (click)="yearChanged(4)"><span>Last 5 years</span>-->
<!-- </a>-->
<!-- <a [class]="'uk-padding-small uk-padding-remove-vertical uk-text-small uk-text-center portal-link '-->
<!-- + ((stringToNum(filter.selectedToValue) == currentYear && stringToNum(filter.selectedFromValue) == currentYear-9) ? ' uk-text-bold' : '')-->
<!-- + (isDisabled ? ' uk-disabled uk-text-muted' : '')"-->
<!-- (click)="yearChanged(9)"><span>Last 10 years</span>-->
<!-- </a>-->
<!-- </div>-->
<div class="range-button uk-grid uk-grid-small uk-grid-divider uk-margin-top uk-child-width-1-3">
<a [class]="'uk-text-small uk-text-center portal-link '
<!-- Natalia's suggestion-->
<div class="uk-margin-small uk-margin-top uk-text-left">
<ul class="uk-subnav uk-subnav-divider recentyears">
<li><a
[class]="'portal-link uk-text-center '
+ ((stringToNum(filter.selectedFromValue) == currentYear && stringToNum(filter.selectedToValue) == currentYear) ? ' uk-text-bold' : '')
+ (isDisabled ? ' uk-disabled uk-text-muted' : '')"
(click)="yearChanged(0)"><span>This year</span>
</a>
<a [class]="'uk-text-small uk-text-center portal-link '
(click)="yearChanged(0)"
>This year</a></li>
<li><a
[class]="'portal-link uk-text-center '
+ ((stringToNum(filter.selectedToValue) == currentYear && stringToNum(filter.selectedFromValue) == currentYear-4) ? ' uk-text-bold' : '')
+ (isDisabled ? ' uk-disabled uk-text-muted' : '')"
(click)="yearChanged(4)"><span>Last 5 years</span>
</a>
<a [class]="'uk-text-small uk-text-center portal-link '
(click)="yearChanged(4)"
>Last 5 years</a></li>
<li><a
[class]="'portal-link uk-text-center '
+ ((stringToNum(filter.selectedToValue) == currentYear && stringToNum(filter.selectedFromValue) == currentYear-9) ? ' uk-text-bold' : '')
+ (isDisabled ? ' uk-disabled uk-text-muted' : '')"
(click)="yearChanged(9)"><span>Last 10 years</span>
</a>
(click)="yearChanged(9)"
>Last 10 years</a></li>
</ul>
</div>
<!-- End of Natalia's suggestion -->
<!-- <ul class="uk-subnav uk-subnav-divider uk-margin-small-top uk-padding-remove">-->
<!-- <li class="uk-padding-remove"><a>This year</a></li>-->
<!-- <li><a>Last 5 years</a></li>-->
<!-- <li><a>Last 10 years</a></li>-->
<!-- </ul>-->
</div>
</form>
</div>