[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,90 +1,95 @@
<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>
<div *ngIf="pluginObject.showTitle" <h1 *ngIf="pluginObject.showTitle" class=" uk-h2 uk-margin-remove">
class="uk-text-center uk-margin-top"> {{community.title}}
{{community.title}} </h1>
</div>
<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"
<advanced-search-input #advanced (searchEmitter)="goTo(true)"> class="uk-margin-medium-top">
<entities-selection class="uk-width-1-3" [simpleView]="true" currentEntity="result" <advanced-search-input #advanced (searchEmitter)="goTo(true)">
[selectedEntity]="selectedEntity" <entities-selection class="uk-width-1-3" [simpleView]="true" currentEntity="result"
(selectionChange)="entityChanged($event);advanced.focusNext(input, $event)" [selectedEntity]="selectedEntity"
(disableSelectEmitter)="disableSelectChange($event)" (selectionChange)="entityChanged($event);advanced.focusNext(input, $event)"
[onChangeNavigate]="false"></entities-selection> (disableSelectEmitter)="disableSelectChange($event)"
<div input #input class="uk-width-expand" placeholder="Scholary works" [searchable]="true" [onChangeNavigate]="false"></entities-selection>
[hint]="'Search in OpenAIRE'" [(value)]="keyword"></div> <div input #input class="uk-width-expand" placeholder="Scholary works" [searchable]="true"
</advanced-search-input> [hint]="'Search in OpenAIRE'" [(value)]="keyword"></div>
<div *ngIf="selectedEntity === 'result' && input.focused" </advanced-search-input>
(click)="$event.stopPropagation();advanced.focusNext(input, $event)" <div *ngIf="selectedEntity === 'result' && input.focused"
class="uk-dropdown uk-display-block uk-margin-small-top uk-width-auto" uk-dropdown="mode: click"> (click)="$event.stopPropagation();advanced.focusNext(input, $event)"
<div class="uk-padding-small"> class="uk-dropdown uk-display-block uk-margin-small-top uk-width-auto" uk-dropdown="mode: click">
<quick-selections [resultTypes]="resultTypes" [quickFilter]="resultsQuickFilter"></quick-selections> <div class="uk-padding-small">
</div> <quick-selections [resultTypes]="resultTypes" [quickFilter]="resultsQuickFilter"></quick-selections>
</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>
<div class="uk-text-meta"> <div
Try browsing by: *ngIf="(pluginObject.fos && isRouteEnabled('/fields-of-science')) || (pluginObject.sdgs && isRouteEnabled('/sdgs'))"
</div> class="uk-padding-small uk-margin-small-top">
<div class="link-actions uk-flex uk-flex-column uk-flex-top uk-margin-small-top"> <div class="uk-text-meta">
<a *ngIf="pluginObject.sdgs && isRouteEnabled('/sdgs')" class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text uk-margin-small-bottom" Try browsing by:
routerLinkActive="router-link-active" routerLink="/sdgs"> </div>
<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"
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') "
routerLinkActive="router-link-active" routerLink="/fields-of-science"> class="uk-display-inline-block uk-text-uppercase uk-button uk-button-text"
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>
</div>
</div> </div>
</div> </div>
</div>
</div>
<div>
<div class="plugin-gateway-information uk-border-rounded uk-padding uk-margin-medium-bottom">
<img class="plugin-background" src="assets/common-assets/connect_image_faded.png">
<div class="plugin-content">
<div class="uk-text-lead uk-text-large uk-text-bold uk-margin-bottom">
{{ pluginObject.title}}
</div>
<ng-container *ngIf="community"> </div>
<div *ngIf="isRouteEnabled('/curators') && isVisible('curators')" <div>
class="uk-text-small uk-margin-xsmall-bottom"> <div class="heroBackground generalSearchForm uk-border-rounded uk-padding uk-margin-medium-bottom">
<curators [longView]="false"></curators> <!-- <img class="plugin-background" src="assets/common-assets/connect_image_faded.png">-->
<div class="plugin-content">
<div class="uk-text-lead uk-text-large uk-text-bold uk-margin-bottom">
{{ pluginObject.title}}
</div> </div>
<div *ngIf="community.date && isVisible('date')" class="uk-text-small">
<span>Created: </span> {{community.date | date:'dd-MMM-yyyy'}} <ng-container *ngIf="community">
</div> <div *ngIf="isRouteEnabled('/curators') && isVisible('curators')"
<div class="uk-grid uk-grid-large uk-grid-stack uk-margin-top" uk-grid uk-height-match=".info-number"> class="uk-text-small uk-margin-xsmall-bottom">
<div> <curators [longView]="false"></curators>
<div *ngIf="projectTotal && projectTotal > 0 && isEntityEnabled('project') </div>
<div *ngIf="community.date && isVisible('date')" class="uk-text-small">
<span>Created: </span> {{community.date | date:'dd-MMM-yyyy'}}
</div>
<div class="uk-grid uk-grid-large uk-grid-stack uk-margin-top" uk-grid uk-height-match=".info-number">
<div>
<div *ngIf="projectTotal && projectTotal > 0 && isEntityEnabled('project')
&& isRouteEnabled(searchLinkToProjects) && isVisible('projects')" && isRouteEnabled(searchLinkToProjects) && isVisible('projects')"
class="uk-flex uk-flex-column uk-margin-bottom info-number"> class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params <a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active" routerLinkActive="router-link-active"
[routerLink]="searchLinkToProjects"> [routerLink]="searchLinkToProjects">
{{projectTotal|number}} {{projectTotal|number}}
</a> </a>
<span class="uk-flex uk-flex-middle uk-text-small"> <span class="uk-flex uk-flex-middle uk-text-small">
Projects Projects
<a *ngIf="projectsCalculated && (projectTotal && projectTotal > 0 && isEntityEnabled('project') && isRouteEnabled(searchLinkToProjects))" <a *ngIf="projectsCalculated && (projectTotal && projectTotal > 0 && isEntityEnabled('project') && isRouteEnabled(searchLinkToProjects))"
[title]="buildProjectsTooltip()" [title]="buildProjectsTooltip()"
@ -94,16 +99,16 @@
[customClass]="'uk-text-muted'"></icon> [customClass]="'uk-text-muted'"></icon>
</a> </a>
</span> </span>
</div> </div>
<div *ngIf="contentProviderTotal && contentProviderTotal > 0 && isEntityEnabled('datasource') && <div *ngIf="contentProviderTotal && contentProviderTotal > 0 && isEntityEnabled('datasource') &&
isRouteEnabled(searchLinkToDataProviders) && isVisible('datasources')" isRouteEnabled(searchLinkToDataProviders) && isVisible('datasources')"
class="uk-flex uk-flex-column info-number"> class="uk-flex uk-flex-column info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params <a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active" routerLinkActive="router-link-active"
[routerLink]="searchLinkToDataProviders"> [routerLink]="searchLinkToDataProviders">
{{contentProviderTotal|number}} {{contentProviderTotal|number}}
</a> </a>
<span class="uk-flex uk-flex-middle uk-text-small"> <span class="uk-flex uk-flex-middle uk-text-small">
Content Providers Content Providers
<a *ngIf="contentProvidersCalculated && (contentProviderTotal && contentProviderTotal > 0 && isEntityEnabled('datasource') && isRouteEnabled(searchLinkToDataProviders))" <a *ngIf="contentProvidersCalculated && (contentProviderTotal && contentProviderTotal > 0 && isEntityEnabled('datasource') && isRouteEnabled(searchLinkToDataProviders))"
[title]="buildContentProvidersTooltip()" [title]="buildContentProvidersTooltip()"
@ -113,17 +118,17 @@
[customClass]="'uk-text-muted'"></icon> [customClass]="'uk-text-muted'"></icon>
</a> </a>
</span> </span>
</div>
</div> </div>
</div> <div>
<div> <div *ngIf="(zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0) > 0) && isRouteEnabled(shareInZenodoPage)
<div *ngIf="(zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0) > 0) && isRouteEnabled(shareInZenodoPage)
&& isVisible('communities')" && isVisible('communities')"
class="uk-flex uk-flex-column uk-margin-bottom info-number"> class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove" [queryParams]=params <a class="uk-h5 uk-margin-remove" [queryParams]=params
routerLinkActive="router-link-active" [routerLink]="shareInZenodoPage"> routerLinkActive="router-link-active" [routerLink]="shareInZenodoPage">
{{zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0)}} {{zenodoCommunityIdS.length + ((masterZenodoCommunity) ? 1 : 0)}}
</a> </a>
<span class="uk-flex uk-flex-middle uk-text-small"> <span class="uk-flex uk-flex-middle uk-text-small">
Linked Zenodo Communities Linked Zenodo Communities
<a [title]="buildZenodoCommunitiesTooltip()" <a [title]="buildZenodoCommunitiesTooltip()"
[attr.uk-tooltip]="'pos: bottom-right; delay: 10;'" [attr.uk-tooltip]="'pos: bottom-right; delay: 10;'"
@ -132,95 +137,98 @@
[customClass]="'uk-text-muted'"></icon> [customClass]="'uk-text-muted'"></icon>
</a> </a>
</span> </span>
</div> </div>
<div <div
*ngIf="isRouteEnabled('/subjects') && displayedAllSubjects && displayedAllSubjects.length > 0 && isVisible('subjects')" *ngIf="isRouteEnabled('/subjects') && displayedAllSubjects && displayedAllSubjects.length > 0 && isVisible('subjects')"
class="uk-flex uk-flex-column uk-margin-bottom info-number"> class="uk-flex uk-flex-column uk-margin-bottom info-number">
<a class="uk-h5 uk-margin-remove" <a class="uk-h5 uk-margin-remove"
routerLinkActive="router-link-active" [routerLink]="'/subjects'"> routerLinkActive="router-link-active" [routerLink]="'/subjects'">
{{displayedAllSubjects.length}} {{displayedAllSubjects.length}}
</a> </a>
<span class="uk-text-small"> <span class="uk-text-small">
Subjects Subjects
</span> </span>
</div>
</div> </div>
</div> </div>
</div> </ng-container>
</ng-container> </div>
</div>
</div> </div>
<div *ngIf="community" class="plugin2 uk-flex uk-flex-middle uk-flex-wrap" style="grid-gap: 30px;"> <div *ngIf="community" class="plugin2 uk-flex uk-flex-middle uk-flex-wrap" style="grid-gap: 30px;">
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.publications > 0 && isEntityEnabled('publication') <div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.publications > 0 && isEntityEnabled('publication')
&& isRouteEnabled(searchLinkToResults) && && isRouteEnabled(searchLinkToResults) &&
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')"
class="uk-link-reset uk-flex uk-flex-column"> [routerLink]="properties.searchLinkToAdvancedResults"
class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall"> <span class="uk-text-xsmall">
{{openaireEntities.PUBLICATIONS}} {{openaireEntities.PUBLICATIONS}}
</span> </span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" <span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.publications | numberRound: 1:1"> [innerHTML]="resultCounts.publications | numberRound: 1:1">
</span> </span>
</a> </a>
</div> </div>
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset') <div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset')
&& isRouteEnabled(searchLinkToResults) && && isRouteEnabled(searchLinkToResults) &&
isVisible('datasets')"> isVisible('datasets')">
<icon [name]="'database'" [type]="'outlined'" [ratio]="2" [flex]="true" <icon [name]="'database'" [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('datasets')" [routerLink]="properties.searchLinkToAdvancedResults" <a [queryParams]="getParamsForSearchLink('datasets')" [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.DATASETS}} {{openaireEntities.DATASETS}}
</span> </span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" <span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.datasets | numberRound: 1:1"> [innerHTML]="resultCounts.datasets | numberRound: 1:1">
</span> </span>
</a> </a>
</div> </div>
<!--<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset') <!--<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.datasets > 0 && isEntityEnabled('dataset')
&& isRouteEnabled(searchLinkToResults) && && isRouteEnabled(searchLinkToResults) &&
isVisible('datasets')"> isVisible('datasets')">
<icon [name]="'database'" [type]="'outlined'" [ratio]="2" [flex]="true" [customClass]="'uk-margin-small-right uk-text-secondary'"></icon> <icon [name]="'database'" [type]="'outlined'" [ratio]="2" [flex]="true" [customClass]="'uk-margin-small-right uk-text-secondary'"></icon>
<a [queryParams]="getParamsForSearchLink('datasets')" [routerLink]="properties.searchLinkToAdvancedResults" class="uk-link-reset uk-flex uk-flex-column"> <a [queryParams]="getParamsForSearchLink('datasets')" [routerLink]="properties.searchLinkToAdvancedResults" class="uk-link-reset uk-flex uk-flex-column">
<span class="uk-text-xsmall"> <span class="uk-text-xsmall">
{{openaireEntities.DATASETS}} {{openaireEntities.DATASETS}}
</span> </span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" [innerHTML]="resultCounts.datasets | numberRound: 1:1"> <span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" [innerHTML]="resultCounts.datasets | numberRound: 1:1">
</span> </span>
</a> </a>
</div>--> </div>-->
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.software > 0 && isEntityEnabled('software') <div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.software > 0 && isEntityEnabled('software')
&& isRouteEnabled(searchLinkToResults) && && isRouteEnabled(searchLinkToResults) &&
isVisible('software')"> isVisible('software')">
<icon [name]="'integration_instructions'" [type]="'outlined'" [ratio]="2" [flex]="true" <icon [name]="'integration_instructions'" [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('software')" [routerLink]="properties.searchLinkToAdvancedResults" <a [queryParams]="getParamsForSearchLink('software')" [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.SOFTWARE}} {{openaireEntities.SOFTWARE}}
</span> </span>
<span *ngIf="resultCounts" class="uk-h6 uk-margin-remove" <span *ngIf="resultCounts" class="uk-h6 uk-margin-remove"
[innerHTML]="resultCounts.software | numberRound: 1:1"> [innerHTML]="resultCounts.software | numberRound: 1:1">
</span> </span>
</a> </a>
</div> </div>
<div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.other > 0 && isEntityEnabled('orp') <div class="uk-flex uk-flex-middle" *ngIf="resultCounts && resultCounts.other > 0 && isEntityEnabled('orp')
&& isRouteEnabled(searchLinkToResults) && && isRouteEnabled(searchLinkToResults) &&
isVisible('other')"> isVisible('other')">
<icon [name]="'integration_instructions'" [type]="'outlined'" [ratio]="2" [flex]="true" <icon [name]="'integration_instructions'" [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('other')" [routerLink]="properties.searchLinkToAdvancedResults" <a [queryParams]="getParamsForSearchLink('other')" [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.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>

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);