add subcategory description on top of the indicators

src/app/monitor/monitor.component.html

@@ -51,7 +51,7 @@
           <li *ngIf="isPublicOrIsMember(category.visibility)"
               [class.uk-active]="category.alias === activeCategory.alias">
             <a [routerLink]="['/', stakeholder.alias, activeTopic.alias, category.alias]"
-               [queryParams]="queryParams">
+							[queryParams]="queryParams">
               <span class="title">{{category.name}}</span>
             </a>
           </li>
@@ -65,13 +65,18 @@
           <li *ngIf="isPublicOrIsMember(subCategory.visibility)"
               [ngClass]="(subCategory.alias === activeSubCategory.alias)?'uk-active':''">
             <a [routerLink]="['/', stakeholder.alias, activeTopic.alias, activeCategory.alias, subCategory.alias]"
-               [queryParams]="queryParams"
+							[queryParams]="queryParams"
-               class="uk-margin-remove-bottom"
+							class="uk-margin-remove-bottom"
             ><span>{{subCategory.name}}</span></a>
           </li>
         </ng-template>
       </ul>
     </div>
+		<div *ngIf="activeSubCategory.description" class="uk-margin-medium-top uk-margin-bottom">
+			<div class="uk-padding uk-padding-remove-vertical">
+				{{activeSubCategory.description}}
+			</div>
+		</div>
     <div *ngIf="privateStakeholder" class="message">
       <div class="uk-text-center">
         <h3 class="uk-flex uk-flex-middle">
@@ -95,7 +100,7 @@
         <ng-template [ngIf]="!loading && !privateStakeholder &&
                     (!activeSubCategory ||
                     ((activeSubCategory.numbers.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.numbers) == 0) &&
-                     (activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
+										(activeSubCategory.charts.length == 0 || countSectionsWithIndicatorsToShow(activeSubCategory.charts) == 0))
                     || !activeTopic || !activeCategory || !activeSubCategory)" [ngIfElse]="content">
           <div class="message uk-text-center">
             <h3>
@@ -106,12 +111,12 @@
         <ng-template #content>
           <ng-container *ngFor="let number of activeSubCategory.numbers; let i = index;">
             <div *ngIf="countIndicatorsToShow(number.indicators) > 0" class="uk-grid uk-margin-medium-bottom" uk-grid
-                 uk-height-match="target: .uk-card">
+							uk-height-match="target: .uk-card">
               <h5 *ngIf="number.title" class="uk-width-1-1 uk-margin-bottom">{{number.title}}</h5>
               <ng-template ngFor [ngForOf]="number.indicators" let-indicator let-j="index">
                 <div *ngIf="isPublicOrIsMember(indicator.visibility)" [ngClass]="getNumberClassBySize(indicator.width)">
                   <div class="uk-card uk-card-default uk-flex uk-flex-column uk-flex-center"
-                       [class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
+										[class.semiFiltered]="indicator.indicatorPaths[0].filtersApplied < countSelectedFilters()">
                     <div class="uk-text-center">
                       <!--<div *ngIf="properties.environment === 'development'">
                         Filtered:{{indicator.indicatorPaths[0].filtersApplied}}out of{{countSelectedFilters()}}
@@ -122,7 +127,7 @@
                       </div>
                       <!-- for printing only -->
                       <span *ngIf="numberResults.get(i + '-' + j)"
-                            class="uk-text-bold uk-hidden">{{numberResults.get(i + '-' + j) | number}}</span>
+												class="uk-text-bold uk-hidden">{{numberResults.get(i + '-' + j) | number}}</span>
                       <!-- ----------------- -->
                       <div class="uk-text-uppercase uk-text-small uk-margin-top">{{indicator.name}}</div>
                     </div>
@@ -144,14 +149,14 @@
           </ng-container>
           <ng-container *ngFor="let chart of activeSubCategory.charts; let i = index;">
               <div *ngIf="countIndicatorsToShow(chart.indicators) > 0"
-                   class="uk-grid uk-grid-column-medium uk-margin-medium-bottom uk-flex uk-flex-middle" uk-grid
+									class="uk-grid uk-grid-column-medium uk-margin-medium-bottom uk-flex uk-flex-middle" uk-grid
-                   uk-height-match="target: .uk-card">
+									uk-height-match="target: .uk-card">
                 <h5 *ngIf="chart.title" class="uk-width-1-1 uk-margin-bottom">{{chart.title}}</h5>
                 <ng-template ngFor [ngForOf]="chart.indicators" let-indicator let-j="index">
                   <div *ngIf="isPublicOrIsMember(indicator.visibility) && chartsActiveType.get(i + '-' + j)"
-                       [ngClass]="getChartClassBySize(indicator.width)">
+										[ngClass]="getChartClassBySize(indicator.width)">
                     <div class="uk-card uk-card-default uk-position-relative"
-                         [class.semiFiltered]="chartsActiveType.get(i + '-' + j).filtersApplied < countSelectedFilters()">
+											[class.semiFiltered]="chartsActiveType.get(i + '-' + j).filtersApplied < countSelectedFilters()">
                       <div class="uk-card-body uk-text-center uk-margin-small-bottom">
                         <h4 class="uk-margin-bottom chartTitle uk-flex uk-flex-bottom ">
                           <div>{{indicator.name + " "}}</div>
@@ -174,8 +179,8 @@
                             [ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"></iframe>
                         <div *ngIf="properties.disableFrameLoad && chartsActiveType.get(i + '-' + j).source !== 'image'">
                           <img class="uk-width-1-1 uk-blend-multiply"
-                               [ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"
+														[ngClass]="'uk-height-' + (indicator.height?indicator.height.toLowerCase():'medium')"
-                               src="assets/chart-placeholder.png">
+														src="assets/chart-placeholder.png">
                         </div>
                         <img *ngIf="chartsActiveType.get(i + '-' + j).source === 'image'"
                              [src]="chartsActiveType.get(i + '-' + j).safeResourceUrl"

src/app/openaireLibrary

@@ -1 +1 @@
-Subproject commit 82833bcf11e2a4a9ed9e24c6b54a2a3750a681e0
+Subproject commit 3eba03889355b91f4e335d1997e689ca379b4572

src/assets/common-assets

@@ -1 +1 @@
-Subproject commit d689686aa89aadae1e58b315fe4aa8e720b320b5
+Subproject commit 0423644810480f58ec31522e744d1589530657f9

src/assets/openaire-theme

@@ -1 +1 @@
-Subproject commit a05879462df531d670cd521f1834ccdc76e11ae0
+Subproject commit 98b30a43f1810bcdbc96f119f3f021a1d7872714