[Monitor | Trunk]: 1. Add new assets. 2. Add a new css for theme-changes. 3. Changes on home, about, contact-us
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor@58983 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
parent
0bb9d7dc3f
commit
f803378ee0
|
|
@ -25,6 +25,9 @@
|
|||
"node_modules/datatables.net-dt/css/jquery.dataTables.css"
|
||||
],
|
||||
"scripts": [
|
||||
"src/assets/common-assets/common/jquery.js",
|
||||
"src/assets/common-assets/common/uikit.min.js",
|
||||
"src/assets/common-assets/common/uikit-icons.min.js",
|
||||
"node_modules/jquery/dist/jquery.js",
|
||||
"node_modules/datatables.net/js/jquery.dataTables.js"
|
||||
]
|
||||
|
|
@ -94,6 +97,9 @@
|
|||
"polyfills": "src/polyfills.ts",
|
||||
"tsConfig": "src/tsconfig.spec.json",
|
||||
"scripts": [
|
||||
"src/assets/common-assets/common/jquery.js",
|
||||
"src/assets/common-assets/common/uikit.min.js",
|
||||
"src/assets/common-assets/common/uikit-icons.min.js",
|
||||
"node_modules/jquery/dist/jquery.js",
|
||||
"node_modules/datatables.net/js/jquery.dataTables.js"
|
||||
],
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@ const routes: Routes = [
|
|||
resolve: {envSpecific: EnvironmentSpecificResolver}
|
||||
},
|
||||
{path: 'error', component: OpenaireErrorPageComponent, resolve: {envSpecific: EnvironmentSpecificResolver}},
|
||||
{ path: 'theme', loadChildren: './openaireLibrary/utils/theme/theme.module#ThemeModule'},
|
||||
{
|
||||
path: '**',
|
||||
pathMatch: 'full',
|
||||
|
|
|
|||
|
|
@ -57,7 +57,6 @@ export class AppComponent {
|
|||
}
|
||||
|
||||
ngOnInit() {
|
||||
console.log(properties);
|
||||
this.propertiesService.loadEnvironment()
|
||||
.then(es => {
|
||||
this.properties = this.propertiesService.envSpecific;
|
||||
|
|
@ -84,7 +83,7 @@ export class AppComponent {
|
|||
items: []
|
||||
});
|
||||
this.menuItems.push({
|
||||
rootItem: new MenuItem("stakeholders", "Members in Action", "", "/search/find/stakeholders", false, [], null, {}),
|
||||
rootItem: new MenuItem("stakeholders", "Browse Members", "", "/search/find/stakeholders", false, [], null, {}),
|
||||
items: []
|
||||
});
|
||||
this.menuItems.push({
|
||||
|
|
|
|||
|
|
@ -1,15 +1,4 @@
|
|||
<schema2jsonld *ngIf="url" [URL]="url" [name]="pageTitle" type="other"></schema2jsonld>
|
||||
<ng-template #info>
|
||||
<div class="uk-margin-auto-top uk-margin-remove-bottom uk-text-bold uk-h4">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit
|
||||
</div>
|
||||
<div class="uk-margin-top">
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna
|
||||
aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur
|
||||
sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
</div>
|
||||
</ng-template>
|
||||
<div class="uk-section">
|
||||
<div class="uk-align-center">
|
||||
<div *ngIf="showLoading" class="uk-margin-large">
|
||||
|
|
@ -18,18 +7,14 @@
|
|||
</div>
|
||||
<div *ngIf="!showLoading" class="uk-container uk-container-large">
|
||||
<div class="uk-grid-divider uk-grid uk-flex-center" uk-grid>
|
||||
<!--<div class="uk-width-1-1 uk-hidden@m">
|
||||
<ng-container *ngTemplateOutlet="info"></ng-container>
|
||||
</div>-->
|
||||
<contact-us formTitle="Contact us to learn more" class="uk-width-1-1 uk-hidden@m"
|
||||
[properties]="properties" [errorMessage]="errorMessage"
|
||||
[contactForm]="contactForm" (sendEmitter)="send($event)"></contact-us>
|
||||
<contact-us formTitle="Contact us to learn more" class="uk-width-1-2 uk-visible@m"
|
||||
[properties]="properties" [errorMessage]="errorMessage"
|
||||
[contactForm]="contactForm" (sendEmitter)="send($event)"></contact-us>
|
||||
<!--<div class="uk-width-1-2 uk-visible@m">
|
||||
<ng-container *ngTemplateOutlet="info"></ng-container>
|
||||
</div>-->
|
||||
<div class="uk-width-1-1 uk-width-1-2@m">
|
||||
<div class="uk-text-center uk-margin-medium-bottom">
|
||||
<h1>Contact us to learn more</h1>
|
||||
<div>We’d be happy to provide more information on OpenAIRE Monitor – please fill in your details below to send your questions to our team.</div>
|
||||
</div>
|
||||
<contact-us [properties]="properties" [errorMessage]="errorMessage" [organizationTypes]="organizationTypes"
|
||||
[contactForm]="contactForm" (sendEmitter)="send($event)"></contact-us>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -9,13 +9,12 @@ import {PiwikService} from "../openaireLibrary/utils/piwik/piwik.service";
|
|||
import {HelperFunctions} from "../openaireLibrary/utils/HelperFunctions.class";
|
||||
import {HelperService} from "../openaireLibrary/utils/helper/helper.service";
|
||||
import {SEOService} from "../openaireLibrary/sharedComponents/SEO/SEO.service";
|
||||
import {FormBuilder, FormGroup, Validators} from "@angular/forms";
|
||||
import {AbstractControl, FormBuilder, FormGroup, ValidatorFn, Validators} from "@angular/forms";
|
||||
|
||||
@Component({
|
||||
selector: 'contact',
|
||||
templateUrl: './contact.component.html',
|
||||
})
|
||||
|
||||
export class ContactComponent implements OnInit {
|
||||
public url: string = null;
|
||||
public pageTitle: string = "OpenAIRE - Monitor | Contact Us";
|
||||
|
|
@ -26,6 +25,11 @@ export class ContactComponent implements OnInit {
|
|||
public properties: EnvProperties = null;
|
||||
public pageContents = null;
|
||||
public divContents = null;
|
||||
public organizationTypes: string[] = [
|
||||
'Funding agency', 'University / Research Center',
|
||||
'Research Infrastructure', 'Government',
|
||||
'Non-profit', 'Industry', 'Other'
|
||||
];
|
||||
|
||||
public contactForm: FormGroup;
|
||||
@ViewChild('AlertModal') modal;
|
||||
|
|
@ -47,7 +51,6 @@ export class ContactComponent implements OnInit {
|
|||
this.route.data.subscribe((data: { envSpecific: EnvProperties }) => {
|
||||
this.properties = data.envSpecific;
|
||||
this.email = {body: '', subject: '', recipients: []};
|
||||
|
||||
if (this.properties.enablePiwikTrack && (typeof document !== 'undefined')) {
|
||||
this.piwiksub = this._piwikService.trackView(this.properties, this.pageTitle, this.properties.piwikSiteId).subscribe();
|
||||
}
|
||||
|
|
@ -84,25 +87,35 @@ export class ContactComponent implements OnInit {
|
|||
this.errorMessage = 'Please fill in all the required fields!';
|
||||
}
|
||||
}
|
||||
|
||||
private validatorType(options: string[]): ValidatorFn {
|
||||
return (control: AbstractControl): { [key: string]: boolean } | null => {
|
||||
if (options.filter(type => type === control.value).length === 0) {
|
||||
return {'type': false};
|
||||
}
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
public reset() {
|
||||
this.contactForm = this.fb.group( {
|
||||
name: this.fb.control('', Validators.required),
|
||||
surname: this.fb.control('', Validators.required),
|
||||
email: this.fb.control('', [Validators.required, Validators.email]),
|
||||
affiliation: this.fb.control('', Validators.required),
|
||||
stakeholder: this.fb.control('', Validators.required),
|
||||
job: this.fb.control('', Validators.required),
|
||||
organization: this.fb.control('', Validators.required),
|
||||
organizationType: this.fb.control('', [Validators.required, this.validatorType(this.organizationTypes)]),
|
||||
subject: this.fb.control('', Validators.required),
|
||||
message: this.fb.control('', Validators.required),
|
||||
recaptcha: this.fb.control('', Validators.required),
|
||||
});
|
||||
this.errorMessage = '';
|
||||
}
|
||||
|
||||
|
||||
private sendMail(admins: any) {
|
||||
this.showLoading = true;
|
||||
this._emailService.contact(this.properties,
|
||||
Composer.composeEmailForNewStakeholder(this.contactForm.value, admins),
|
||||
Composer.composeEmailForMonitor(this.contactForm.value, admins),
|
||||
this.contactForm.value.recaptcha).subscribe(
|
||||
res => {
|
||||
if (res) {
|
||||
|
|
|
|||
|
|
@ -69,6 +69,30 @@
|
|||
width: 16%;
|
||||
}
|
||||
|
||||
.dashboard-section .info > div {
|
||||
opacity: 0.4;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.dashboard-section .info > div:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.dashboard-section .info > div > span {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
left: 0;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.dashboard-section .info > div > span polygon {
|
||||
color: var(--portal-main-color);
|
||||
}
|
||||
|
||||
.dashboard-section .info > div.uk-active > span {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.boat-section {
|
||||
position: relative;
|
||||
|
|
@ -210,13 +234,47 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
.stakeholder-section .stakeholders .header {
|
||||
position: relative;
|
||||
height: 150px;
|
||||
.stakeholder-section .stakeholders .stakeholder {
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .header > img {
|
||||
.stakeholder-section .stakeholders .stakeholder.small {
|
||||
height: 250px;
|
||||
box-shadow: 0 3px 6px #00000029;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .stakeholder.medium {
|
||||
height: 275px;
|
||||
box-shadow: 0 3px 6px #00000029;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .stakeholder.large {
|
||||
height: 300px;
|
||||
box-shadow: 0 3px 6px #00000029;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .stakeholder.funder {
|
||||
background-color: #F8D5E3;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .stakeholder.ri {
|
||||
background-color: #9AD5CA;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .stakeholder.organization {
|
||||
background-color: #C5E0E9;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .stakeholder .header {
|
||||
position: relative;
|
||||
height: 150px;
|
||||
background-size: 450px;
|
||||
background-position: bottom center;
|
||||
background-repeat: no-repeat;
|
||||
background-image: url("/assets/monitor-assets/home/stakeholder.svg");
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .stakeholder .header > img {
|
||||
max-width: 50%;
|
||||
max-height: 50%;
|
||||
position: absolute;
|
||||
|
|
@ -225,7 +283,7 @@
|
|||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .header > div {
|
||||
.stakeholder-section .stakeholders .stakeholder .header > div {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
|
|
@ -234,35 +292,11 @@
|
|||
text-align: center;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .header > div > img {
|
||||
.stakeholder-section .stakeholders .stakeholder .header > div > img {
|
||||
max-width: 50%;
|
||||
max-height: 50%;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .header.small {
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .header.medium {
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .header.large {
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .funder .header {
|
||||
background-color: #F8D5E3;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .ri .header {
|
||||
background-color: #9AD5CA;
|
||||
}
|
||||
|
||||
.stakeholder-section .stakeholders .organization .header {
|
||||
background-color: #C5E0E9;
|
||||
}
|
||||
|
||||
@media (min-width: 640px) {
|
||||
|
||||
.stakeholder-section .tabs > ul > li {
|
||||
|
|
|
|||
|
|
@ -3,11 +3,11 @@
|
|||
name="OpenAIRE Monitor">
|
||||
</schema2jsonld>
|
||||
<div class="uk-section home-background uk-background-top-center">
|
||||
<div class="uk-container uk-container-large uk-text-center uk-section uk-margin-large-bottom"
|
||||
<div class="uk-container uk-container-large uk-text-center uk-section uk-section-small uk-margin-large-bottom"
|
||||
uk-parallax="media: @l; y: -200; easing: 0.5">
|
||||
<h1 class="uk-margin-top uk-text-bold">A new era of monitoring research.</h1>
|
||||
<h2 class="uk-margin-remove-top uk-text-bold">Open data. Open methodologies.</h2>
|
||||
<div class="uk-margin-medium-top uk-text-large">
|
||||
<h1 class="uk-margin-top">A new era of monitoring research.</h1>
|
||||
<h3 class="uk-margin-remove-top">Open data. Open methodologies.</h3>
|
||||
<div class="uk-margin-medium-top">
|
||||
Work together with us to view, understand and visualize<br>research statistics and indicators.
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -18,80 +18,97 @@
|
|||
<div #ref [@captain-left]="(captains)?'after':'before'" class="captain-left uk-visible@m"></div>
|
||||
<div [@captain-right]="(captains)?'after':'before'" class="captain-right uk-visible@m"></div>
|
||||
</div>
|
||||
<div class="uk-container uk-container-large uk-margin-large-top uk-text-justify">
|
||||
<div class="uk-container uk-container-large uk-margin-large-top">
|
||||
<div class="uk-margin-left uk-margin-right uk-margin-large-bottom">
|
||||
<div class="uk-child-width-1-3@m uk-grid uk-grid-large" uk-grid>
|
||||
<div [@1]="state.toString()" class="clickable" (click)="startAnimation()">
|
||||
<h5 class="uk-margin-remove-bottom uk-text-bold">
|
||||
<div class="uk-child-width-1-3@m uk-grid info" uk-grid>
|
||||
<div [@1]="state.toString()" class="clickable" [class.uk-active]="state === 1" (click)="startAnimation()">
|
||||
<h5>
|
||||
Get a complete picture
|
||||
</h5>
|
||||
<div class="uk-text-large">
|
||||
Track and discover your organization’s research output. Use the OpenAIRE Research Graph to get a 360o
|
||||
<div>
|
||||
Track and discover your organization’s research output. Use the OpenAIRE Research Graph to get a 360<span>°</span>
|
||||
view of your publications-data-code.
|
||||
</div>
|
||||
<span class="uk-icon">
|
||||
<svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="triangle-up">
|
||||
<polygon points="5 13 10 8 15 13"></polygon>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
<div [@2]="state.toString()" class="clickable" (click)="startAnimation(2)">
|
||||
<h5 class="uk-margin-remove-bottom uk-text-bold">
|
||||
<div [@2]="state.toString()" class="clickable" [class.uk-active]="state === 2" (click)="startAnimation(2)">
|
||||
<h5>
|
||||
Monitor open science compliance
|
||||
</h5>
|
||||
<div class="uk-text-large">
|
||||
Work with us, the OS expert community, for open and transparent metrics. Discover open science trends
|
||||
<div>
|
||||
Work with the open science expert community for open and transparent metrics. Discover open science trends
|
||||
for your organization and see how you fare in EOSC.
|
||||
</div>
|
||||
<span class="uk-icon">
|
||||
<svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="triangle-up">
|
||||
<polygon points="5 13 10 8 15 13"></polygon>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
<div [@3]="state.toString()" class="clickable" (click)="startAnimation(3)">
|
||||
<h5 class="uk-margin-remove-bottom uk-text-bold">
|
||||
<div [@3]="state.toString()" class="clickable" [class.uk-active]="state === 3" (click)="startAnimation(3)">
|
||||
<h5>
|
||||
Turn research results to insights
|
||||
</h5>
|
||||
<div class="uk-text-large">
|
||||
<div>
|
||||
Understand your community. Measure impact, discover trends, connections and collaborations to improve
|
||||
and optimize your future actions.
|
||||
</div>
|
||||
<span class="uk-icon">
|
||||
<svg width="30" height="30" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="triangle-up">
|
||||
<polygon points="5 13 10 8 15 13"></polygon>
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="uk-section uk-section-large uk-container uk-container-large uk-margin-large-top boat-section uk-text-large uk-text-justify uk-position-relative">
|
||||
<div class="uk-grid uk-grid-match uk-margin-left uk-margin-right uk-child-width-1-2@m" uk-grid>
|
||||
<div class="boat uk-hidden@m"></div>
|
||||
<div class="boat uk-visible@l"></div>
|
||||
<div class="first">
|
||||
<div>
|
||||
<h3>Global outlook</h3>
|
||||
<div class="uk-section">
|
||||
<h3 class="uk-text-center" uk-parallax="y: -40; easing: 2">Why use OpenAIRE Monitor Dashboard?</h3>
|
||||
<div
|
||||
class="uk-section uk-section-large uk-container uk-container-large uk-margin-large-top boat-section uk-position-relative">
|
||||
<div class="uk-grid uk-grid-match uk-margin-left uk-margin-right uk-child-width-1-2@m" uk-grid>
|
||||
<div class="boat uk-hidden@m"></div>
|
||||
<div class="boat uk-visible@l"></div>
|
||||
<div class="first" uk-parallax="y: -40; easing: 2">
|
||||
<div>
|
||||
Monitor is built on the OpenAIRE Research Graph. An interconnected scholarly communication shared data
|
||||
resource
|
||||
from open initiatives around the world, of global interest.
|
||||
<h4>Global outlook</h4>
|
||||
<div>
|
||||
Monitor is built on the OpenAIRE Research Graph. Linked scholarly information from open initiatives around
|
||||
the world. Beyond publications.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="second">
|
||||
<div>
|
||||
<h3>Transparent methodology</h3>
|
||||
<div class="second" uk-parallax="y: -40; easing: 2">
|
||||
<div>
|
||||
We base our service on open science principles. We rely on open data sources, and document our algorithms for
|
||||
every metric and indicator we publish.
|
||||
<h4>Transparent methodology</h4>
|
||||
<div>
|
||||
Based on open science principles: open data sources, well documented metrics and indicators. Open APIs.
|
||||
Built together with the OS community.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="third">
|
||||
<div>
|
||||
<h3>Customised to your needs</h3>
|
||||
<div class="third" uk-parallax="y: -40; easing: 1">
|
||||
<div>
|
||||
Choose from a variety of pre-defined metrics. Select how to visualize them, and who to share with.
|
||||
Use our advanced tools and expertise add add your own metrics.
|
||||
<h4>Customised to your needs</h4>
|
||||
<div>
|
||||
A variety of predefined metrics to choose from. Add your own metrics. Select how to visualize them, and who
|
||||
to share with.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fourth">
|
||||
<div>
|
||||
<h3>Minimum effort to join</h3>
|
||||
<div class="fourth" uk-parallax="y: -40; easing: 0.5">
|
||||
<div>
|
||||
You only share some information with us to include in out backend aggregating and data mining,
|
||||
and we deliver a view of your world. As you see fit.
|
||||
<h4>Minimum effort to join</h4>
|
||||
<div>
|
||||
You only share some information with us to include in out backend aggregating and data mining,
|
||||
and we deliver a view of your world. As you see fit.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -102,29 +119,29 @@
|
|||
</div>
|
||||
<div class="uk-section uk-section-large graph-section uk-margin-right uk-margin-left uk-margin-large-top">
|
||||
<div class="uk-container uk-margin-medium-top">
|
||||
<div class="uk-text-center uk-margin-medium-bottom">
|
||||
<h2 class="uk-text-bold">Tap into the OpenAIRE Research Graph</h2>
|
||||
<div class="uk-text-center uk-margin-large-bottom">
|
||||
<h1>Tap into the OpenAIRE Research Graph</h1>
|
||||
</div>
|
||||
<div class="uk-grid uk-child-width-1-5@m uk-child-width-1-2">
|
||||
<div *ngIf="publicationsSize" class="uk-margin-medium-bottom uk-text-center">
|
||||
<div class="uk-h2 uk-margin portal-color uk-text-bold">{{publicationsSize.count|number}} </div>
|
||||
<div class="uk-h5 uk-margin uk-text-uppercase">publications</div>
|
||||
<h4 class="uk-margin portal-color uk-text-bold">{{publicationsSize.count|number}}</h4>
|
||||
<div class="uk-margin uk-text-uppercase">publications</div>
|
||||
</div>
|
||||
<div *ngIf="datasetsSize" class="uk-margin-medium-bottom uk-text-center">
|
||||
<div class="uk-h2 uk-margin portal-color uk-text-bold">{{datasetsSize.count|number}} </div>
|
||||
<div class="uk-h5 uk-margin uk-text-uppercase">research data</div>
|
||||
<h4 class="uk-margin portal-color uk-text-bold">{{datasetsSize.count|number}}</h4>
|
||||
<div class="uk-margin uk-text-uppercase">research data</div>
|
||||
</div>
|
||||
<div *ngIf="softwareSize" class="uk-margin-medium-bottom uk-text-center">
|
||||
<div class="uk-h2 uk-margin portal-color uk-text-bold">{{softwareSize.count|number}} </div>
|
||||
<div class="uk-h5 uk-margin uk-text-uppercase">software</div>
|
||||
<h4 class="uk-margin portal-color uk-text-bold">{{softwareSize.count|number}} </h4>
|
||||
<div class="uk-margin uk-text-uppercase">software</div>
|
||||
</div>
|
||||
<div *ngIf="otherSize" class="uk-margin-medium-bottom uk-text-center">
|
||||
<div class="uk-h2 uk-margin portal-color uk-text-bold">{{otherSize.count|number}} </div>
|
||||
<div class="uk-h5 uk-margin uk-text-uppercase">other research products</div>
|
||||
<h4 class="uk-margin portal-color uk-text-bold">{{otherSize.count|number}} </h4>
|
||||
<div class="uk-margin uk-text-uppercase">other</div>
|
||||
</div>
|
||||
<div *ngIf="fundersSize" class="uk-margin-medium-bottom uk-text-center uk-width-1-5@m uk-width-1-1">
|
||||
<div class="uk-h2 uk-margin portal-color uk-text-bold">{{fundersSize.count|number}} </div>
|
||||
<div class="uk-h5 uk-margin uk-text-uppercase">Funders</div>
|
||||
<h4 class="uk-margin portal-color uk-text-bold">{{fundersSize.count|number}} </h4>
|
||||
<div class="uk-margin uk-text-uppercase">Funders</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -146,25 +163,28 @@
|
|||
</div>
|
||||
<div class="stakeholders uk-child-width-1-2 uk-child-width-1-3@m uk-grid uk-flex-top uk-flex-wrap-top"
|
||||
uk-grid="masonry: true">
|
||||
<div *ngFor="let stakeholder of stakeholders" [attr.data-type]="stakeholder.type" class="uk-margin-medium-bottom" [ngClass]="stakeholder.type">
|
||||
<a *ngIf="directLink" [href]="getStakeholderPageUrl(stakeholder)" target="_blank">
|
||||
<div class="header" [ngClass]="stakeholder.size">
|
||||
<img *ngIf="stakeholder.logoUrl" class="uk-margin-auto" [src]="stakeholder.logoUrl">
|
||||
</div>
|
||||
</a>
|
||||
<a *ngIf="!directLink" (click)="confirmModalOpen(stakeholder)">
|
||||
<div class="header" [ngClass]="stakeholder.size">
|
||||
<img *ngIf="stakeholder.logoUrl" class="uk-margin-auto" [src]="stakeholder.logoUrl">
|
||||
</div>
|
||||
</a>
|
||||
<a *ngIf="directLink" [href]="getStakeholderPageUrl(stakeholder)" target="_blank">
|
||||
<h6 class="uk-margin-top uk-text-bold">{{stakeholder.name}}</h6>
|
||||
</a>
|
||||
<a *ngIf="!directLink" (click)="confirmModalOpen(stakeholder)">
|
||||
<h6 class="uk-margin-top uk-text-bold">{{stakeholder.name}}</h6>
|
||||
</a>
|
||||
<div *ngFor="let stakeholder of stakeholders" [attr.data-type]="stakeholder.type" class="uk-margin-medium-bottom">
|
||||
<div [ngClass]="[stakeholder.type, stakeholder.size]" class="stakeholder">
|
||||
<a *ngIf="directLink" [href]="getStakeholderPageUrl(stakeholder)" target="_blank">
|
||||
<div class="header">
|
||||
<img *ngIf="stakeholder.logoUrl" class="uk-margin-auto" [src]="stakeholder.logoUrl">
|
||||
</div>
|
||||
<div class="uk-padding">
|
||||
<h6 class="uk-text-bold">{{stakeholder.name}}</h6>
|
||||
</div>
|
||||
</a>
|
||||
<a *ngIf="!directLink" (click)="confirmModalOpen(stakeholder)">
|
||||
<div class="header">
|
||||
<img *ngIf="stakeholder.logoUrl" class="uk-margin-auto" [src]="stakeholder.logoUrl">
|
||||
</div>
|
||||
<div class="uk-padding">
|
||||
<h6 class="uk-text-bold">{{stakeholder.name}}</h6>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="stakeholdersNumber === 0" [attr.data-type]="type" class="uk-text-center uk-text-large uk-width-1-1 uk-margin-large-top">
|
||||
<div *ngIf="stakeholdersNumber === 0" [attr.data-type]="type"
|
||||
class="uk-text-center uk-width-1-1 uk-margin-large-top">
|
||||
Nothing here yet.
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -180,32 +200,39 @@
|
|||
</ul>
|
||||
</div>
|
||||
<div class="stakeholders uk-child-width-1-2 uk-grid uk-grid-small" uk-grid="">
|
||||
<div *ngFor="let stakeholder of stakeholders" [attr.data-type]="stakeholder.type" [ngClass]="stakeholder.type">
|
||||
<a [href]="getStakeholderPageUrl(stakeholder)" target="_blank">
|
||||
<div class="header">
|
||||
<div>
|
||||
<div *ngFor="let stakeholder of stakeholders" [attr.data-type]="stakeholder.type">
|
||||
<div [ngClass]="stakeholder.type" class="stakeholder">
|
||||
<a [href]="getStakeholderPageUrl(stakeholder)" target="_blank">
|
||||
<div class="header">
|
||||
<img *ngIf="stakeholder.logoUrl" class="uk-margin-auto" [src]="stakeholder.logoUrl">
|
||||
<h6 class="uk-margin-top uk-text-bold">{{stakeholder.name}}</h6>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="uk-padding">
|
||||
<h6 class="uk-text-bold">{{stakeholder.name}}</h6>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="stakeholdersNumber === 0" [attr.data-type]="type" class="uk-text-center uk-text-large uk-width-1-1 uk-margin-large-top">
|
||||
<div *ngIf="stakeholdersNumber === 0" [attr.data-type]="type"
|
||||
class="uk-text-center uk-width-1-1 uk-margin-large-top">
|
||||
Nothing here yet.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-section uk-section-large uk-container uk-margin-large-top uk-margin-large-bottom">
|
||||
<div class="uk-section uk-section-large uk-container uk-margin-large-bottom">
|
||||
<div class="uk-grid uk-grid-large uk-flex uk-flex-middle uk-margin-right uk-margin-left" uk-grid>
|
||||
<div class="uk-width-expand">
|
||||
<h2 class="uk-text-bold">Contact us to help you.</h2>
|
||||
<div class="uk-margin-medium uk-text-large">Are you looking for more? Get in touch with our team and let us help
|
||||
you.
|
||||
<h3>Contact us</h3>
|
||||
<div class="uk-margin-medium">
|
||||
<p>We invite all organizations involved in scholarly communications and research monitoring to join our
|
||||
services.</p>
|
||||
<p><span class="uk-text-bold">Minimum effort to join:</span> You share basic information with us. We aggregate
|
||||
and data/text mine, you validate.<br></p>
|
||||
<p>Would you like to know more?</p>
|
||||
</div>
|
||||
<div class="uk-inline"><a class="uk-button portal-button" routerLink="/contact-us">Get in Touch</a></div>
|
||||
</div>
|
||||
<div class="uk-text-center uk-width-1-1@s uk-width-1-3@m uk-flex-first@m uk-padding-remove-left uk-text-center">
|
||||
<div class="uk-text-center uk-width-1-1@s uk-width-2-5@m uk-flex-first@m uk-padding-remove-left uk-text-center">
|
||||
<img class="uk-visible@m" src="assets/monitor-assets/home/seagull.png" width="256">
|
||||
<img class="uk-hidden@m" src="assets/monitor-assets/home/seagull.png" width="100">
|
||||
</div>
|
||||
|
|
@ -214,7 +241,7 @@
|
|||
<div class="uk-section-muted"
|
||||
uk-scrollspy="{"target":"[uk-scrollspy-class]","cls":"uk-animation-fade","delay":false}">
|
||||
<div class="uk-container uk-container-large">
|
||||
<other-portals [properties]="properties"></other-portals>
|
||||
<other-portals [properties]="properties" portal="monitor"></other-portals>
|
||||
</div>
|
||||
</div>
|
||||
<modal-alert #AlertModal (alertOutput)="goToPage($event)">
|
||||
|
|
|
|||
|
|
@ -14,7 +14,6 @@ import {NumberUtils} from "../openaireLibrary/utils/number-utils.class";
|
|||
import {SearchResearchResultsService} from "../openaireLibrary/services/searchResearchResults.service";
|
||||
import {animate, state, style, transition, trigger} from "@angular/animations";
|
||||
import {StakeholderService} from "../openaireLibrary/monitor/services/stakeholder.service";
|
||||
import {HelperFunctions} from "../openaireLibrary/utils/HelperFunctions.class";
|
||||
import {LocalStorageService} from "../openaireLibrary/services/localStorage.service";
|
||||
import {Stakeholder} from "../openaireLibrary/monitor/entities/stakeholder";
|
||||
import {Session, User} from "../openaireLibrary/login/utils/helper.class";
|
||||
|
|
@ -52,37 +51,19 @@ import {UserManagementService} from "../openaireLibrary/services/user-management
|
|||
state('1', style({
|
||||
opacity: 1
|
||||
})),
|
||||
state('2', style({
|
||||
opacity: 0.4
|
||||
})),
|
||||
state('3', style({
|
||||
opacity: 0.4
|
||||
})),
|
||||
transition('* => *', [
|
||||
animate('0.3s')
|
||||
])
|
||||
]),
|
||||
trigger('2', [
|
||||
state('1', style({
|
||||
opacity: 0.4
|
||||
})),
|
||||
state('2', style({
|
||||
opacity: 1
|
||||
})),
|
||||
state('3', style({
|
||||
opacity: 0.4
|
||||
})),
|
||||
transition('* => *', [
|
||||
animate('0.3s')
|
||||
])
|
||||
]),
|
||||
trigger('3', [
|
||||
state('1', style({
|
||||
opacity: 0.4
|
||||
})),
|
||||
state('2', style({
|
||||
opacity: 0.4
|
||||
})),
|
||||
state('3', style({
|
||||
opacity: 1
|
||||
})),
|
||||
|
|
|
|||
|
|
@ -1,7 +1,3 @@
|
|||
.steps {
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.steps.uk-visible\@l {
|
||||
position: relative;
|
||||
height: 1600px;
|
||||
|
|
@ -21,7 +17,7 @@
|
|||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
position: absolute;
|
||||
top: 260px;
|
||||
top: 250px;
|
||||
left: 270px;
|
||||
width: 193px;
|
||||
height: 177px;
|
||||
|
|
@ -40,7 +36,7 @@
|
|||
background-repeat: no-repeat;
|
||||
position: absolute;
|
||||
top: 510px;
|
||||
left: 680px;
|
||||
left: 700px;
|
||||
width: 125px;
|
||||
height: 137px;
|
||||
}
|
||||
|
|
@ -57,8 +53,8 @@
|
|||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
position: absolute;
|
||||
right: 200px;
|
||||
bottom: 500px;
|
||||
right: 180px;
|
||||
bottom: 470px;
|
||||
width: 161px;
|
||||
height: 266px;
|
||||
}
|
||||
|
|
@ -75,8 +71,8 @@
|
|||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
position: absolute;
|
||||
left: 250px;
|
||||
bottom: 150px;
|
||||
left: 300px;
|
||||
bottom: 120px;
|
||||
width: 233px;
|
||||
height: 178px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<schema2jsonld *ngIf="url" [URL]="url" [name]="pageTitle" type="other"></schema2jsonld>
|
||||
<div class="uk-section">
|
||||
<div class="uk-text-center">
|
||||
<h1 class="uk-text-bold">See how it works</h1>
|
||||
<div class="uk-text-large">Use the Monitor Dashboard to view your research results, open science…</div>
|
||||
<h1>See how it works</h1>
|
||||
<div>Use the Monitor Dashboard to view your research results, open science…</div>
|
||||
</div>
|
||||
<div class="uk-margin-xlarge-top uk-container uk-container-large uk-text-justify">
|
||||
<div class="uk-margin-xlarge-top uk-container uk-container-large">
|
||||
<div class="steps uk-visible@l">
|
||||
<div class="first">
|
||||
<div class="uk-text-center uk-margin-small-bottom">
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 109 KiB After Width: | Height: | Size: 112 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 828 KiB After Width: | Height: | Size: 1.2 MiB |
|
|
@ -0,0 +1,14 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="319" height="168" viewBox="0 0 319 168">
|
||||
<defs>
|
||||
<filter id="Path_17212" x="0" y="0" width="319" height="168" filterUnits="userSpaceOnUse">
|
||||
<feOffset dy="3" input="SourceAlpha"/>
|
||||
<feGaussianBlur stdDeviation="3" result="blur"/>
|
||||
<feFlood flood-opacity="0.161"/>
|
||||
<feComposite operator="in" in2="blur"/>
|
||||
<feComposite in="SourceGraphic"/>
|
||||
</filter>
|
||||
</defs>
|
||||
<g transform="matrix(1, 0, 0, 1, 0, 0)" filter="url(#Path_17212)">
|
||||
<path id="Path_17212-2" data-name="Path 17212" d="M0,0H301V134.2s-42.014,17.991-81.451,6.034c-40.272-12.21-61.6-14.962-99.828-14.962C44.47,125.277,0,150,0,150Z" transform="translate(9 6)" fill="#fff"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 773 B |
|
|
@ -1,24 +1,23 @@
|
|||
:root {
|
||||
--portal-main-color: #9ABB55;
|
||||
--portal-main-color: #8DCA26;
|
||||
--portal-main-contrast: white;
|
||||
--portal-dark-color: #7c9144;
|
||||
--portal-dark-color: #7cb021;
|
||||
|
||||
--openaire-main-color: #313179;
|
||||
|
||||
--explore-portal-color: #D95F2D;
|
||||
--provide-portal-color: #37C7E9;
|
||||
--monitor-portal-color: #9ABB55;
|
||||
--monitor-portal-color: #8DCA26;
|
||||
--connect-portal-color: #EBB13E;
|
||||
--develop-portal-color: #DA65AB;
|
||||
|
||||
--explore-portal-lower-tone: #a0462c;
|
||||
--provide-portal-lower-tone: #3A8FA3;
|
||||
--monitor-portal-lower-tone: #7c9144;
|
||||
--monitor-portal-lower-tone: #7cb021;
|
||||
--connect-portal-lower-tone: #b48536;
|
||||
--develop-portal-lower-tone: #9f4e7e;
|
||||
}
|
||||
|
||||
|
||||
.generalSearchForm,
|
||||
.publicationsSearchForm,
|
||||
.projectsSearchForm, .projectsTableSearchForm,
|
||||
|
|
@ -32,7 +31,6 @@
|
|||
background: /*url('search-background.svg')*/ #F7FCFF no-repeat center bottom ;
|
||||
background-size: cover !important;
|
||||
height: inherit;
|
||||
|
||||
}
|
||||
|
||||
.monitorApp, .searchForm {
|
||||
|
|
@ -44,17 +42,15 @@
|
|||
fill: white;
|
||||
}
|
||||
|
||||
.monitorApp .uk-text-large {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.monitorApp h1, .monitorApp h2, .monitorApp h3,
|
||||
.monitorApp h4, .monitorApp h5, .monitorApp h6 {
|
||||
color: #212121;
|
||||
.monitorApp h1, .monitorApp .uk-h1, .monitorApp h2, .monitorApp .uk-h2,
|
||||
.monitorApp h3, .monitorApp .uk-h3, .monitorApp h4, .monitorApp .uk-h4,
|
||||
.monitorApp h5, .monitorApp .uk-h5, .monitorApp h6 .monitorApp .uk-h6 {
|
||||
color: #1a1a1a;
|
||||
}
|
||||
|
||||
.monitorApp , .monitorApp .uk-card, .monitorApp .color {
|
||||
color: #707070;
|
||||
color: #424242;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.monitorApp .portal-button {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,36 @@
|
|||
.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6,
|
||||
.uk-heading-2xlarge, .uk-heading-large, .uk-heading-medium,
|
||||
.uk-heading-small, .uk-heading-xlarge, h1, h2, h3, h4, h5, h6 {
|
||||
font-family: "Roboto", sans-serif;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.uk-h1, h1 {
|
||||
font-size: 54px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.uk-h2, h2 {
|
||||
font-size: 45px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.uk-h3, h3 {
|
||||
font-size: 36px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.uk-h4, h4 {
|
||||
font-size: 27px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.uk-h5, h5 {
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.uk-h6, h6 {
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
|
@ -40,38 +40,10 @@
|
|||
<meta name="msapplication-TileColor" content="#ffffff">
|
||||
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
|
||||
<script>
|
||||
window.onerror = function (errorMsg) {
|
||||
if (errorMsg != null && (errorMsg.message && errorMsg.message.indexOf("uikit.js") != -1) || (errorMsg.url &&
|
||||
errorMsg.url.indexOf("uikit.js") != -1)) {
|
||||
console.log("********UIKIT Error ***********");
|
||||
$.getScript("assets/common-assets/common/uikit.min.js?v=1");
|
||||
$.getScript("assets/common-assets/common/uikit-icons.min.js?v=1");
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<script src="assets/common-assets/common/jquery.js"></script>
|
||||
<script src="assets/common-assets/citeproc.js"></script>
|
||||
<script src="assets/common-assets/common/uikit.min.js?v=1"></script>
|
||||
<script src="assets/common-assets/common/uikit-icons.min.js?v=1"></script>
|
||||
<script src="https://cdn.ckeditor.com/4.5.11/full-all/ckeditor.js"></script>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
console.log("Is ready - load uikit ***")
|
||||
$.getScript("assets/common-assets/common/uikit.min.js?v=1");
|
||||
$.getScript("assets/common-assets/common/uikit-icons.min.js?v=1");
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body class="" style="">
|
||||
|
||||
<div class="uk-offcanvas-content uk-height-viewport">
|
||||
|
||||
<app-root></app-root>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
/* You can add global styles to this file, and also import other style files */
|
||||
@import "~@angular/material/prebuilt-themes/indigo-pink.css";
|
||||
@import "assets/common-assets/common/theme.css";
|
||||
@import "assets/common-assets/common/custom.css";
|
||||
@import "assets/common-assets/library.css";
|
||||
@import "assets/common-assets/common/custom.css";
|
||||
@import "assets/common-assets/common/theme.css";
|
||||
@import "assets/monitor-custom.css";
|
||||
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
|
||||
@import "assets/theme-changes.css";
|
||||
|
|
|
|||
Loading…
Reference in New Issue