MaDgIK
/
openaire-library
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Rename OpenAIRE Research Graph into OpenAIRE Graph and add the new logo in powered by sections.

This commit is contained in:
Konstantinos Triantafyllou 2023-05-15 16:47:25 +03:00
parent 73f2215c07
commit 7cf23698d7
7 changed files with 15 additions and 406 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

299
monitor/how/how.component.less
View File

@ -1,299 +0,0 @@
@import "~src/assets/openaire-theme/less/_import-variables";
@media only screen and (min-width: @breakpoint-small) {
.how .first > div:first-child {
position: relative;
}
.how .first > div:first-child:after {
content: "we";
font-size: 20px;
font-weight: 600;
text-align: center;
padding-bottom: 5%;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/1.svg");
right: -21%;
top: 33%;
width: 20%;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
}
.how .second > div:first-child {
position: relative;
padding: 0 10% 0 20%;
}
.how .second > div:first-child:after {
content: "and";
font-size: 20px;
font-weight: 600;
text-align: center;
padding-bottom: 5%;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/2.svg");
right: -17%;
top: 33%;
width: 30%;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
}
.how .third {
position: relative;
}
.how .third > div:first-child {
padding: 0 14% 0 13%;
}
.how .third:after {
content: "on which";
font-size: 20px;
font-weight: 600;
padding-right: 30%;
padding-top: 5%;
padding-bottom: 5%;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg");
bottom: -6%;
left: 13%;
transform: translateY(100%);
width: 140px;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.how .fourth {
padding: 10% 3% 0 3%;
}
.how .fourth > div:first-child {
position: relative;
padding: 0 16% 0 16%;
}
.how .fourth> div:first-child:after {
content: "and";
font-size: 20px;
font-weight: 600;
text-align: center;
padding-bottom: 5%;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/4.svg");
left: -18%;
top: 36%;
width: 30%;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
}
.how .fifth {
padding: 11% 2% 0 2%;
}
.how .fifth > div:first-child {
position: relative;
}
.how .fifth > div:first-child:after {
content: "We";
font-size: 20px;
font-weight: 600;
text-align: center;
padding-bottom: 5%;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/5.svg");
left: -35%;
top: 36%;
width: 30%;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
}
.how .sixth {
padding: 10% 5% 0 0;
}
.how .sixth > div:first-child {
padding: 0 15% 0 15%;
}
.how .final {
padding: 10% 20% 0 20%;
}
.how .final > div:first-child {
position: relative;
}
.how .final > div:first-child:before {
content: "";
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/6.svg");
left: -26%;
top: -20%;
height: 70%;
width: 30%;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
}
.how .final > div:first-child:after {
content: "We make visualizations, graphs, reports and deliver all in a customisable tool";
font-size: 20px;
position: absolute;
top: 30%;
width: 250px;
padding: 8% 0 5% 0;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
}
}
@media only screen and (max-width: @breakpoint-xsmall-max) {
.how .first {
position: relative;
padding-bottom: 30%;
}
.how .first:after {
content: "we";
text-align: center;
padding: 10% 34% 10% 0;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg");
left: 26%;
top: 79%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.how .second {
position: relative;
padding: 0 10% 30% 10%;
}
.how .second:after {
content: "and";
text-align: center;
padding: 10% 34% 10% 0;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg");
left: 25%;
top: 80%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.how .third {
position: relative;
padding: 0 5% 30% 5%;
}
.how .third:after {
content: "on which";
font-weight: bold;
text-align: center;
padding: 10% 41% 10% 0;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg");
left: 15%;
top: 83%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.how .fourth {
position: relative;
padding: 0 0 30% 0;
}
.how .fourth > div:first-child {
padding: 0 10% 0 10%;
}
.how .fourth:after {
content: "and";
text-align: center;
padding: 10% 34% 10% 0;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg");
left: 26%;
top: 79%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.how .fifth {
position: relative;
padding: 0 2% 30% 2%;
}
.how .fifth:after {
content: "We";
text-align: center;
padding: 10% 34% 10% 0;
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/3.svg");
left: 27%;
top: 76%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.how .sixth {
padding: 0 5% 30% 0;
}
.how .sixth > div:first-child {
padding: 0 15% 0 15%;
}
.how .final {
padding: 20% 0 20% 0;
}
.how .final > div:first-child {
position: relative;
}
.how .final > div:first-child:before {
content: "";
position: absolute;
background-image: url("~src/assets/common-assets/monitor-assets/green-arrows/6.svg");
left: 34%;
top: -70%;
height: 70%;
width: 30%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.how .final > div:first-child:after {
content: "We make visualizations, graphs, reports and deliver all in a customisable tool";
text-align: center;
position: absolute;
left: -62%;
top: 85%;
width: 300px;
padding: 12% 0 0 54%;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
}

72
monitor/how/how.component.ts
View File

@ -1,72 +0,0 @@
import {Component} from "@angular/core";
@Component({
selector: 'how',
template: `
<div class="how" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 100">
<div class="uk-flex uk-flex-wrap">
<div class="uk-width-1-3@s first" uk-scrollspy-class>
<div>
<img src="assets/common-assets/monitor-assets/how/1.png" loading="lazy">
</div>
<div class="uk-text-center uk-text-large">
<span class="uk-text-uppercase uk-text-bold">Starting</span> from existing<br>research-related data sources
</div>
</div>
<div class="uk-width-1-3@s second" uk-scrollspy-class>
<div>
<img src="assets/common-assets/monitor-assets/how/2.png" loading="lazy">
</div>
</div>
<div class="uk-width-1-3@s third" uk-scrollspy-class>
<div>
<img src="assets/common-assets/monitor-assets/how/3.png" loading="lazy">
</div>
<div class="uk-text-center uk-text-large">
build an open, global<br>and trusted Research graph
</div>
</div>
</div>
<div class="uk-flex uk-flex-wrap">
<div class="uk-width-1-3@s fourth uk-flex-last@s" uk-scrollspy-class>
<div>
<img src="assets/common-assets/monitor-assets/how/4.png" loading="lazy">
</div>
<div class="uk-text-center">
we perform <span class="uk-text-uppercase uk-text-bold">Statistical <br> Analysis</span> and produce <br>
<span class="uk-text-primary">Open Science Indicators</span>
</div>
</div>
<div class="uk-width-1-3@s fifth" uk-scrollspy-class>
<div>
<img src="assets/common-assets/monitor-assets/how/5.png" loading="lazy">
</div>
<div class="uk-text-center">
furthermore <span class="uk-text-uppercase uk-text-bold">Network<br>Analysis</span> producing <br>
<span class="uk-text-primary">Collaboration Indicators</span>
</div>
</div>
<div class="uk-width-1-3@s sixth uk-flex-first@s" uk-scrollspy-class>
<div>
<img src="assets/common-assets/monitor-assets/how/6.png" loading="lazy">
</div>
<div class="uk-text-center">
Often combine with external data <br>
(patents, social, company) and
perform <br><span class="uk-text-uppercase uk-text-bold">Impact Analysis</span> to
produce <br><span class="uk-text-primary">Innovation Indicators</span>
</div>
</div>
</div>
<div class="final" uk-scrollspy-class>
<div>
<img src="assets/common-assets/monitor-assets/how/7.png" loading="lazy">
</div>
</div>
</div>
`,
styleUrls: ['how.component.less']
})
export class HowComponent {
}

12
monitor/how/how.module.ts
View File

@ -1,12 +0,0 @@
import {NgModule} from "@angular/core";
import {CommonModule} from "@angular/common";
import {HowComponent} from "./how.component";
@NgModule({
imports: [CommonModule],
declarations: [HowComponent],
exports: [HowComponent]
})
export class HowModule {
}

4
monitor/indicators/indicator-themes.component.ts
View File

@ -26,7 +26,7 @@ import {Subscriber} from "rxjs";
<div> <div>
<h5>Indicator themes that we are covering in the Monitor dashboards.</h5> <h5>Indicator themes that we are covering in the Monitor dashboards.</h5>
<p> <p>
This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the <a href="https://graph.openaire.eu" class="text-graph" target="_blank">OpenAIRE Research Graph</a>. We are at your disposal, should you have any recommendations! This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the <a href="https://graph.openaire.eu" class="text-graph" target="_blank">OpenAIRE Graph</a>. We are at your disposal, should you have any recommendations!
</p> </p>
<p> <p>
Check out the indicator pages (for <a [routerLink]="['../funder']" [relativeTo]="route">funders</a>, Check out the indicator pages (for <a [routerLink]="['../funder']" [relativeTo]="route">funders</a>,
@ -50,7 +50,7 @@ import {Subscriber} from "rxjs";
<div> <div>
<h5 class="uk-margin-large-top uk-margin-large-bottom">Indicator themes that we are covering in the Monitor dashboards.</h5> <h5 class="uk-margin-large-top uk-margin-large-bottom">Indicator themes that we are covering in the Monitor dashboards.</h5>
<p> <p>
This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the <a href="https://graph.openaire.eu" class="text-graph" target="_blank">OpenAIRE Research Graph</a>. We are at your disposal, should you have any recommendations! This is the current set of indicator themes we cover. We’ll keep enriching it as new requests and data are coming into the <a href="https://graph.openaire.eu" class="text-graph" target="_blank">OpenAIRE Graph</a>. We are at your disposal, should you have any recommendations!
</p> </p>
<p> <p>
Check out the indicator pages (for <a [routerLink]="['../funder']" [relativeTo]="route">funders</a>, Check out the indicator pages (for <a [routerLink]="['../funder']" [relativeTo]="route">funders</a>,

12
monitor/methodology/methodological-approach.component.ts
View File

@ -32,7 +32,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
</li> </li>
<li><span class="uk-text-bold">Coverage and accuracy:</span> As detailed in <a <li><span class="uk-text-bold">Coverage and accuracy:</span> As detailed in <a
href="https://graph.openaire.eu/" target="_blank">graph.openaire.eu</a> href="https://graph.openaire.eu/" target="_blank">graph.openaire.eu</a>
multiple data sources are ingested in the OpenAIRE research graph for coverage to the fullest extent multiple data sources are ingested in the OpenAIRE Graph for coverage to the fullest extent
possible, in order to provide meaningful indicators. possible, in order to provide meaningful indicators.
</li> </li>
<li><span class="uk-text-bold">Clarity and replicability:</span> We describe our construction methodology in <li><span class="uk-text-bold">Clarity and replicability:</span> We describe our construction methodology in
@ -69,7 +69,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
<h2 class="uk-margin-small-top">How? It’s about open data and collaboration<span class="text-graph">.</span></h2> <h2 class="uk-margin-small-top">How? It’s about open data and collaboration<span class="text-graph">.</span></h2>
<ul class="uk-list uk-list-bullet uk-margin-large-top"> <ul class="uk-list uk-list-bullet uk-margin-large-top">
<li class="uk-flex uk-flex-column uk-margin-medium-bottom"> <li class="uk-flex uk-flex-column uk-margin-medium-bottom">
<span class="uk-text-large uk-margin-small-bottom">Built on the <span class="uk-text-bold">OpenAire Research Graph</span></span> <span class="uk-text-large uk-margin-small-bottom">Built on the <span class="uk-text-bold">OpenAire Graph</span></span>
<span>Linked scholarly information from open initiatives around the world. Beyond publications.</span> <span>Linked scholarly information from open initiatives around the world. Beyond publications.</span>
</li> </li>
<li class="uk-flex uk-flex-column uk-margin-medium-bottom"> <li class="uk-flex uk-flex-column uk-margin-medium-bottom">
@ -84,7 +84,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
</div> </div>
</div> </div>
<div class="uk-position-relative"> <div class="uk-position-relative">
<img class="uk-visible@m uk-height-1-1 uk-position-center-right" src="assets/common-assets/common/graph-nodes.svg" alt="OpenAIRE Research Graph" loading="lazy"> <img class="uk-visible@m uk-height-1-1 uk-position-center-right" src="assets/common-assets/common/graph-nodes.svg" alt="OpenAIRE Graph" loading="lazy">
</div> </div>
</div> </div>
</div> </div>
@ -105,7 +105,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
</li> </li>
<li class="uk-margin-small-bottom"><span class="uk-text-bold">Coverage and accuracy:</span> As detailed in <a <li class="uk-margin-small-bottom"><span class="uk-text-bold">Coverage and accuracy:</span> As detailed in <a
href="https://graph.openaire.eu/" target="_blank">graph.openaire.eu</a> href="https://graph.openaire.eu/" target="_blank">graph.openaire.eu</a>
multiple data sources are ingested in the OpenAIRE research graph for coverage to the fullest extent multiple data sources are ingested in the OpenAIRE Graph for coverage to the fullest extent
possible, in order to provide meaningful indicators. possible, in order to provide meaningful indicators.
</li> </li>
<li class="uk-margin-small-bottom"><span class="uk-text-bold">Clarity and replicability:</span> We describe our construction methodology in <li class="uk-margin-small-bottom"><span class="uk-text-bold">Clarity and replicability:</span> We describe our construction methodology in
@ -131,7 +131,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
</div> </div>
</div> </div>
<div class="uk-margin-xlarge-top uk-padding-large"> <div class="uk-margin-xlarge-top uk-padding-large">
<img src="assets/common-assets/common/graph-nodes.svg" alt="OpenAIRE Research Graph" loading="lazy"> <img src="assets/common-assets/common/graph-nodes.svg" alt="OpenAIRE Graph" loading="lazy">
</div> </div>
<div class="uk-margin-top uk-margin-large-bottom"> <div class="uk-margin-top uk-margin-large-bottom">
<span class="uk-text-large text-graph">Completeness, inclusion, transparency and replicability</span> <span class="uk-text-large text-graph">Completeness, inclusion, transparency and replicability</span>
@ -139,7 +139,7 @@ import {Breadcrumb} from "../../utils/breadcrumbs/breadcrumbs.component";
<h2 class="uk-margin-remove-top uk-padding uk-padding-remove-vertical uk-padding-remove-left">It’s about open data and collaboration<span class="text-graph">.</span></h2> <h2 class="uk-margin-remove-top uk-padding uk-padding-remove-vertical uk-padding-remove-left">It’s about open data and collaboration<span class="text-graph">.</span></h2>
<ul class="uk-list uk-list-bullet uk-margin-large-top"> <ul class="uk-list uk-list-bullet uk-margin-large-top">
<li class="uk-flex uk-flex-column uk-margin-medium-bottom"> <li class="uk-flex uk-flex-column uk-margin-medium-bottom">
<span class="uk-text-large uk-margin-small-bottom">Built on the <span class="uk-text-bold">OpenAire Research Graph</span></span> <span class="uk-text-large uk-margin-small-bottom">Built on the <span class="uk-text-bold">OpenAire Graph</span></span>
<span>Linked scholarly information from open initiatives around the world. Beyond publications.</span> <span>Linked scholarly information from open initiatives around the world. Beyond publications.</span>
</li> </li>
<li class="uk-flex uk-flex-column uk-margin-medium-bottom"> <li class="uk-flex uk-flex-column uk-margin-medium-bottom">

8
monitor/methodology/methodology.module.ts
View File

@ -5,10 +5,7 @@ import {MethodolocigalApproachComponent} from "./methodological-approach.compone
import {RouterModule} from "@angular/router"; import {RouterModule} from "@angular/router";
import {PreviousRouteRecorder} from "../../utils/piwik/previousRouteRecorder.guard"; import {PreviousRouteRecorder} from "../../utils/piwik/previousRouteRecorder.guard";
import {PageContentModule} from "../../dashboard/sharedComponents/page-content/page-content.module"; import {PageContentModule} from "../../dashboard/sharedComponents/page-content/page-content.module";
import {HowModule} from "../how/how.module";
import {IconsModule} from "../../utils/icons/icons.module"; import {IconsModule} from "../../utils/icons/icons.module";
import {IconsService} from "../../utils/icons/icons.service";
import {graph} from "../../utils/icons/icons";
import {BreadcrumbsModule} from "../../utils/breadcrumbs/breadcrumbs.module"; import {BreadcrumbsModule} from "../../utils/breadcrumbs/breadcrumbs.module";
import {SliderTabsModule} from "../../sharedComponents/tabs/slider-tabs.module"; import {SliderTabsModule} from "../../sharedComponents/tabs/slider-tabs.module";
import {HelperModule} from "../../utils/helper/helper.module"; import {HelperModule} from "../../utils/helper/helper.module";
@ -32,11 +29,8 @@ import {HelperModule} from "../../utils/helper/helper.module";
component: MethodolocigalApproachComponent, component: MethodolocigalApproachComponent,
canDeactivate: [PreviousRouteRecorder] canDeactivate: [PreviousRouteRecorder]
} }
]), PageContentModule, HowModule, IconsModule, BreadcrumbsModule, SliderTabsModule, HelperModule], ]), PageContentModule, IconsModule, BreadcrumbsModule, SliderTabsModule, HelperModule],
exports: [TerminologyComponent, MethodolocigalApproachComponent] exports: [TerminologyComponent, MethodolocigalApproachComponent]
}) })
export class MethodologyModule { export class MethodologyModule {
constructor(private iconsService: IconsService) {
this.iconsService.registerIcons([graph]);
}
} }

14
monitor/methodology/terminology.component.ts
View File

@ -42,10 +42,9 @@ declare var ResizeObserver;
<div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="bottom: true" <div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="bottom: true"
[attr.offset]="graph_offset"> [attr.offset]="graph_offset">
<div class="uk-container uk-container-large uk-margin-small-top uk-margin-small-bottom"> <div class="uk-container uk-container-large uk-margin-small-top uk-margin-small-bottom">
<icon name="graph" customClass="text-graph"></icon> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
<span class="uk-margin-small-left uk-text-meta">More information for </span> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 17px;">
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a> </a>
<span class="uk-text-meta">.</span>
</div> </div>
</div> </div>
<div class="uk-section uk-container uk-container-large" uk-scrollspy-class> <div class="uk-section uk-container uk-container-large" uk-scrollspy-class>
@ -87,10 +86,9 @@ declare var ResizeObserver;
<div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="bottom: true" <div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="bottom: true"
[attr.offset]="graph_offset"> [attr.offset]="graph_offset">
<div class="uk-container uk-container-large uk-margin-small-top uk-margin-small-bottom uk-text-xsmall uk-text-right"> <div class="uk-container uk-container-large uk-margin-small-top uk-margin-small-bottom uk-text-xsmall uk-text-right">
<icon name="graph" customClass="text-graph"></icon> <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
<span class="uk-margin-small-left uk-text-meta">More information for </span> <img src="assets/common-assets/openaire-badge-1.png" alt="Powered by OpenAIRE graph" style="height: 17px;">
<a href="https://graph.openaire.eu" target="_blank" class="text-graph">OpenAIRE Research Graph</a> </a>
<span class="uk-text-meta">.</span>
</div> </div>
</div> </div>
<div> <div>