Filters title alignment. Rename some component css files to less.

This commit is contained in:
Konstantinos Triantafyllou 2022-07-17 16:01:39 +03:00
parent c5da95fb48
commit 01fd4ac49f
36 changed files with 320 additions and 319 deletions

View File

@ -91,7 +91,7 @@ export class DisplayClaimsComponent implements OnInit, OnDestroy {
ngOnInit() { ngOnInit() {
if (typeof document !== "undefined" && this.actions) { if (typeof document !== "undefined" && this.actions) {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--structure-header-height')); this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--header-height'));
} }
this.entities = []; this.entities = [];
this.filterForm = this._fb.group({ this.filterForm = this._fb.group({

View File

@ -12,16 +12,11 @@ import {PiwikService} from "../../utils/piwik/piwik.service";
import {Subscriber} from "rxjs"; import {Subscriber} from "rxjs";
import {properties} from "../../../../environments/environment"; import {properties} from "../../../../environments/environment";
import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component"; import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
import {MetricsService} from "../../services/metrics.service";
import {OpenaireEntities} from "../../utils/properties/searchFields"; import {OpenaireEntities} from "../../utils/properties/searchFields";
declare var UIkit:any;
@Component({ @Component({
selector: 'linking-generic', selector: 'linking-generic',
templateUrl: 'linkingGeneric.component.html', templateUrl: 'linkingGeneric.component.html'
styleUrls:[ 'linkingGeneric.component.css']
}) })
export class LinkingGenericComponent { export class LinkingGenericComponent {
@Input() piwikSiteId = null; @Input() piwikSiteId = null;

View File

@ -6,14 +6,16 @@ declare var UIkit;
selector: '[page-content]', selector: '[page-content]',
template: ` template: `
<div id="page_content"> <div id="page_content">
<div id="page_content_header" #header [attr.uk-sticky]="(headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset"> <div id="page_content_header" #header [class.uk-blur-background]="headerSticky && isStickyActive"
[attr.uk-sticky]="(headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset">
<div class="uk-container uk-container-large"> <div class="uk-container uk-container-large">
<div class="uk-padding-small uk-padding-remove-vertical"> <div class="uk-padding-small uk-padding-remove-vertical">
<ng-content select="[header]"></ng-content> <ng-content select="[header]"></ng-content>
</div> </div>
</div> </div>
</div> </div>
<div id="page_content_actions" #actions [attr.uk-sticky]="(!headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset"> <div id="page_content_actions" #actions [class.uk-blur-background]="!headerSticky && isStickyActive"
[attr.uk-sticky]="(!headerSticky && shouldSticky)?'media: @m':null" [attr.offset]="offset">
<div class="uk-container uk-container-large"> <div class="uk-container uk-container-large">
<div class="uk-padding-small uk-padding-remove-vertical"> <div class="uk-padding-small uk-padding-remove-vertical">
<ng-content select="[actions]"></ng-content> <ng-content select="[actions]"></ng-content>
@ -43,7 +45,7 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy {
ngOnInit() { ngOnInit() {
if (typeof document !== "undefined") { if (typeof document !== "undefined") {
this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--structure-header-height')); this.offset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--header-height'));
} }
} }

View File

@ -4,8 +4,8 @@
<div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid> <div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid>
<!-- left box - actions --> <!-- left box - actions -->
<div *ngIf="dataProviderInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s uk-padding-remove-horizontal"> <div id="landing-left-sidebar" *ngIf="dataProviderInfo" class="uk-visible@s uk-padding-remove-horizontal">
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-sidebar-height uk-sticky" <div class="uk-flex uk-flex-column uk-flex-between uk-flex-center uk-sticky"
uk-sticky="bottom: true" [attr.offset]="offset"> uk-sticky="bottom: true" [attr.offset]="offset">
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between"> <div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
<ng-container *ngIf="dataProviderInfo && hasMetrics"> <ng-container *ngIf="dataProviderInfo && hasMetrics">
@ -23,7 +23,7 @@
<li class="uk-text-center"> <li class="uk-text-center">
<a (click)="openAddThisModal()" <a (click)="openAddThisModal()"
[title]="'Share this '+openaireEntities.DATASOURCE+' in your social networks'" [title]="'Share this '+openaireEntities.DATASOURCE+' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
@ -36,7 +36,7 @@
<!-- center box--> <!-- center box-->
<div class="uk-width-expand uk-padding-remove uk-background-default"> <div class="uk-width-expand uk-padding-remove uk-background-default">
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-flex-middle"> <div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top" <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
role="alert">{{errorMessage}}</div> role="alert">{{errorMessage}}</div>
<div *ngIf="showLoading" class="uk-position-center"> <div *ngIf="showLoading" class="uk-position-center">
@ -65,7 +65,7 @@
</div> </div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
uk-sticky="bottom: true;" [attr.offset]="graph_offset"> uk-sticky="bottom: true;" [attr.offset]="graph_offset">
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container> <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
</div> </div>
@ -84,7 +84,7 @@
<div> <div>
<a (click)="openAddThisModal()" <a (click)="openAddThisModal()"
[title]="'Share this '+openaireEntities.DATASOURCE+' in your social networks'" [title]="'Share this '+openaireEntities.DATASOURCE+' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
@ -102,34 +102,42 @@
</landing-header> </landing-header>
<!-- Labels --> <!-- Labels -->
<div class="uk-margin-bottom uk-margin-remove-left uk-grid uk-grid-small uk-flex-middle" uk-grid> <div class="uk-margin-bottom uk-grid uk-grid-small uk-flex-middle" uk-grid>
<ng-container *ngIf="dataProviderInfo.compatibility && <ng-container *ngIf="dataProviderInfo.compatibility &&
!(dataProviderInfo.compatibility.info == 'not available' && type == 'service')"> !(dataProviderInfo.compatibility.info == 'not available' && type == 'service')">
<span class="uk-label uk-text-truncate" title="Compatibility"> <div>
<a *ngIf="dataProviderInfo.compatibility.id" <span class="uk-label uk-text-truncate" title="Compatibility">
[queryParams]="{datasourceId: dataProviderInfo.compatibility.id}" routerLinkActive="router-link-active" <a *ngIf="dataProviderInfo.compatibility.id"
[routerLink]="properties.searchLinkToDataProvider.split('?')[0]"> [queryParams]="{datasourceId: dataProviderInfo.compatibility.id}" routerLinkActive="router-link-active"
{{dataProviderInfo.compatibility.info}} [routerLink]="properties.searchLinkToDataProvider.split('?')[0]">
<ng-container *ngIf="dataProviderInfo.compatibility.name">{{dataProviderInfo.compatibility.name}}</ng-container> {{dataProviderInfo.compatibility.info}}
</a> <ng-container *ngIf="dataProviderInfo.compatibility.name">{{dataProviderInfo.compatibility.name}}</ng-container>
<span *ngIf="!dataProviderInfo.compatibility.id"> </a>
{{dataProviderInfo.compatibility.info}} <span *ngIf="!dataProviderInfo.compatibility.id">
{{dataProviderInfo.compatibility.info}}
</span>
<span *ngIf="dataProviderInfo.compatibility.name && !dataProviderInfo.compatibility.id">
{{dataProviderInfo.compatibility.name}}
</span>
</span> </span>
<span *ngIf="dataProviderInfo.compatibility.name && !dataProviderInfo.compatibility.id"> </div>
{{dataProviderInfo.compatibility.name}}
</span>
</span>&#160;
</ng-container> </ng-container>
<ng-container *ngIf="dataProviderInfo.aggregationStatus && dataProviderInfo.aggregationStatus.fulltexts && dataProviderInfo.aggregationStatus.fulltexts > 0"> <ng-container *ngIf="dataProviderInfo.aggregationStatus && dataProviderInfo.aggregationStatus.fulltexts && dataProviderInfo.aggregationStatus.fulltexts > 0">
<span class="uk-label uk-text-truncate">OpenAIRE Text Mining</span>&#160; <div>
<span class="uk-label uk-text-truncate">OpenAIRE Text Mining</span>
</div>
</ng-container> </ng-container>
<ng-container *ngIf="dataProviderInfo.countries && removeUnknown(dataProviderInfo.countries).length > 0"> <ng-container *ngIf="dataProviderInfo.countries && removeUnknown(dataProviderInfo.countries).length > 0">
<ng-container *ngFor="let country of removeUnknown(dataProviderInfo.countries)"> <ng-container *ngFor="let country of removeUnknown(dataProviderInfo.countries)">
<span class="uk-label label-country" title="Country">{{country}}</span>&#160; <div>
<span class="uk-label label-country" title="Country">{{country}}</span>
</div>
</ng-container> </ng-container>
</ng-container> </ng-container>
<ng-container *ngIf="dataProviderInfo.thematic"> <ng-container *ngIf="dataProviderInfo.thematic">
<span class="uk-label uk-text-truncate">Thematic</span> <div>
<span class="uk-label uk-text-truncate">Thematic</span>
</div>
</ng-container> </ng-container>
</div> </div>
@ -149,9 +157,8 @@
</div> </div>
</div> </div>
<div id="main-tabs-div" <div id="main-tabs-div" class="uk-sticky uk-blur-background"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset" uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
cls-active="active">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom"> <div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<landing-header *ngIf="stickyHeader" class="uk-visible@m" <landing-header *ngIf="stickyHeader" class="uk-visible@m"
[properties]="properties" [title]="dataProviderInfo.title.name" [properties]="properties" [title]="dataProviderInfo.title.name"

View File

@ -65,4 +65,4 @@ export class FosComponent {
public urlEncodeAndQuote(str: string): string { public urlEncodeAndQuote(str: string): string {
return StringUtils.quote(StringUtils.URIEncode(str)); return StringUtils.quote(StringUtils.URIEncode(str));
} }
} }

View File

@ -1,40 +0,0 @@
.metrics {
position: relative;
display: inline-block;
--text-gradient-color: linear-gradient(92deg, var(--primary-light-color) 0, var(--primary-dark-color) 100%);
}
.metrics .uk-dropdown:before {
position: absolute;
left: 0;
transform: translateX(-100%);
top: 14px;
width: 0;
height: 0;
content: '';
border-left: 21px solid transparent;
border-right: 21px solid var(--muted-color);
border-bottom: 21px solid transparent;
border-top: 21px solid transparent;
}
.metrics .uk-dropdown:after {
position: absolute;
left: 0;
transform: translateX(-100%);
top: 15px;
width: 0;
height: 0;
content: '';
border-left: 20px solid transparent;
border-right: 20px solid var(--default-color);
border-bottom: 20px solid transparent;
border-top: 20px solid transparent;
}
.metrics .m-badge .number {
font-size: 18px;
color: var(--primary-color);
font-weight: 700;
text-align: center;
}

View File

@ -0,0 +1,48 @@
.metrics {
@import (reference) "~src/assets/openaire-theme/less/_import-variables";
position: relative;
display: inline-block;
.uk-text-primary {
color: @global-primary-background !important;
}
.uk-text-background {
background-image: @global-primary-gradient;
}
.uk-dropdown {
&::before {
position: absolute;
left: 0;
transform: translateX(-100%);
top: 14px;
width: 0;
height: 0;
content: '';
border-left: 21px solid transparent;
border-right: 21px solid @global-border;
border-bottom: 21px solid transparent;
border-top: 21px solid transparent;
}
&::after {
position: absolute;
left: 0;
transform: translateX(-100%);
top: 15px;
width: 0;
height: 0;
content: '';
border-left: 20px solid transparent;
border-right: 20px solid @global-background;
border-bottom: 20px solid transparent;
border-top: 20px solid transparent;
}
}
.m-badge img {
width: 35px;
}
}

View File

@ -11,12 +11,11 @@ import {OpenaireEntities} from "../../../utils/properties/searchFields";
@Component({ @Component({
selector: 'metrics', selector: 'metrics',
styleUrls: ['metrics.component.css'],
template: ` template: `
<div *ngIf="metrics && (pageViews >0 || metrics.totalViews > 0|| metrics.totalDownloads >0)" class="metrics"> <div *ngIf="metrics && (pageViews >0 || metrics.totalViews > 0|| metrics.totalDownloads >0)" class="metrics">
<a class="m-badge uk-link-reset uk-display-block" (click)="clickedMetrics()"> <a class="m-badge uk-link-reset uk-display-block" (click)="clickedMetrics()">
<img src="assets/common-assets/logo-small-usage-counts.png" loading="lazy" alt="usage counts"> <img src="assets/common-assets/logo-small-usage-counts.png" loading="lazy" alt="usage counts">
<div class="number"> <div class="uk-margin-xsmall-top uk-text-primary uk-text-small uk-text-bold uk-text-center">
<ng-container *ngIf="isNumberLarge(total, true); else notFormattedTotal">{{formatNumber(total)}}</ng-container> <ng-container *ngIf="isNumberLarge(total, true); else notFormattedTotal">{{formatNumber(total)}}</ng-container>
<ng-template #notFormattedTotal>{{total | number}}</ng-template> <ng-template #notFormattedTotal>{{total | number}}</ng-template>
</div> </div>
@ -124,7 +123,8 @@ import {OpenaireEntities} from "../../../utils/properties/searchFields";
</div> </div>
</div> </div>
</div> </div>
` `,
styleUrls: ['metrics.component.less']
}) })
export class MetricsComponent { export class MetricsComponent {

View File

@ -19,11 +19,7 @@ export class ParsingFunctions {
private notebookKeyword: string = "eosc jupyter notebook"; private notebookKeyword: string = "eosc jupyter notebook";
private notebook_label: string = "EOSC"; private notebook_label: string = "EOSC";
private notebook_value: string = "EOSC Jupyter Notebook"; private notebook_value: string = "EOSC Jupyter Notebook";
// public open = 'assets/common-assets/unlock.svg';
// public closed = 'assets/common-assets/lock.svg';
// public unknown = 'assets/common-assets/question.svg';
public open = 'lock_open'; public open = 'lock_open';
public closed = 'lock'; public closed = 'lock';
public unknown = 'question_mark'; public unknown = 'question_mark';

View File

@ -70,4 +70,4 @@ export class SdgComponent {
public urlEncodeAndQuote(str: string): string { public urlEncodeAndQuote(str: string): string {
return StringUtils.quote(StringUtils.URIEncode(str)); return StringUtils.quote(StringUtils.URIEncode(str));
} }
} }

View File

@ -3,8 +3,8 @@
<div class="organization"> <div class="organization">
<div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid> <div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid>
<!-- left column --> <!-- left column -->
<div *ngIf="organizationInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s uk-padding-remove-horizontal"> <div id="landing-left-sidebar" *ngIf="organizationInfo" class="uk-visible@s uk-padding-remove-horizontal">
<div class="uk-flex uk-flex-column uk-flex-right landing-sidebar-height uk-sticky" <div class="uk-flex uk-flex-column uk-flex-right uk-sticky"
uk-sticky="bottom: true" [attr.offset]="offset"> uk-sticky="bottom: true" [attr.offset]="offset">
<div class="uk-margin-large-bottom uk-align-center"> <div class="uk-margin-large-bottom uk-align-center">
<div class="uk-text-meta uk-text-uppercase">Actions</div> <div class="uk-text-meta uk-text-uppercase">Actions</div>
@ -12,7 +12,7 @@
<!-- Share --> <!-- Share -->
<li class="uk-text-center"> <li class="uk-text-center">
<a (click)="openAddThisModal()" [title]="'Share this '+openaireEntities.ORGANIZATION+' in your social networks'" <a (click)="openAddThisModal()" [title]="'Share this '+openaireEntities.ORGANIZATION+' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
@ -21,7 +21,7 @@
<!-- Download --> <!-- Download -->
<li class="uk-text-center" <li class="uk-text-center"
[title]="'Download reports'" [title]="'Download reports'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()"> <a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="download" visuallyHidden="download"></icon> <icon name="download" visuallyHidden="download"></icon>
@ -34,7 +34,7 @@
</div> </div>
<!-- center/right column --> <!-- center/right column -->
<div class="uk-width-expand uk-padding-remove uk-background-default"> <div class="uk-width-expand uk-padding-remove uk-background-default">
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-flex-middle"> <div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top" <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
role="alert">{{errorMessage}}</div> role="alert">{{errorMessage}}</div>
<div *ngIf="showLoading" class="uk-position-center"> <div *ngIf="showLoading" class="uk-position-center">
@ -63,7 +63,7 @@
</div> </div>
</div> </div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
uk-sticky="bottom: true;" [attr.offset]="graph_offset"> uk-sticky="bottom: true;" [attr.offset]="graph_offset">
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container> <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
</div> </div>
@ -81,14 +81,14 @@
<div class="uk-flex uk-flex-right uk-margin-medium-bottom uk-hidden@s"> <div class="uk-flex uk-flex-right uk-margin-medium-bottom uk-hidden@s">
<div class="uk-margin-small-right"> <div class="uk-margin-small-right">
<a (click)="openAddThisModal()" [title]="'Share this '+openaireEntities.ORGANIZATION+' in your social networks'" <a (click)="openAddThisModal()" [title]="'Share this '+openaireEntities.ORGANIZATION+' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
</a> </a>
</div> </div>
<div [title]="'Download reports'" <div [title]="'Download reports'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()"> <a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="buildFunderOptions(); openDownloadReportsModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="download" visuallyHidden="download"></icon> <icon name="download" visuallyHidden="download"></icon>
@ -128,7 +128,8 @@
</div> </div>
</div> </div>
<!-- Tabs section --> <!-- Tabs section -->
<div id="main-tabs-div" uk-sticky="bottom: true; media: @m" [attr.offset]="offset" cls-active="active"> <div id="main-tabs-div" class="uk-sticky uk-blur-background"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom"> <div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<!-- <showTitle *ngIf="stickyHeader" [titleName]="organizationInfo.title.name" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>--> <!-- <showTitle *ngIf="stickyHeader" [titleName]="organizationInfo.title.name" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
<landing-header *ngIf="stickyHeader" class="uk-visible@m" <landing-header *ngIf="stickyHeader" class="uk-visible@m"

View File

@ -4,8 +4,8 @@
<div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid> <div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid>
<!-- left box - actions --> <!-- left box - actions -->
<div *ngIf="projectInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s uk-padding-remove-horizontal"> <div id="landing-left-sidebar" *ngIf="projectInfo" class="uk-visible@s uk-padding-remove-horizontal">
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-sidebar-height uk-sticky" <div class="uk-flex uk-flex-column uk-flex-between uk-flex-center uk-sticky"
uk-sticky="bottom: true" [attr.offset]="offset"> uk-sticky="bottom: true" [attr.offset]="offset">
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between"> <div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
<ng-container *ngIf="projectInfo && hasMetrics"> <ng-container *ngIf="projectInfo && hasMetrics">
@ -23,7 +23,7 @@
<li class="uk-text-center"> <li class="uk-text-center">
<a (click)="openAddThisModal()" <a (click)="openAddThisModal()"
[title]="'Share this '+openaireEntities.PROJECT+' in your social networks'" [title]="'Share this '+openaireEntities.PROJECT+' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
@ -32,7 +32,7 @@
<!-- Link to --> <!-- Link to -->
<li *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-text-center" <li *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-text-center"
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this project to '+openaireEntities.RESULTS+'<span class=\'material-icons uk-margin-small-left\'>east</span></span>'" [title]="'<span class=\'uk-flex uk-flex-middle\'>Link this project to '+openaireEntities.RESULTS+'<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[projectId, 'project','result'])" <a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[projectId, 'project','result'])"
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"> routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
@ -42,7 +42,7 @@
</li> </li>
<li *ngIf="isRouteAvailable('participate/deposit/learn-how')" class="uk-text-center" <li *ngIf="isRouteAvailable('participate/deposit/learn-how')" class="uk-text-center"
[title]="'<span class=\'uk-flex uk-flex-middle\'>Deposit your research <span class=\'material-icons uk-margin-small-left\'>east</span></span>'" [title]="'<span class=\'uk-flex uk-flex-middle\'>Deposit your research <span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a routerLinkActive="router-link-active" routerLink="/participate/deposit/learn-how"> <a routerLinkActive="router-link-active" routerLink="/participate/deposit/learn-how">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="upload" visuallyHidden="upload"></icon> <icon name="upload" visuallyHidden="upload"></icon>
@ -51,7 +51,7 @@
</li> </li>
<li class="uk-text-center" <li class="uk-text-center"
[title]="'Embed results'" [title]="'Embed results'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openEmbedResultsModal()"> <a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openEmbedResultsModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="code_off" visuallyHidden="code"></icon> <icon name="code_off" visuallyHidden="code"></icon>
@ -61,7 +61,7 @@
</li> </li>
<li class="uk-text-center" <li class="uk-text-center"
[title]="'Download report'" [title]="'Download report'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportModal()"> <a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="download" visuallyHidden="download"></icon> <icon name="download" visuallyHidden="download"></icon>
@ -75,7 +75,7 @@
<!-- center box--> <!-- center box-->
<div class="uk-width-expand uk-padding-remove uk-background-default"> <div class="uk-width-expand uk-padding-remove uk-background-default">
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-flex-middle"> <div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top" <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
role="alert">{{errorMessage}}</div> role="alert">{{errorMessage}}</div>
<div *ngIf="showLoading" class="uk-position-center"> <div *ngIf="showLoading" class="uk-position-center">
@ -104,7 +104,7 @@
</div> </div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
uk-sticky="bottom: true;" [attr.offset]="graph_offset"> uk-sticky="bottom: true;" [attr.offset]="graph_offset">
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container> <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
</div> </div>
@ -121,7 +121,7 @@
<div class="uk-margin-small-right"> <div class="uk-margin-small-right">
<a (click)="openAddThisModal()" <a (click)="openAddThisModal()"
[title]="'Share this '+openaireEntities.PROJECT+' in your social networks'" [title]="'Share this '+openaireEntities.PROJECT+' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
@ -129,7 +129,7 @@
</div> </div>
<div *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-margin-small-right" <div *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-margin-small-right"
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this project to '+openaireEntities.RESULTS+'<span class=\'material-icons uk-margin-small-left\'>east</span></span>'" [title]="'<span class=\'uk-flex uk-flex-middle\'>Link this project to '+openaireEntities.RESULTS+'<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[projectId, 'project','result'])" <a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[projectId, 'project','result'])"
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"> routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
@ -139,7 +139,7 @@
</div> </div>
<div *ngIf="isRouteAvailable('participate/deposit/learn-how')" class="uk-margin-small-right" <div *ngIf="isRouteAvailable('participate/deposit/learn-how')" class="uk-margin-small-right"
[title]="'<span class=\'uk-flex uk-flex-middle\'>Deposit your research <span class=\'material-icons uk-margin-small-left\'>east</span></span>'" [title]="'<span class=\'uk-flex uk-flex-middle\'>Deposit your research <span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a routerLinkActive="router-link-active" routerLink="/participate/deposit/learn-how"> <a routerLinkActive="router-link-active" routerLink="/participate/deposit/learn-how">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="upload" visuallyHidden="upload"></icon> <icon name="upload" visuallyHidden="upload"></icon>
@ -148,7 +148,7 @@
</div> </div>
<div class="uk-margin-small-right" <div class="uk-margin-small-right"
[title]="'Embed results'" [title]="'Embed results'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openEmbedResultsModal()"> <a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openEmbedResultsModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="code_off" visuallyHidden="code"></icon> <icon name="code_off" visuallyHidden="code"></icon>
@ -157,7 +157,7 @@
</div> </div>
<div class="" <div class=""
[title]="'Download report'" [title]="'Download report'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportModal()"> <a class="uk-link-text uk-text-bold uk-text-uppercase" (click)="openDownloadReportModal()">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="download" visuallyHidden="download"></icon> <icon name="download" visuallyHidden="download"></icon>
@ -176,27 +176,35 @@
[status]="projectInfo.status"> [status]="projectInfo.status">
</landing-header> </landing-header>
<!-- Labels --> <!-- Labels -->
<div class="uk-margin-bottom uk-margin-remove-left uk-grid uk-grid-small uk-flex-middle" uk-grid> <div class="uk-margin-bottom uk-grid uk-grid-small uk-flex-middle" uk-grid>
<ng-container *ngIf="projectInfo.openAccessMandatePublications != undefined && projectInfo.openAccessMandatePublications && projectInfo.openAccessMandateDatasets != undefined && projectInfo.openAccessMandateDatasets"> <ng-container *ngIf="projectInfo.openAccessMandatePublications != undefined && projectInfo.openAccessMandatePublications && projectInfo.openAccessMandateDatasets != undefined && projectInfo.openAccessMandateDatasets">
<span class="uk-label uk-label-success uk-text-truncate" <div>
title="Open Access mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}}"> <span class="uk-label uk-label-success uk-text-truncate"
Open Access mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}} title="Open Access mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}}">
</span>&#160; Open Access mandate for {{openaireEntities.PUBLICATIONS}} and {{openaireEntities.DATASETS}}
</span>
</div>
</ng-container> </ng-container>
<ng-container *ngIf="projectInfo.openAccessMandatePublications != undefined && projectInfo.openAccessMandatePublications && (projectInfo.openAccessMandateDatasets == undefined || !projectInfo.openAccessMandateDatasets)"> <ng-container *ngIf="projectInfo.openAccessMandatePublications != undefined && projectInfo.openAccessMandatePublications && (projectInfo.openAccessMandateDatasets == undefined || !projectInfo.openAccessMandateDatasets)">
<span class="uk-label uk-label-success uk-text-truncate" title="Open Access mandate for {{openaireEntities.PUBLICATIONS}}"> <div>
Open Access mandate for {{openaireEntities.PUBLICATIONS}} <span class="uk-label uk-label-success uk-text-truncate" title="Open Access mandate for {{openaireEntities.PUBLICATIONS}}">
</span>&#160; Open Access mandate for {{openaireEntities.PUBLICATIONS}}
</span>
</div>
</ng-container> </ng-container>
<ng-container *ngIf="projectInfo.openAccessMandateDatasets != undefined && projectInfo.openAccessMandateDatasets && (projectInfo.openAccessMandatePublications == undefined || !projectInfo.openAccessMandatePublications)"> <ng-container *ngIf="projectInfo.openAccessMandateDatasets != undefined && projectInfo.openAccessMandateDatasets && (projectInfo.openAccessMandatePublications == undefined || !projectInfo.openAccessMandatePublications)">
<span class="uk-label uk-label-success uk-text-truncate" title="Open Access mandate for {{openaireEntities.DATASETS}}"> <div>
Open Access mandate for {{openaireEntities.DATASETS}} <span class="uk-label uk-label-success uk-text-truncate" title="Open Access mandate for {{openaireEntities.DATASETS}}">
</span>&#160; Open Access mandate for {{openaireEntities.DATASETS}}
</span>
</div>
</ng-container> </ng-container>
<ng-container *ngIf="projectInfo.funding && projectInfo.funding.funderName"> <ng-container *ngIf="projectInfo.funding && projectInfo.funding.funderName">
<span class="uk-label custom-label label-funder" title="Funder"> <div>
{{projectInfo.funding.funderName}} <span class="uk-label custom-label label-funder" title="Funder">
</span>&#160; {{projectInfo.funding.funderName}}
</span>
</div>
</ng-container> </ng-container>
<!-- <ng-container *ngIf="projectInfo.specialClause39">--> <!-- <ng-container *ngIf="projectInfo.specialClause39">-->
<!-- <span class="uk-label custom-label label-sc39" title="Special Clause 39">--> <!-- <span class="uk-label custom-label label-sc39" title="Special Clause 39">-->
@ -286,9 +294,8 @@
</div> </div>
</div> </div>
<div id="main-tabs-div" <div id="main-tabs-div" class="uk-sticky uk-blur-background"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset" uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
cls-active="active">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom"> <div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<!-- <showTitle *ngIf="stickyHeader" [titleName]="projectName" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>--> <!-- <showTitle *ngIf="stickyHeader" [titleName]="projectName" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
<landing-header *ngIf="stickyHeader" class="uk-visible@m" <landing-header *ngIf="stickyHeader" class="uk-visible@m"
@ -324,41 +331,43 @@
<div id="landing-sections" class="uk-text-small"> <div id="landing-sections" class="uk-text-small">
<div id="summary" class="landing-section landing-section-height-auto"> <div id="summary" class="landing-section landing-section-height-auto">
<div class="uk-card uk-card-default card-tab uk-grid uk-margin-remove-left uk-margin-medium-top uk-margin-medium-bottom"> <div class="uk-card uk-card-default card-tab uk-margin-medium-top uk-margin-medium-bottom">
<div *ngIf="!hasPrimaryInfo && !hasSecondaryInfo" class="uk-width-expand uk-height-small uk-flex uk-flex-center uk-flex-middle"> <div class="uk-card-body">
<div class="uk-animation-fade uk-text-meta uk-text-large"> <div class="uk-grid uk-grid-divider" uk-grid>
No summary information available <div *ngIf="!hasPrimaryInfo && !hasSecondaryInfo" class="uk-width-expand uk-height-small uk-flex uk-flex-center uk-flex-middle">
</div> <div class="uk-animation-fade uk-text-meta uk-text-large">
</div> No summary information available
<div *ngIf="hasPrimaryInfo" class="uk-width-expand uk-padding uk-inline">
<!-- Description -->
<div *ngIf="projectInfo.description && projectInfo.description.length > 0"
class="uk-margin-medium-bottom">
<div class="uk-text-justify ">
<div class="uk-text-meta uk-margin-small-bottom">Description</div>
<div class=" uk-height-max-medium uk-overflow-auto">
<div *ngFor="let description of projectInfo.description" class="uk-margin-small-bottom "
[innerHtml]="description"></div>
</div> </div>
</div> </div>
</div> <div *ngIf="hasPrimaryInfo" class="uk-width-expand">
</div> <!-- Description -->
<div *ngIf="hasSecondaryInfo" <div class="uk-margin-medium-bottom">
[class]="'uk-inline uk-padding uk-padding-remove-horizontal ' + (hasPrimaryInfo?'uk-width-1-3@m': 'uk-width-expand')"> <div class="uk-text-justify ">
<div class="uk-padding uk-padding-remove-vertical uk-height-1-1" [class.separator-in-tab]="hasPrimaryInfo"> <div class="uk-text-meta uk-margin-small-bottom">Description</div>
<!-- Organizations --> <div class=" uk-height-max-medium uk-overflow-auto">
<div class="uk-text-meta uk-margin-small-bottom">Partners</div> <div *ngFor="let description of projectInfo.description" class="uk-margin-small-bottom "
<div class="uk-margin-medium-bottom"> [innerHtml]="description"></div>
<ng-container *ngTemplateOutlet="organizations_template; context: { threshold: lessBtnOrganizations ? projectInfo.organizations.length : thresholdOrganizations }"></ng-container> </div>
<div *ngIf="projectInfo.organizations.length > thresholdOrganizations && !lessBtnOrganizations"
class="uk-text-center"> </div>
<a (click)="viewAllOrganizationsClick();" class="view-more-less-link">
View all
</a>
</div> </div>
<div *ngIf="viewAllOrganizations && lessBtnOrganizations" class="uk-text-center"> </div>
<a (click)="viewAllOrganizations = !viewAllOrganizations; lessBtnOrganizations=false;" class="view-more-less-link">View less</a> <div *ngIf="hasSecondaryInfo" [class.uk-width-1-3@m]="hasPrimaryInfo" class="uk-width-1-1">
<div class="uk-height-1-1">
<!-- Organizations -->
<div class="uk-text-meta uk-margin-small-bottom">Partners</div>
<div class="uk-margin-medium-bottom">
<ng-container *ngTemplateOutlet="organizations_template; context: { threshold: lessBtnOrganizations ? projectInfo.organizations.length : thresholdOrganizations }"></ng-container>
<div *ngIf="projectInfo.organizations.length > thresholdOrganizations && !lessBtnOrganizations"
class="uk-text-center">
<a (click)="viewAllOrganizationsClick();" class="view-more-less-link">
View all
</a>
</div>
<div *ngIf="viewAllOrganizations && lessBtnOrganizations" class="uk-text-center">
<a (click)="viewAllOrganizations = !viewAllOrganizations; lessBtnOrganizations=false;" class="view-more-less-link">View less</a>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@ -4,8 +4,8 @@
<div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid> <div *ngIf="!showFeedback" class="uk-grid uk-margin-remove-left" uk-grid>
<!-- left box/sidebar - actions --> <!-- left box/sidebar - actions -->
<div *ngIf="resultLandingInfo" class="landing-left-sidebar-width landing-left-sidebar-border landing-background-light-color uk-visible@s uk-padding-remove-horizontal"> <div id="landing-left-sidebar" *ngIf="resultLandingInfo" class="uk-visible@s uk-padding-remove-horizontal">
<div class="uk-flex uk-flex-column uk-flex-between uk-flex-center landing-sidebar-height uk-sticky" <div class="uk-flex uk-flex-column uk-flex-between uk-flex-center uk-sticky"
uk-sticky="bottom: true" [attr.offset]="offset"> uk-sticky="bottom: true" [attr.offset]="offset">
<div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between"> <div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
<ng-container *ngIf="resultLandingInfo && (hasAltMetrics || hasMetrics)"> <ng-container *ngIf="resultLandingInfo && (hasAltMetrics || hasMetrics)">
@ -25,7 +25,7 @@
<li class="uk-text-center"> <li class="uk-text-center">
<a (click)="openAddThisModal()" <a (click)="openAddThisModal()"
[title]="'Share this '+getTypeName() + ' in your social networks'" [title]="'Share this '+getTypeName() + ' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
@ -34,7 +34,7 @@
<!-- Link to --> <!-- Link to -->
<li *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-text-center" <li *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-text-center"
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this '+getTypeName()+' to ...<span class=\'material-icons uk-margin-small-left\'>east</span></span>'" [title]="'<span class=\'uk-flex uk-flex-middle\'>Link this '+getTypeName()+' to ...<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])" <a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])"
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"> routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
@ -46,7 +46,7 @@
<li class="uk-text-center"> <li class="uk-text-center">
<a (click)="openCiteModal()" <a (click)="openCiteModal()"
[title]="'Cite this '+getTypeName()" [title]="'Cite this '+getTypeName()"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="quotes" visuallyHidden="cite"></icon> <icon name="quotes" visuallyHidden="cite"></icon>
</span> </span>
@ -72,7 +72,7 @@
<!-- center box--> <!-- center box-->
<div class="uk-width-expand uk-padding-remove uk-background-default"> <div class="uk-width-expand uk-padding-remove uk-background-default">
<div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-flex-middle"> <div *ngIf="errorMessage.length > 0 || showLoading" class="uk-container uk-flex uk-flex-center uk-height-viewport uk-position-relative">
<div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top" <div *ngIf="errorMessage.length > 0" class="uk-alert uk-alert-danger uk-width-2-3 uk-margin-xlarge-top"
role="alert">{{errorMessage}}</div> role="alert">{{errorMessage}}</div>
<div *ngIf="showLoading" class="uk-position-center"> <div *ngIf="showLoading" class="uk-position-center">
@ -101,7 +101,7 @@
</div> </div>
</ng-template> </ng-template>
<div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-text-xsmall uk-visible@m" <div #graph_and_feedback id="graph_and_feedback" class="uk-padding uk-padding-remove-vertical uk-blur-background uk-text-xsmall uk-visible@m"
uk-sticky="bottom: true;" [attr.offset]="graph_offset"> uk-sticky="bottom: true;" [attr.offset]="graph_offset">
<ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container> <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
</div> </div>
@ -122,7 +122,7 @@
<div class="uk-margin-small-right"> <div class="uk-margin-small-right">
<a (click)="openAddThisModal()" <a (click)="openAddThisModal()"
[title]="'Share this '+getTypeName() + ' in your social networks'" [title]="'Share this '+getTypeName() + ' in your social networks'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="share" visuallyHidden="share"></icon> <icon name="share" visuallyHidden="share"></icon>
</span> </span>
@ -131,7 +131,7 @@
<!-- Link to --> <!-- Link to -->
<div *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-margin-small-right" <div *ngIf="isRouteAvailable('participate/direct-claim')" class="uk-margin-small-right"
[title]="'<span class=\'uk-flex uk-flex-middle\'>Link this '+getTypeName()+' to ...<span class=\'material-icons uk-margin-small-left\'>east</span></span>'" [title]="'<span class=\'uk-flex uk-flex-middle\'>Link this '+getTypeName()+' to ...<span class=\'material-icons uk-margin-small-left\'>east</span></span>'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])" <a [queryParams]="routerHelper.createQueryParams(['id','type','linkTo'],[id,type,'project'])"
routerLinkActive="router-link-active" routerLink="/participate/direct-claim"> routerLinkActive="router-link-active" routerLink="/participate/direct-claim">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
@ -143,7 +143,7 @@
<div class="uk-margin-small-right"> <div class="uk-margin-small-right">
<a (click)="openCiteModal()" <a (click)="openCiteModal()"
[title]="'Cite this '+getTypeName()" [title]="'Cite this '+getTypeName()"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'"> [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'">
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<icon name="quotes" visuallyHidden="cite"></icon> <icon name="quotes" visuallyHidden="cite"></icon>
</span> </span>
@ -180,26 +180,30 @@
[year]="resultLandingInfo.date" [embargoEndDate]="resultLandingInfo.embargoEndDate"> [year]="resultLandingInfo.date" [embargoEndDate]="resultLandingInfo.embargoEndDate">
</landing-header> </landing-header>
<!-- Labels --> <!-- Labels -->
<div class="uk-margin-bottom uk-margin-remove-left uk-grid uk-grid-small uk-flex-middle" uk-grid> <div class="uk-margin-bottom uk-grid uk-grid-small uk-flex-middle" uk-grid>
<ng-container *ngIf="resultLandingInfo.accessMode && resultLandingInfo.accessMode.toLowerCase() !== 'not available'"> <ng-container *ngIf="resultLandingInfo.accessMode && resultLandingInfo.accessMode.toLowerCase() !== 'not available'">
<span [class]="'uk-label uk-text-truncate '+ (accessClass(resultLandingInfo.accessMode) == 'open' ? 'uk-label-success' : '')" <div>
title="Access Mode">{{resultLandingInfo.accessMode}} <span [class]="'uk-label uk-text-truncate '+ (accessClass(resultLandingInfo.accessMode) == 'open' ? 'uk-label-success' : '')"
</span>&#160; title="Access Mode">{{resultLandingInfo.accessMode}}
</ng-container> </span>
<span *ngIf="resultLandingInfo.languages && </div>
</ng-container>
<ng-container *ngIf="resultLandingInfo.languages &&
removeUnknown(resultLandingInfo.languages).length > 0"> removeUnknown(resultLandingInfo.languages).length > 0">
<ng-container *ngFor="let language of removeUnknown(resultLandingInfo.languages)"> <ng-container *ngFor="let language of removeUnknown(resultLandingInfo.languages)">
<span class="uk-label custom-label label-language" title="Language">{{language}}</span> <div>
&#160; <span class="uk-label custom-label label-language" title="Language">{{language}}</span>
</ng-container> </div>
</span> </ng-container>
<span *ngIf="resultLandingInfo.programmingLanguages && resultLandingInfo.programmingLanguages.length > 0"> </ng-container>
<ng-container *ngFor="let programmingLanguage of resultLandingInfo.programmingLanguages"> <ng-container *ngIf="resultLandingInfo.programmingLanguages && resultLandingInfo.programmingLanguages.length > 0">
<span class="uk-label custom-label label-language" <ng-container *ngFor="let programmingLanguage of resultLandingInfo.programmingLanguages">
title="Programming Language">{{programmingLanguage}}</span> <div>
&#160; <span class="uk-label custom-label label-language"
</ng-container> title="Programming Language">{{programmingLanguage}}</span>
</span> </div>
</ng-container>
</ng-container>
</div> </div>
<div class="uk-text-small"> <div class="uk-text-small">
<!-- Identifiers --> <!-- Identifiers -->
@ -220,9 +224,8 @@
</div> </div>
</div> </div>
<div id="main-tabs-div" <div id="main-tabs-div" class="uk-sticky uk-blur-background"
uk-sticky="bottom: true; media: @m" [attr.offset]="offset" uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
cls-active="active">
<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom"> <div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
<landing-header *ngIf="stickyHeader" class="uk-visible@m" <landing-header *ngIf="stickyHeader" class="uk-visible@m"
[properties]="properties" [title]="resultLandingInfo.title" [properties]="properties" [title]="resultLandingInfo.title"
@ -407,9 +410,9 @@
<!-- right box/ sidebar--> <!-- right box/ sidebar-->
<ng-container *ngIf="resultLandingInfo && hasRightSidebarInfo"> <ng-container *ngIf="resultLandingInfo && hasRightSidebarInfo">
<div *ngIf="!rightSidebarOffcanvasClicked" class="landing-right-sidebar-min-width uk-width-1-3 uk-width-1-4@l uk-padding-remove landing-background-grey-color uk-text-small uk-visible@m" <div id="landing-right-sidebar" *ngIf="!rightSidebarOffcanvasClicked" class="uk-width-1-3 uk-width-1-4@l uk-padding-remove uk-text-small uk-visible@m"
[class.uk-animation-right]="viewAll"> [class.uk-animation-right]="viewAll">
<div class="uk-sticky landing-sidebar-height" uk-sticky="bottom: true" [attr.offset]="offset"> <div class="uk-sticky" uk-sticky="bottom: true" [attr.offset]="offset">
<div class="uk-overflow-auto uk-height-1-1"> <div class="uk-overflow-auto uk-height-1-1">
<ng-container *ngTemplateOutlet="right_column"></ng-container> <ng-container *ngTemplateOutlet="right_column"></ng-container>
</div> </div>
@ -420,7 +423,7 @@
<!-- right box/ sidebar--> <!-- right box/ sidebar-->
<ng-container *ngIf="!showFeedback && resultLandingInfo && hasRightSidebarInfo"> <ng-container *ngIf="!showFeedback && resultLandingInfo && hasRightSidebarInfo">
<div id="right-sidebar-switcher" uk-toggle href="#right-column-offcanvas" <div id="landing-right-sidebar-switcher" uk-toggle href="#right-column-offcanvas"
class="uk-offcanvas-switcher uk-flex uk-flex-center uk-flex-middle uk-hidden@m" class="uk-offcanvas-switcher uk-flex uk-flex-center uk-flex-middle uk-hidden@m"
(click)="rightSidebarOffcanvasClicked = true;"> (click)="rightSidebarOffcanvasClicked = true;">
<icon name="more" ratio="1.5" customClass="uk-text-primary" flex="true" visuallyHidden="sidebar"></icon> <icon name="more" ratio="1.5" customClass="uk-text-primary" flex="true" visuallyHidden="sidebar"></icon>

View File

@ -65,7 +65,7 @@ import {Component} from "@angular/core";
</div> </div>
</div> </div>
`, `,
styleUrls: ['how.component.css'] styleUrls: ['how.component.less']
}) })
export class HowComponent { export class HowComponent {

View File

@ -1,24 +0,0 @@
svg:not(.outlined) circle{
fill: currentColor;
stroke: currentColor;
}
svg:not(.outlined) text {
fill: white;
stroke: white;
}
svg.outlined circle{
fill: white;
stroke: currentColor;
}
svg.outlined text {
fill: currentColor;
stroke: currentColor;
}
svg {
user-select: none;
}

View File

@ -0,0 +1,27 @@
svg {
user-select: none;
&:not(.outlined) {
circle {
fill: currentColor;
stroke: currentColor;
}
text {
fill: white;
stroke: white;
}
}
&.outlined {
circle {
ill: white;
stroke: currentColor;
}
text {
fill: currentColor;
stroke: currentColor;
}
}
}

View File

@ -10,7 +10,7 @@ import {Component, Input, OnInit} from "@angular/core";
</text> </text>
</svg> </svg>
`, `,
styleUrls: ['notification-user.component.css'] styleUrls: ['notification-user.component.less']
}) })
export class NotificationUserComponent implements OnInit{ export class NotificationUserComponent implements OnInit{
@Input() @Input()

View File

@ -1,14 +0,0 @@
[notify-form] .notification-user {
position: absolute;
top: 0;
left: 0;
transform: translate(-50%, -50%);
z-index: 1;
}
[notify-form] .input-wrapper.recipients {
--input-padding-horizontal: 0px;
--input-font-size: 14px;
--input-placeholder-weight: 700;
--input-placeholder-color: var(--grey-color);
}

View File

@ -0,0 +1,19 @@
@import (reference) "~src/assets/openaire-theme/less/_import-variables";
[notify-form] {
.notification-user {
position: absolute;
top: 0;
left: 0;
transform: translate(-50%, -50%);
z-index: 1;
}
.input-wrapper.recipients {
--input-padding-horizontal: 0px;
--input-font-size: 14px;
--input-placeholder-weight: 700;
--input-placeholder-color: @global-color;
}
}

View File

@ -6,8 +6,7 @@ import {Subscription} from "rxjs";
import {NotificationService} from "../notification.service"; import {NotificationService} from "../notification.service";
import {Notification} from "../notifications"; import {Notification} from "../notifications";
import {InputComponent, Option} from "../../sharedComponents/input/input.component"; import {InputComponent, Option} from "../../sharedComponents/input/input.component";
import {NotificationHandler} from "../../utils/notification-handler";
declare var UIkit;
@Component({ @Component({
selector: '[notify-form]', selector: '[notify-form]',
@ -42,7 +41,7 @@ declare var UIkit;
</ng-template> </ng-template>
</form> </form>
`, `,
styleUrls: ['notify-form.component.css'], styleUrls: ['notify-form.component.less'],
encapsulation: ViewEncapsulation.None encapsulation: ViewEncapsulation.None
}) })
export class NotifyFormComponent implements OnInit, OnDestroy { export class NotifyFormComponent implements OnInit, OnDestroy {
@ -122,19 +121,11 @@ export class NotifyFormComponent implements OnInit, OnDestroy {
this.notification.surname = this.user.lastname; this.notification.surname = this.user.lastname;
this.subscriptions.push(this.notificationService.sendNotification(this.notification).subscribe(notification => { this.subscriptions.push(this.notificationService.sendNotification(this.notification).subscribe(notification => {
this.sending = false; this.sending = false;
UIkit.notification('A notification has been <b>sent</b> successfully', { NotificationHandler.rise('A notification has been <b>sent</b> successfully');
status: 'success',
timeout: 6000,
pos: 'bottom-right'
});
this.reset(); this.reset();
}, error => { }, error => {
this.sending = false; this.sending = false;
UIkit.notification('An error has occurred. Please try again later', { NotificationHandler.rise('An error has occurred. Please try again later', 'danger');
status: 'danger',
timeout: 6000,
pos: 'bottom-right'
});
this.reset(); this.reset();
})); }));
} }

View File

@ -42,7 +42,7 @@ declare var UIkit: any;
<div class="uk-margin-top"> <div class="uk-margin-top">
<span> <span>
Did you link a result with your ORCID <img src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="" loading="lazy"> Did you link a result with your ORCID <img src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="" loading="lazy">
but the <span class="orcid-color">green icon</span> is missing? but the <span class="text-orcid">green icon</span> is missing?
<br> <br>
No worries! It will appear, as soon as we synchronize again with ORCID data. No worries! It will appear, as soon as we synchronize again with ORCID data.
<span *ngIf="lastOrcidUpdateDate">Latest synchronization was on {{lastOrcidUpdateDate | date}}. </span> <span *ngIf="lastOrcidUpdateDate">Latest synchronization was on {{lastOrcidUpdateDate | date}}. </span>
@ -96,8 +96,7 @@ declare var UIkit: any;
</div> </div>
</div> </div>
</div> </div>
`, `
styles: ['.orcid-color { color: #a6ce39; }']
}) })
export class MyOrcidLinksComponent { export class MyOrcidLinksComponent {
public resultType: string = "result"; public resultType: string = "result";

View File

@ -15,9 +15,6 @@ import {OpenaireEntities} from "../utils/properties/searchFields";
declare var UIkit: any; declare var UIkit: any;
@Component({ @Component({
styles: [
'.loading-action-button { width: 35px; height: 35px; }'
],
selector: 'orcid-work', selector: 'orcid-work',
template: ` template: `
<ng-container *ngIf="pageType == 'search'"> <ng-container *ngIf="pageType == 'search'">
@ -46,9 +43,9 @@ declare var UIkit: any;
<icon *ngIf="!showLoading" name="delete" ratio="0.8" flex="true"></icon> <icon *ngIf="!showLoading" name="delete" ratio="0.8" flex="true"></icon>
<span *ngIf="showLoading" class="uk-icon icon-button"><loading [top_margin]="false"></loading></span> <span *ngIf="showLoading" class="uk-icon icon-button"><loading [top_margin]="false"></loading></span>
<span class="uk-margin-small-left uk-flex uk-flex-middle">Delete from&#160; <span class="uk-margin-small-left uk-flex uk-flex-middle">Delete from&#160;
<span class="space uk-flex uk-flex-middle"> <span class="uk-flex uk-flex-middle">
<span>ORCID&#160;</span> <span>ORCID&#160;</span>
<img class="space" src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="" loading="lazy">&#160; <img src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="" loading="lazy">&#160;
</span> </span>
</span> </span>
</a> </a>
@ -57,7 +54,7 @@ declare var UIkit: any;
<ng-container *ngIf="pageType == 'landing'"> <ng-container *ngIf="pageType == 'landing'">
<span *ngIf="!putCodes || putCodes.length == 0" <span *ngIf="!putCodes || putCodes.length == 0"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip uk-text-small uk-padding-small'" [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'"
[title]="(!pids || !isLoggedIn) ? (!pids ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipAdd"> [title]="(!pids || !isLoggedIn) ? (!pids ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipAdd">
<a *ngIf="!showLoading" (click)="currentAction='add'; saveWorkPreparation();" <a *ngIf="!showLoading" (click)="currentAction='add'; saveWorkPreparation();"
class="uk-icon-button uk-icon landing-action-button landing-action-button-orcid" class="uk-icon-button uk-icon landing-action-button landing-action-button-orcid"
@ -67,12 +64,12 @@ declare var UIkit: any;
<icon *ngIf="!hoverAdd" name="orcid_add" ratio="1.1" visuallyHidden="add"></icon> <icon *ngIf="!hoverAdd" name="orcid_add" ratio="1.1" visuallyHidden="add"></icon>
<icon *ngIf="hoverAdd" name="add" visuallyHidden="add"></icon> <icon *ngIf="hoverAdd" name="add" visuallyHidden="add"></icon>
</a> </a>
<span *ngIf="showLoading" class="uk-icon icon-button loading-action-button"><loading <span *ngIf="showLoading" class="uk-icon icon-button uk-icon-button-small"><loading
[top_margin]="false"></loading></span> [top_margin]="false"></loading></span>
</span> </span>
<span *ngIf="putCodes && putCodes.length > 0" <span *ngIf="putCodes && putCodes.length > 0"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip uk-text-small uk-padding-small'" [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'"
[title]="(!pids || !isLoggedIn) ? (!pids ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipDelete"> [title]="(!pids || !isLoggedIn) ? (!pids ? tooltipNoPid : tooltipNoLoggedInUser) : tooltipDelete">
<a *ngIf="!showLoading" (click)="currentAction='delete'; deleteWorks();" <a *ngIf="!showLoading" (click)="currentAction='delete'; deleteWorks();"
class="uk-icon-button uk-icon landing-action-button landing-action-button-orcid" class="uk-icon-button uk-icon landing-action-button landing-action-button-orcid"
@ -82,7 +79,7 @@ declare var UIkit: any;
<icon *ngIf="!hoverDelete" name="orcid_bin" ratio="1.1" visuallyHidden="delete"></icon> <icon *ngIf="!hoverDelete" name="orcid_bin" ratio="1.1" visuallyHidden="delete"></icon>
<icon *ngIf="hoverDelete" name="delete_outline" class="uk-text-danger" visuallyHidden="delete"></icon> <icon *ngIf="hoverDelete" name="delete_outline" class="uk-text-danger" visuallyHidden="delete"></icon>
</a> </a>
<span *ngIf="showLoading" class="uk-icon icon-button loading-action-button"><loading <span *ngIf="showLoading" class="uk-icon icon-button uk-icon-button-small"><loading
[top_margin]="false"></loading></span> [top_margin]="false"></loading></span>
</span> </span>
</ng-container> </ng-container>
@ -115,8 +112,8 @@ declare var UIkit: any;
<ng-container *ngIf="pageType == 'my_search'"> <ng-container *ngIf="pageType == 'my_search'">
<span class="uk-margin-bottom uk-flex uk-flex-middle uk-flex-center"> <span class="uk-margin-bottom uk-flex uk-flex-middle uk-flex-center">
<span>ORCID&#160;</span> <span>ORCID&#160;</span>
<img class="space" src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="" loading="lazy"> <img src="assets/common-assets/common/ORCIDiD_icon16x16.png" alt="" loading="lazy">
<span class="space">&#160;ACTIONS</span> <span>&#160;ACTIONS</span>
</span> </span>
<span [attr.uk-tooltip]="(!putCodes || putCodes.length == 0) <span [attr.uk-tooltip]="(!putCodes || putCodes.length == 0)

View File

@ -90,8 +90,8 @@
</ul> </ul>
</div> </div>
<div> <div>
<a class="uk-position-center-left blur-background" uk-slider-item="previous"><span uk-icon="chevron-left"></span></a> <a class="uk-position-center-left uk-blur-background" uk-slider-item="previous"><span uk-icon="chevron-left"></span></a>
<a class="uk-position-center-right blur-background" uk-slider-item="next"><span uk-icon="chevron-right"></span></a> <a class="uk-position-center-right uk-blur-background" uk-slider-item="next"><span uk-icon="chevron-right"></span></a>
</div> </div>
</div> </div>
</div> </div>

View File

@ -1,8 +1,8 @@
<ng-template #selected_filters_pills> <ng-template #selected_filters_pills>
<h1> <h1>
<div class="uk-width-1-1" uk-slider="finite: true"> <div class="uk-slider filters-slider" uk-slider="finite: true">
<div [class.uk-invisible]="list.children.length === 0" class="uk-position-relative"> <div [class.uk-invisible]="list.children.length === 0" class="uk-position-relative">
<div class="uk-slider-container" style="height: 40px"> <div class="uk-slider-container">
<ul #list class="uk-slider-items uk-grid uk-grid-small uk-margin-small-right uk-flex-nowrap"> <ul #list class="uk-slider-items uk-grid uk-grid-small uk-margin-small-right uk-flex-nowrap">
<ng-container *ngIf="customFilter && ((customFilterEnabled && <ng-container *ngIf="customFilter && ((customFilterEnabled &&
refineFields.indexOf(customFilter.queryFieldName) == refineFields.indexOf(customFilter.queryFieldName) ==
@ -65,10 +65,8 @@
</ng-container> </ng-container>
</ul> </ul>
</div> </div>
<div class=""> <a class="uk-position-center-left uk-blur-background" uk-slider-item="previous"><span uk-icon="chevron-left"></span></a>
<a class="uk-position-center-left blur-background" uk-slider-item="previous"><span uk-icon="chevron-left"></span></a> <a class="uk-position-center-right uk-blur-background" uk-slider-item="next"><span uk-icon="chevron-right"></span></a>
<a class="uk-position-center-right blur-background" uk-slider-item="next"><span uk-icon="chevron-right"></span></a>
</div>
</div> </div>
</div> </div>
</h1> </h1>

View File

@ -1,8 +1,7 @@
<div *ngIf="filter.values.length >0"> <div *ngIf="filter.values.length >0">
<div class="uk-flex uk-flex-middle uk-margin-bottom"> <div class="uk-flex uk-flex-middle uk-margin-bottom">
<h6 [title]="filter.title" <h6 [title]="filter.title" class="uk-margin-remove-bottom">{{_formatTitle(filter.title, filter.values.length)}}</h6>
class="uk-margin-right uk-margin-remove-bottom">{{_formatTitle(filter.title, filter.values.length)}}</h6> <a *ngIf="filter.countSelectedValues>0" class="uk-text-small uk-margin-left" (click)="clearFilter()" [class.uk-disabled]="isDisabled">Clear</a>
<a *ngIf="filter.countSelectedValues>0" class="uk-text-small" (click)="clearFilter()" [class.uk-disabled]="isDisabled">Clear</a>
</div> </div>
<div> <div>
<div *ngFor="let value of getSelectedAndTopValues(filter, filterValuesNum)" <div *ngFor="let value of getSelectedAndTopValues(filter, filterValuesNum)"

View File

@ -1,5 +1,5 @@
<div *ngIf="showMenu"> <div *ngIf="showMenu">
<div class="uk-hidden@m" [class.uk-light]='dark' > <div class="uk-hidden@m">
<div [ngClass]="portal + '-menu'"> <div [ngClass]="portal + '-menu'">
<nav class="uk-navbar-container uk-navbar" uk-navbar=""> <nav class="uk-navbar-container uk-navbar" uk-navbar="">
<div <div

View File

@ -1,24 +0,0 @@
.quick-contact {
position: fixed;
bottom: 5vh;
right: 5vw;
z-index: 980;
}
.uk-drop {
max-height: 550px;
height: calc(80vh - 100px);
width: 400px;
max-width: 80vw;
}
.avatars > img {
width: 50px;
height: 50px;
object-fit: cover;
border: 2px solid #fff;
}
.avatars > img:nth-child(n+1) {
margin-left: -5px;
}

View File

@ -0,0 +1,26 @@
.quick-contact {
position: fixed;
bottom: 5vh;
right: 5vw;
z-index: 980;
.uk-drop {
max-height: 550px;
height: calc(80vh - 100px);
width: 400px;
max-width: 80vw;
}
.avatars {
& > img {
width: 50px;
height: 50px;
object-fit: cover;
border: 2px solid @global-inverse-color;
}
& > img:nth-child(n+1) {
margin-left: -5px;
}
}
}

View File

@ -8,7 +8,7 @@ declare var UIkit;
@Component({ @Component({
selector: 'quick-contact', selector: 'quick-contact',
templateUrl: 'quick-contact.component.html', templateUrl: 'quick-contact.component.html',
styleUrls: ['quick-contact.component.css'] styleUrls: ['quick-contact.component.less']
}) })
export class QuickContactComponent implements OnInit, OnDestroy { export class QuickContactComponent implements OnInit, OnDestroy {
public showDrop: boolean = false; public showDrop: boolean = false;

View File

@ -1,4 +0,0 @@
.field-label {
width: 100px;
text-align: right;
}

View File

@ -48,8 +48,7 @@ import {NotificationHandler} from "../../utils/notification-handler";
</div> </div>
</div> </div>
</div> </div>
`, `
styleUrls: ['subscriber-invite.component.css']
}) })
export class SubscriberInviteComponent implements OnInit, OnDestroy { export class SubscriberInviteComponent implements OnInit, OnDestroy {
@Input() @Input()

View File

@ -13,7 +13,7 @@ declare var UIkit;
template: ` template: `
<a (click)="open()" <a (click)="open()"
[title]="'Send data to cloud storage [demo]'" [title]="'Send data to cloud storage [demo]'"
[attr.uk-tooltip]="'pos: right; cls: uk-active landing-action-tooltip landing-action-tooltip-portal uk-text-small uk-padding-small'" [attr.uk-tooltip]="'pos: right; cls: uk-active uk-text-small uk-padding-small'"
> <span icon="cloud-upload"></span> > <span icon="cloud-upload"></span>
<span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal"> <span class="uk-icon-button uk-icon landing-action-button landing-action-button-portal">
<span uk-icon="cloud-upload"></span> <span uk-icon="cloud-upload"></span>

View File

@ -1,8 +1,8 @@
<div class="uk-margin-small-bottom"> <div class="uk-margin-small-bottom">
<div class="uk-margin-small-top uk-margin-bottom uk-grid uk-flex uk-flex-bottom"> <div class="uk-margin-small-top uk-margin-bottom uk-flex uk-flex-middle">
<h6 class="uk-margin-bottom-remove">{{_formatTitle(filter.title)}}</h6> <h6 class="uk-margin-remove-bottom">{{_formatTitle(filter.title)}}</h6>
<a *ngIf="filter.selectedFromValue || filter.selectedToValue" (click)="clearFilter()" <a *ngIf="filter.selectedFromValue || filter.selectedToValue" (click)="clearFilter()"
[class]="(isDisabled ? 'uk-disabled' : '') + ' uk-text-small'"> [class.uk-disabled]="isDisabled" class="uk-text-small uk-margin-left">
Clear Clear
</a> </a>
</div> </div>

View File

@ -42,8 +42,8 @@ import {TabComponent} from './tab.component';
</ul> </ul>
</div> </div>
<div class=""> <div class="">
<a class="uk-position-center-left blur-background" uk-slider-item="previous"><span uk-icon="chevron-left"></span></a> <a class="uk-position-center-left uk-blur-background" uk-slider-item="previous"><span uk-icon="chevron-left"></span></a>
<a class="uk-position-center-right blur-background" uk-slider-item="next"><span uk-icon="chevron-right"></span></a> <a class="uk-position-center-right uk-blur-background" uk-slider-item="next"><span uk-icon="chevron-right"></span></a>
</div> </div>
</div> </div>
</div> </div>
@ -79,16 +79,7 @@ import {TabComponent} from './tab.component';
bottom: 0; bottom: 0;
left: 0; left: 0;
right: 0; right: 0;
border-bottom: 2px solid #eaeaea; border-bottom: 1px solid #eaeaea;
}
.featuredTab, .uk-active a.featuredTab{
color:#E96439 !important;
}
.blur-background {
background-color: var(--landing-default-color);
}
.blur-background {
background: rgba(var(--landing-default-color-rgb), 0.80);
} }
` `
] ]