[plugins-functionality | WIP]

This commit is contained in:
argirok 2024-03-11 13:27:26 +02:00
parent 2bb981c489
commit e177918b5d
4 changed files with 167 additions and 155 deletions

View File

@ -1,20 +1,21 @@
<div *ngIf="!community " class="uk-text-muted uk-text-center"> <div *ngIf="!community " class="uk-text-muted uk-text-center">
No community info available No community info available
</div> </div>
<div class="uk-grid uk-child-width-1-2@m uk-child-width-1-1@s"> <div class="uk-section uk-container ">
<div *ngIf="portal && community" class=""> <!-- this div will have the <div class="uk-grid uk-child-width-1-2@m uk-child-width-1-1@s ">
customized color or image -->
<div class="uk-container uk-container-large uk-flex uk-flex-center"> <div *ngIf="portal && community" class="">
<div class="uk-margin-large-top uk-margin-large-bottom"> <div *ngIf="pluginObject.showShortTitle"
<h1 *ngIf="pluginObject.showShortTitle" class="uk-text-center uk-h2 uk-margin-remove"> class="uk-text-primary">
{{community.shortTitle}} {{community.shortTitle}}
</h1>
<div *ngIf="pluginObject.showTitle"
class="uk-text-center uk-margin-top">
{{community.title}}
</div> </div>
<h1 *ngIf="pluginObject.showTitle" class=" uk-h2 uk-margin-remove">
{{community.title}}
</h1>
<div *ngIf="pluginObject.description" [innerHTML]="community.description"></div> <div *ngIf="pluginObject.description" [innerHTML]="community.description"></div>
<div *ngIf="pluginObject.searchbar && isRouteEnabled(searchLinkToResults)" [class.uk-invisible]="disableSelect" class="uk-margin-medium-top"> <div *ngIf="pluginObject.searchbar && isRouteEnabled(searchLinkToResults)" [class.uk-invisible]="disableSelect"
class="uk-margin-medium-top">
<advanced-search-input #advanced (searchEmitter)="goTo(true)"> <advanced-search-input #advanced (searchEmitter)="goTo(true)">
<entities-selection class="uk-width-1-3" [simpleView]="true" currentEntity="result" <entities-selection class="uk-width-1-3" [simpleView]="true" currentEntity="result"
[selectedEntity]="selectedEntity" [selectedEntity]="selectedEntity"
@ -32,23 +33,29 @@
</div> </div>
</div> </div>
</div> </div>
<div *ngIf="(pluginObject.fos && isRouteEnabled('/fields-of-science')) || (pluginObject.sdgs && isRouteEnabled('/sdgs'))" class="uk-padding-small uk-margin-small-top"> <div
*ngIf="(pluginObject.fos && isRouteEnabled('/fields-of-science')) || (pluginObject.sdgs && isRouteEnabled('/sdgs'))"
class="uk-padding-small uk-margin-small-top">
<div class="uk-text-meta"> <div class="uk-text-meta">
Try browsing by: Try browsing by:
</div> </div>
<div class="link-actions uk-flex uk-flex-column uk-flex-top uk-margin-small-top"> <div class="link-actions uk-flex uk-flex-column uk-flex-top uk-margin-small-top">
<a *ngIf="pluginObject.sdgs && isRouteEnabled('/sdgs')" class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text uk-margin-small-bottom" <a *ngIf="pluginObject.sdgs && isRouteEnabled('/sdgs')"
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text uk-margin-small-bottom"
routerLinkActive="router-link-active" routerLink="/sdgs"> routerLinkActive="router-link-active" routerLink="/sdgs">
<span class="uk-flex uk-flex-middle"> <span class="uk-flex uk-flex-middle">
<img src="assets/common-assets/sdg/sdg-dot-img.svg" alt="SDGs logo" loading="lazy" width="17px" height="17px"> <img src="assets/common-assets/sdg/sdg-dot-img.svg" alt="SDGs logo" loading="lazy" width="17px"
height="17px">
<span class="uk-margin-small-left">Sustainable Development Goals (SDG<span <span class="uk-margin-small-left">Sustainable Development Goals (SDG<span
class="uk-text-lowercase">s</span>)</span> class="uk-text-lowercase">s</span>)</span>
</span> </span>
</a> </a>
<a *ngIf="pluginObject.fos&& isRouteEnabled('/fields-of-science') " class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text" <a *ngIf="pluginObject.fos&& isRouteEnabled('/fields-of-science') "
class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
routerLinkActive="router-link-active" routerLink="/fields-of-science"> routerLinkActive="router-link-active" routerLink="/fields-of-science">
<span class="uk-flex uk-flex-middle"> <span class="uk-flex uk-flex-middle">
<img src="assets/common-assets/fos/fos-icon.svg" alt="FOS logo" loading="lazy" width="17px" height="8px"> <img src="assets/common-assets/fos/fos-icon.svg" alt="FOS logo" loading="lazy" width="17px"
height="8px">
<span class="uk-margin-small-left">Fields of Science (FoS)</span> <span class="uk-margin-small-left">Fields of Science (FoS)</span>
</span> </span>
</a> </a>
@ -56,11 +63,9 @@
</div> </div>
</div> </div>
</div>
</div>
<div> <div>
<div class="plugin-gateway-information uk-border-rounded uk-padding uk-margin-medium-bottom"> <div class="heroBackground generalSearchForm uk-border-rounded uk-padding uk-margin-medium-bottom">
<img class="plugin-background" src="assets/common-assets/connect_image_faded.png"> <!-- <img class="plugin-background" src="assets/common-assets/connect_image_faded.png">-->
<div class="plugin-content"> <div class="plugin-content">
<div class="uk-text-lead uk-text-large uk-text-bold uk-margin-bottom"> <div class="uk-text-lead uk-text-large uk-text-bold uk-margin-bottom">
{{ pluginObject.title}} {{ pluginObject.title}}
@ -156,7 +161,8 @@
isVisible('publications')"> isVisible('publications')">
<icon [name]="'description'" [type]="'outlined'" [ratio]="2" [flex]="true" <icon [name]="'description'" [type]="'outlined'" [ratio]="2" [flex]="true"
[customClass]="'uk-margin-small-right uk-text-secondary'"></icon> [customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('publications')" [routerLink]="properties.searchLinkToAdvancedResults" <a [queryParams]="getParamsForSearchLink('publications')"
[routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column"> class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall"> <span class="uk-text-xsmall">
{{openaireEntities.PUBLICATIONS}} {{openaireEntities.PUBLICATIONS}}
@ -218,10 +224,12 @@
<span class="uk-text-xsmall"> <span class="uk-text-xsmall">
{{openaireEntities.OTHER}} {{openaireEntities.OTHER}}
</span> </span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" [innerHTML]="resultCounts.other | numberRound: 1:1"> <span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.other | numberRound: 1:1">
</span> </span>
</a> </a>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>

View File

@ -12,7 +12,7 @@ export class PluginOpenAIREProducts extends PluginBaseInfo{
@Component({ @Component({
selector: 'plugin-openaire-products', selector: 'plugin-openaire-products',
template: ` template: `
<div *ngIf="pluginObject"> <div *ngIf="pluginObject" class="uk-container uk-section">
<h3>{{pluginObject.title}} </h3> <h3>{{pluginObject.title}} </h3>
<div *ngIf="services" uk-slider class="uk-slider"> <div *ngIf="services" uk-slider class="uk-slider">

View File

@ -1,7 +1,7 @@
<div *ngIf="pluginObject" #parent class="uk-section "> <div *ngIf="pluginObject" #parent class="heroBackground generalSearchForm ">
<div class="uk-container uk-container-large uk-margin-large-bottom"> <div class="uk-section uk-container ">
<div class="uk-width-1-1 uk-margin-medium-bottom"> <div class="uk-width-1-1 uk-margin-medium-bottom">
<h2 class="uk-margin-remove-top "> <h2 class="uk-margin-remove-top uk-text-center ">
{{pluginObject.title}}<span class="uk-text-primary">.</span> {{pluginObject.title}}<span class="uk-text-primary">.</span>
</h2> </h2>
</div> </div>
@ -12,10 +12,10 @@
<ng-container *ngIf="card.show"> <ng-container *ngIf="card.show">
<slider-nav-item [start]="i"> <slider-nav-item [start]="i">
<div class="uk-text-primary">{{card.tag}}</div> <div class="uk-text-primary">{{card.tag}}</div>
<h5 class="uk-margin-remove"> <div class="uk-margin-remove uk-text-large uk-text-bold">
{{card.title}} {{card.title}}
</h5> </div>
<div>{{card.description}}</div> <div class="uk-text-small">{{card.description}}</div>
</slider-nav-item> </slider-nav-item>
</ng-container> </ng-container>
</ng-container> </ng-container>

View File

@ -1,3 +1,7 @@
//slider-column slider-nav-item .uk-active{ //slider-column slider-nav-item .uk-active{
// border-left: solid 2px @primary-color; // border-left: solid 2px @primary-color;
//} //}
@slider-nav-item-background-active: white;
@slider-nav-item-action-background: rgba(255, 255, 255, 0.50);