[Trunk|Connect]: Home Page, About almost ready. It is needed to specify gif images and their texts on create Gifs function.
git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-connect-portal/trunk@56216 d315682c-612b-4755-9ff5-7f18f6832af3
This commit is contained in:
k.triantafyllou
parent
3d7d20f746
commit
6ee80a8d0d
|
|
@ -56,8 +56,10 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
<div class="uk-position-relative uk-align-center banner-img-box">
|
||||
<img src="../../assets/banner/login.png" class="uk-padding uk-position-center">
|
||||
<div class="uk-position-relative">
|
||||
<div class="uk-align-center uk-position-center">
|
||||
<img width="296" height="285" src="../../assets/banner/login.png">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="managerOfCommunities.length == 0 && subscriberOfCommunities.length == 0" uk-grid>
|
||||
|
|
@ -181,7 +183,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin-large-top background uk-background-norepeat uk-background-cover">
|
||||
<div class="uk-margin-large-top home-background uk-background-norepeat uk-background-cover">
|
||||
<div class="uk-container uk-container-large">
|
||||
<gif-slider [gifs]="gifs" [link]="true" [linkTitle]="'learn more'" [route]="'/about'">
|
||||
</gif-slider>
|
||||
|
|
@ -222,8 +224,10 @@
|
|||
<div class="contact-background uk-background-norepeat uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color">
|
||||
<div class="uk-container uk-container-large uk-section">
|
||||
<div class="uk-flex uk-flex-middle uk-padding uk-child-width-1-1@s uk-child-width-1-2@m" uk-grid>
|
||||
<div class="uk-position-relative uk-align-center banner-img-box">
|
||||
<img src="../../assets/contact/2.png" class="uk-padding uk-position-center">
|
||||
<div class="uk-position-relative">
|
||||
<div class="uk-align-center uk-position-center">
|
||||
<img width="237" height="250" src="../../assets/contact/2.png">
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h1>Let us Help you Develop a Collaborative Science Gateway. It is fast. It is reliable.</h1>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
<div *ngIf="showLoading" class="uk-margin-large">
|
||||
<div class="uk-animation-fade uk-margin-top uk-width-1-1" role="alert"><span class="loading-gif uk-align-center" ></span></div>
|
||||
</div>
|
||||
<div *ngIf="!showLoading" class="image-front-topbar background uk-section-default uk-position-relative" uk-scrollspy="{"target":"[uk-scrollspy-class]","cls":"uk-animation-fade","delay":false}" tm-header-transparent="light">
|
||||
<div *ngIf="!showLoading" class="image-front-topbar home-background uk-section-large uk-background-norepeat uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color" uk-scrollspy="{"target":"[uk-scrollspy-class]","cls":"uk-animation-fade","delay":false}" tm-header-transparent="light">
|
||||
<div style=" min-height: 350px;" class="uk-section uk-padding-remove-bottom uk-flex uk-flex-middle">
|
||||
<div class="uk-margin-top uk-align-center">
|
||||
<div class="uk-section uk-section-large">
|
||||
<div class="uk-align-center">
|
||||
<div class="uk-container uk-container-large">
|
||||
<div class="uk-grid-divider" uk-grid>
|
||||
<div class="uk-width-1-2@m uk-width-1-1@s">
|
||||
|
|
@ -78,7 +77,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<modal-alert #AlertModal (alertOutput)="goToHome($event)">
|
||||
<div class="uk-text-center">
|
||||
Our team will respond to your submission soon.<br>
|
||||
|
|
|
|||
|
|
@ -8,16 +8,61 @@ import {FAQ} from "../openaireLibrary/utils/entities/FAQ";
|
|||
@Component({
|
||||
selector: 'learn-how',
|
||||
template: `
|
||||
<div class="image-front-topbar uk-section-overlap uk-position-relative uk-preserve-color" uk-scrollspy="{"target":"[uk-scrollspy-class]","cls":"uk-animation-fade","delay":false}" tm-header-transparent="light" tm-header-transparent-placeholder="">
|
||||
<div class="image-front-topbar" uk-scrollspy="{"target":"[uk-scrollspy-class]","cls":"uk-animation-fade","delay":false}" tm-header-transparent="light" tm-header-transparent-placeholder="">
|
||||
<div style=" min-height: calc(7.89999px + 60vh);"
|
||||
class="uk-section uk-padding-remove-bottom" >
|
||||
<div class="uk-container uk-container-large uk-section">
|
||||
class="uk-padding-remove-bottom cloud-background uk-background-norepeat uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color" >
|
||||
<div class="uk-section uk-margin-large-top">
|
||||
<div class="uk-container uk-container-large">
|
||||
<div class="uk-margin-large-top" uk-grid>
|
||||
<h1 class="uk-width-1-1" style="font-size: 41px">Learn the process</h1>
|
||||
<h5 class="uk-width-1-2@l uk-width-1-1@s">Build a <b>Gateway to your community's</b> open and linked research outcomes. Customized to your needs.</h5>
|
||||
<div class="uk-width-1-2@l uk-width-1-1@s uk-text-large">Build a <b>Gateway to your community's</b> open and linked research outcomes. Customized to your needs.</div>
|
||||
</div>
|
||||
<div class="uk-margin-large-top uk-flex-middle uk-flex uk-child-width-1-3@m uk-child-width-1-1@s" uk-grid>
|
||||
<div class="uk-flex uk-flex-middle uk-child-width-1-1@m uk-child-width-1-2@s uk-text-center" uk-grid>
|
||||
<div>
|
||||
<h5 class="uk-text-bold">1. Understanding your needs</h5>
|
||||
<div>
|
||||
First, we learn about your requirements and challenges. We help you understand Open Science practices within EOSC and together we’ll talk about how OpenAIRE RCD fits as a solution.
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-section-muted"> <!--background-->
|
||||
<div class="uk-visible@m">
|
||||
<h5 class=" uk-text-bold">4. Roll out the service</h5>
|
||||
<div>
|
||||
We jointly roll out your new Science Gateway. You take over the business operations and start engaging your researchers, we take care of the smooth operation of the e-service.
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-hidden@m">
|
||||
<h5 class=" uk-text-bold">2. Develop a pilot</h5>
|
||||
<div>
|
||||
How do you work today, and how would you like to work tomorrow? We tranlate your needs into rules and processes and we configure operational OpenAIRE services. By the end of this phase, we’ll have defined the basic configuration of your Community Gateway. </div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<img src="../../assets/about/cicle.png">
|
||||
</div>
|
||||
<div class="uk-flex uk-flex-middle uk-child-width-1-1@m uk-child-width-1-2@s uk-text-center" uk-grid>
|
||||
<div class="uk-visible@m">
|
||||
<h5 class=" uk-text-bold">2. Develop a pilot</h5>
|
||||
<div>
|
||||
How do you work today, and how would you like to work tomorrow? We tranlate your needs into rules and processes and we configure operational OpenAIRE services. By the end of this phase, we’ll have defined the basic configuration of your Community Gateway. </div>
|
||||
</div>
|
||||
<div class="uk-hidden@m">
|
||||
<h5 class=" uk-text-bold">4. Roll out the service</h5>
|
||||
<div>
|
||||
We jointly roll out your new Science Gateway. You take over the business operations and start engaging your researchers, we take care of the smooth operation of the e-service. </div>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="uk-text-bold">3. Test and Validate</h5>
|
||||
<div>
|
||||
You validate and test your new Science Gateway (portal) with your experts and community to ensure all workflows are in place and quality of data meets your standards. If needed, we work together in another iteration to further refine and adapt to your needs.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-section">
|
||||
<div class="uk-container uk-container-large">
|
||||
<gif-slider [gifs]="first" [gifRight]="true"></gif-slider>
|
||||
</div>
|
||||
|
|
@ -25,7 +70,7 @@ import {FAQ} from "../openaireLibrary/utils/entities/FAQ";
|
|||
<div class="uk-container uk-container-large">
|
||||
<gif-slider [gifs]="second"></gif-slider>
|
||||
</div>
|
||||
<div class="uk-section-muted"> <!--background-->
|
||||
<div class="contact-background uk-background-norepeat uk-background-cover uk-section-secondary uk-section-overlap uk-position-relative uk-preserve-color">
|
||||
<div class="uk-container uk-container-large uk-section">
|
||||
<div class="uk-flex uk-flex-middle uk-child-width-1-1@s uk-child-width-1-2@m" uk-grid>
|
||||
<div>
|
||||
|
|
@ -35,13 +80,15 @@ import {FAQ} from "../openaireLibrary/utils/entities/FAQ";
|
|||
<a class="uk-button portal-button" routerLinkActive="router-link-active" routerLink="/contact-us"> CONTACT US</a>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
eikona
|
||||
<div class="uk-position-relative">
|
||||
<div class="uk-align-center uk-position-center">
|
||||
<img width="263" height="250" src="../../assets/contact/4.png">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="questions.length > 0" class="uk-container">
|
||||
</div>
|
||||
<div *ngIf="questions.length > 0 else comingSoon" class="uk-container">
|
||||
<h1 class="uk-margin-remove-bottom uk-margin-large-top uk-width-1-1">Frequently Asked Questions</h1>
|
||||
<div class="uk-width-1-1 uk-section">
|
||||
<ul uk-accordion>
|
||||
|
|
@ -55,32 +102,27 @@ import {FAQ} from "../openaireLibrary/utils/entities/FAQ";
|
|||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<ng-template #comingSoon>
|
||||
<div class="uk-container">
|
||||
<h1 class="uk-margin-remove-bottom uk-margin-large-top uk-width-1-1">Frequently Asked Questions</h1>
|
||||
<div class="uk-width-1-1 uk-section uk-text-center uk-text-large uk-text-bold uk-text-uppercase">
|
||||
Coming Soon
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
</div>
|
||||
`
|
||||
})
|
||||
export class LearnHowComponent {
|
||||
public piwiksub: any;
|
||||
questions: FAQ[] = [
|
||||
{
|
||||
/*{
|
||||
question: 'Coming soon?',
|
||||
answer: 'Yes'
|
||||
},
|
||||
/*{
|
||||
question: 'Why should my company do a design sprint?',
|
||||
answer: 'Lorem ipsum dolor sit amet, consectetur adipisicing 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.'
|
||||
},
|
||||
{
|
||||
question: 'Why should my company do a design sprint?',
|
||||
answer: 'Lorem ipsum dolor sit amet, consectetur adipisicing 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.'
|
||||
},
|
||||
{
|
||||
question: 'Why should my company do a design sprint?',
|
||||
answer: 'Lorem ipsum dolor sit amet, consectetur adipisicing 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.'
|
||||
},
|
||||
{
|
||||
question: 'Why should my company do a design sprint?',
|
||||
answer: 'Lorem ipsum dolor sit amet, consectetur adipisicing 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.'
|
||||
question: 'Could you be more specific?',
|
||||
answer: 'No'
|
||||
}*/
|
||||
];
|
||||
public first: {"gif": string, "header": string, "text"}[] = [];
|
||||
|
|
|
|||
|
|
@ -50,11 +50,6 @@
|
|||
background-color: rgb(255, 255, 255);
|
||||
}
|
||||
|
||||
.banner-img-box {
|
||||
width: 300px;
|
||||
height: 290px;
|
||||
}
|
||||
|
||||
.contact-background {
|
||||
background-image: url("./contact/background.png") !important;
|
||||
background-color: rgb(255, 255, 255);
|
||||
|
|
@ -70,7 +65,7 @@
|
|||
background-color: rgb(255, 255, 255);
|
||||
}
|
||||
|
||||
.background {
|
||||
.home-background {
|
||||
background-image: url("home/background.jpg") !important;
|
||||
background-color: rgb(255, 255, 255);
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue