diff --git a/dmp-frontend/src/app/app-routing.module.ts b/dmp-frontend/src/app/app-routing.module.ts index 34afcecb2..8ceeea0a5 100644 --- a/dmp-frontend/src/app/app-routing.module.ts +++ b/dmp-frontend/src/app/app-routing.module.ts @@ -4,11 +4,12 @@ import { ReloadHelperComponent } from '@app/ui/misc/reload-helper/reload-helper. import { B2AccessLoginComponent } from './ui/auth/login/b2access/b2access-login.component'; import { Oauth2DialogModule } from './ui/misc/oauth2-dialog/oauth2-dialog.module'; import { Oauth2DialogComponent } from './ui/misc/oauth2-dialog/oauth2-dialog.component'; +import { AppComponent } from './app.component'; const appRoutes: Routes = [ { path: '', - redirectTo: '/home', + component: AppComponent, data: { breadcrumbs: false, title: 'GENERAL.TITLES.GENERAL' @@ -153,6 +154,13 @@ const appRoutes: Routes = [ breadcrumb: true } }, + { + path: 'splash', + loadChildren: () => import('./ui/splash/splash.module').then(m => m.SplashModule), + data: { + breadcrumb: true + } + }, { path: 'unauthorized', loadChildren: () => import('./ui/misc/unauthorized/unauthorized.module').then(m => m.UnauthorizedModule), diff --git a/dmp-frontend/src/app/app.component.html b/dmp-frontend/src/app/app.component.html index e75e35237..632595d63 100644 --- a/dmp-frontend/src/app/app.component.html +++ b/dmp-frontend/src/app/app.component.html @@ -1,4 +1,4 @@ -
+
- + + + diff --git a/dmp-frontend/src/app/ui/splash/splash.component.scss b/dmp-frontend/src/app/ui/splash/splash.component.scss new file mode 100644 index 000000000..b205519fe --- /dev/null +++ b/dmp-frontend/src/app/ui/splash/splash.component.scss @@ -0,0 +1,4 @@ +.splash-wrapper { + width: 100%; + border: none; +} diff --git a/dmp-frontend/src/app/ui/splash/splash.component.ts b/dmp-frontend/src/app/ui/splash/splash.component.ts new file mode 100644 index 000000000..c37bf8a48 --- /dev/null +++ b/dmp-frontend/src/app/ui/splash/splash.component.ts @@ -0,0 +1,52 @@ +import { Component, OnInit } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { ConfigurationService } from '@app/core/services/configuration/configuration.service'; +import { DomSanitizer } from '@angular/platform-browser'; +import { BaseComponent } from '@common/base/base.component'; +import { takeUntil } from 'rxjs/operators'; + +@Component({ + selector: 'app-splash', + templateUrl: './splash.component.html', + styleUrls: ['./splash.component.scss'] +}) +export class SplashComponent extends BaseComponent implements OnInit { + + splashHTML: any; + + constructor( + private httpClient: HttpClient, + private configurationService: ConfigurationService, + private sanitizer: DomSanitizer + ) { + super(); + } + + ngOnInit() { + // this.httpClient.get(this.configurationService.splashPath, {responseType: "text"}) + // .pipe(takeUntil(this._destroyed)).subscribe(response => { + // const blob = new Blob([response], { type: 'text/html' }); + // this.readBlob(blob); + // }); + // this.splashHTML = this.sanitizer.bypassSecurityTrustHtml(`${this.configurationService.app}/${this.configurationService.splashPath}`); + } + + // readBlob(blob: Blob) { + // const fr = new FileReader(); + // fr.onload = ev => { + // this.splashHTML = this.sanitizer.bypassSecurityTrustHtml(fr.result as string); + // //this.parse(); + // }; + // fr.readAsText(blob); + // } + + resizeFrame() { + const frame: HTMLIFrameElement = (document.getElementById('splash') as HTMLIFrameElement); + frame.style.height = frame.contentWindow.document.body.scrollHeight + 'px'; + } + + getSplashUrl() { + // return this.sanitizer.bypassSecurityTrustHtml(this.configurationService.splashPath); + } + +} diff --git a/dmp-frontend/src/app/ui/splash/splash.module.ts b/dmp-frontend/src/app/ui/splash/splash.module.ts new file mode 100644 index 000000000..ff620291a --- /dev/null +++ b/dmp-frontend/src/app/ui/splash/splash.module.ts @@ -0,0 +1,15 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { SplashComponent } from './splash.component'; +import { SplashRoutingModule } from './slash.routing'; + + + +@NgModule({ + declarations: [SplashComponent], + imports: [ + CommonModule, + SplashRoutingModule + ] +}) +export class SplashModule { } diff --git a/dmp-frontend/src/assets/config/config.json b/dmp-frontend/src/assets/config/config.json index 09730c8b9..be0623a0a 100644 --- a/dmp-frontend/src/assets/config/config.json +++ b/dmp-frontend/src/assets/config/config.json @@ -51,5 +51,6 @@ "lockInterval": 60000, "guideAssets": "assets/images/guide", "allowOrganizationCreator": true, - "doiLink": "https://sandbox.zenodo.org/record/" + "doiLink": "https://sandbox.zenodo.org/record/", + "useSplash": false } diff --git a/dmp-frontend/src/assets/splash/assets/img/1.png b/dmp-frontend/src/assets/splash/assets/img/1.png new file mode 100644 index 000000000..247427d2e Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/1.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/2 - Copy.png b/dmp-frontend/src/assets/splash/assets/img/2 - Copy.png new file mode 100644 index 000000000..5b319ee91 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/2 - Copy.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/2.png b/dmp-frontend/src/assets/splash/assets/img/2.png new file mode 100644 index 000000000..853913f2d Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/2.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/3.png b/dmp-frontend/src/assets/splash/assets/img/3.png new file mode 100644 index 000000000..59d342fd2 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/3.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/Asset 10.svg b/dmp-frontend/src/assets/splash/assets/img/Asset 10.svg new file mode 100644 index 000000000..a42150dc7 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/Asset 10.svg @@ -0,0 +1 @@ +Asset 10 \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/Asset 11.svg b/dmp-frontend/src/assets/splash/assets/img/Asset 11.svg new file mode 100644 index 000000000..db1717e97 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/Asset 11.svg @@ -0,0 +1 @@ +Asset 11 \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/Asset 12.svg b/dmp-frontend/src/assets/splash/assets/img/Asset 12.svg new file mode 100644 index 000000000..03a776946 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/Asset 12.svg @@ -0,0 +1 @@ +Asset 12 \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/Asset 13.svg b/dmp-frontend/src/assets/splash/assets/img/Asset 13.svg new file mode 100644 index 000000000..69b6c41f4 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/Asset 13.svg @@ -0,0 +1 @@ +Asset 13 \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/Asset 14.svg b/dmp-frontend/src/assets/splash/assets/img/Asset 14.svg new file mode 100644 index 000000000..210c1e8fa --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/Asset 14.svg @@ -0,0 +1 @@ +Asset 14 \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/Asset 15.svg b/dmp-frontend/src/assets/splash/assets/img/Asset 15.svg new file mode 100644 index 000000000..7d954c6ee --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/Asset 15.svg @@ -0,0 +1 @@ +Asset 15 \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/Cc.logo.circle.png b/dmp-frontend/src/assets/splash/assets/img/Cc.logo.circle.png new file mode 100644 index 000000000..69238f667 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/Cc.logo.circle.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/Logo_Horizontal_white_small.png b/dmp-frontend/src/assets/splash/assets/img/Logo_Horizontal_white_small.png new file mode 100644 index 000000000..c453dc65b Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/Logo_Horizontal_white_small.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/argos-logo - Copy.svg b/dmp-frontend/src/assets/splash/assets/img/argos-logo - Copy.svg new file mode 100644 index 000000000..675d543b5 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/argos-logo - Copy.svg @@ -0,0 +1,101 @@ + + + + + diff --git a/dmp-frontend/src/assets/splash/assets/img/argos-logo.svg b/dmp-frontend/src/assets/splash/assets/img/argos-logo.svg new file mode 100644 index 000000000..01d0737b5 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/argos-logo.svg @@ -0,0 +1,101 @@ + + + + + diff --git a/dmp-frontend/src/assets/splash/assets/img/fav-icon.png b/dmp-frontend/src/assets/splash/assets/img/fav-icon.png new file mode 100644 index 000000000..c7be63e89 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/fav-icon.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/gradinet-background.svg b/dmp-frontend/src/assets/splash/assets/img/gradinet-background.svg new file mode 100644 index 000000000..05b13757b --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/gradinet-background.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/ic_check_circle_24px.svg b/dmp-frontend/src/assets/splash/assets/img/ic_check_circle_24px.svg new file mode 100644 index 000000000..306e7a8f4 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/ic_check_circle_24px.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/laptop.png b/dmp-frontend/src/assets/splash/assets/img/laptop.png new file mode 100644 index 000000000..a2b398bfa Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/laptop.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/logo-1.png b/dmp-frontend/src/assets/splash/assets/img/logo-1.png new file mode 100644 index 000000000..ecad4fb1a Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/logo-1.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/logo-2.png b/dmp-frontend/src/assets/splash/assets/img/logo-2.png new file mode 100644 index 000000000..59db41c03 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/logo-2.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-1.jpg b/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-1.jpg new file mode 100644 index 000000000..8f0dbd4ef Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-1.jpg differ diff --git a/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-2.jpg b/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-2.jpg new file mode 100644 index 000000000..7140bfe79 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-2.jpg differ diff --git a/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-3.jpg b/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-3.jpg new file mode 100644 index 000000000..b8539e75b Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/logo-wrong-use-3.jpg differ diff --git a/dmp-frontend/src/assets/splash/assets/img/moocard-1.png b/dmp-frontend/src/assets/splash/assets/img/moocard-1.png new file mode 100644 index 000000000..52c322896 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/moocard-1.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/moocard-2.png b/dmp-frontend/src/assets/splash/assets/img/moocard-2.png new file mode 100644 index 000000000..aeec36679 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/moocard-2.png differ diff --git a/dmp-frontend/src/assets/splash/assets/img/template-preview-1.svg b/dmp-frontend/src/assets/splash/assets/img/template-preview-1.svg new file mode 100644 index 000000000..6035d19be --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/template-preview-1.svg @@ -0,0 +1 @@ +Select TemplateSelect a template from the listDataset description - FunderHorizon 2020Dataset description - Research CommunityFWF - Austrian Science FundDataset description - InstitutionClarin-DDataset description - InitiativeIOSSG \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/template-preview-2.svg b/dmp-frontend/src/assets/splash/assets/img/template-preview-2.svg new file mode 100644 index 000000000..3ba04b686 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/template-preview-2.svg @@ -0,0 +1 @@ +Selected templateWill you use metadata to describe the data?Dublin CoreWill you be re-using data?YesNoWhere will your data be preserved?Master copy stored on University network storage; regular backup/sync to University network when offsite; regular backup to UvA/AUAS figshare; \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/template-preview-3.svg b/dmp-frontend/src/assets/splash/assets/img/template-preview-3.svg new file mode 100644 index 000000000..48cc13e43 --- /dev/null +++ b/dmp-frontend/src/assets/splash/assets/img/template-preview-3.svg @@ -0,0 +1 @@ +ShareImportExportPublish inPDFDOCXMLJSONJSON+ compatible repositories \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/assets/img/univ-access.png b/dmp-frontend/src/assets/splash/assets/img/univ-access.png new file mode 100644 index 000000000..735b697a2 Binary files /dev/null and b/dmp-frontend/src/assets/splash/assets/img/univ-access.png differ diff --git a/dmp-frontend/src/assets/splash/css/argos.code-workspace b/dmp-frontend/src/assets/splash/css/argos.code-workspace new file mode 100644 index 000000000..2a0ed79b2 --- /dev/null +++ b/dmp-frontend/src/assets/splash/css/argos.code-workspace @@ -0,0 +1,7 @@ +{ + "folders": [ + { + "path": ".." + } + ] +} \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/css/footer.css b/dmp-frontend/src/assets/splash/css/footer.css new file mode 100644 index 000000000..28cf11a9f --- /dev/null +++ b/dmp-frontend/src/assets/splash/css/footer.css @@ -0,0 +1,60 @@ +.footer { + background: #F3F3F3 0% 0% no-repeat padding-box; + opacity: 1; +} + +.footer-text { + text-align: left; + font-size: 0.75rem; + font-weight: 300; + font-family: 'Roboto', sans-serif; + color: #000000; + opacity: 1; + max-width: 460px; + margin: 0rem 2.5rem; +} + +.btn-social { + border: 1px solid black !important; + color: black; + font-size: 28px; + opacity: 0.8; +} + +.twitter, .youtube, .linkedin { + padding: .375rem .575rem !important; +} + +.newsletter { + text-align: left; + font-weight: 500; + font-size: 1.18rem; + color: #000000; + opacity: 1; +} + +.wifi-rotate { + color: black; + -ms-transform: rotate(45deg); + transform: rotate(45deg); +} + +.conditions-policy { + text-align: left; + text-decoration: underline; + font-weight: 400; + font-family: 'Roboto',sans-serif; + font-size: 1rem; + color: #000000; + opacity: 1; +} + +.licence { + text-align: left; + font-weight: 300; + font-family: 'Roboto',sans-serif; + font-size: 0.75rem; + line-height: 2.4; + color: #000000; + opacity: 1; +} diff --git a/dmp-frontend/src/assets/splash/css/header.css b/dmp-frontend/src/assets/splash/css/header.css new file mode 100644 index 000000000..69bc2004c --- /dev/null +++ b/dmp-frontend/src/assets/splash/css/header.css @@ -0,0 +1,29 @@ +header.head { + text-align: center; + color: #fff; + background-image: url("../assets/img/gradinet-background.svg"); + background-repeat: no-repeat; + background-size: cover; +} + +.head-subtitles { + margin-top: 1.93rem; +} + +.head-subtitle { + margin-top: 1.65rem; + width: 23.4rem; +} + +.head-start-dmp { + display: flex; + margin-top: 2.6rem; +} + +@media (min-width: 768px) { + header.head { + padding-top: 3.8rem; + /* padding-bottom: calc(100% - 3.8rem); */ + padding-bottom: 5.4rem; + } +} \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/css/navbar.css b/dmp-frontend/src/assets/splash/css/navbar.css new file mode 100644 index 000000000..71bcb053f --- /dev/null +++ b/dmp-frontend/src/assets/splash/css/navbar.css @@ -0,0 +1,258 @@ +.bootstrap-overrides .navbar { + position: relative; + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + padding-top: 3.18rem; + padding-left: 0; + padding-right: 0; + background-color: white; +} + +.bootstrap-overrides .navbar .container { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; +} + +.bootstrap-overrides .navbar-brand { + display: inline-block; + width: 135px; + height: 51px; + font-size: 1.25rem; + line-height: inherit; + white-space: nowrap; +} + +.bootstrap-overrides .navbar-nav { + display: flex; + flex-direction: column; + padding-left: 0; + margin-bottom: 0; + margin-left: auto; + list-style: none; +} + +.bootstrap-overrides .navbar-nav .nav-link { + padding-right: 0; + padding-left: 0; +} + +.bootstrap-overrides .navbar-nav .dropdown-menu { + position: static; + float: none; +} + +.navbar-collapse { + flex-basis: 100%; + flex-grow: 1; + align-items: center; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + background-color: transparent; + border: 1px solid transparent; + border-radius: 0.25rem; +} + +.navbar-toggler:hover, .navbar-toggler:focus { + text-decoration: none; +} + +.navbar-toggler-icon { + display: inline-block; + width: 1.5em; + height: 1.5em; + vertical-align: middle; + content: ""; + background: no-repeat center center; + background-size: 100% 100%; +} + +.nav { + display: flex; + flex-wrap: wrap; + padding-left: 0; + margin-bottom: 0; + list-style: none; +} + +.nav-link { + display: block; + padding: 0.5rem 1rem; + margin-left: 1rem; + ; + text-align: left; + font: Bold 14px/17px Roboto; + letter-spacing: 0px; + color: #000000; + opacity: 1; +} + +.nav-link:hover, .nav-link:focus { + text-decoration: none; +} + +.nav-link.disabled { + color: #6c757d; + pointer-events: none; + cursor: default; +} + +.nav-item { + margin-bottom: -1px; +} + +.nav-link { + border: 1px solid transparent; + border-top-left-radius: 0.25rem; + border-top-right-radius: 0.25rem; +} + +.nav-link.disabled { + color: #6c757d; + background-color: transparent; + border-color: transparent; +} + +.nav-link.active, .nav-item.show .nav-link { + color: #495057; + background-color: #fff; + border-color: #dee2e6 #dee2e6 #fff; +} + +.nav-link { + border-radius: 0.25rem; +} + +.nav-link.active, .show>.nav-link { + color: #000000; + background-color: #23BCBA; +} + +.nav-fill .nav-item { + flex: 1 1 auto; + text-align: center; +} + +.nav-justified .nav-item { + flex-basis: 0; + flex-grow: 1; + text-align: center; +} + +.navbar-expand { + flex-flow: row nowrap; + justify-content: flex-start; +} + +.navbar-expand>.container, .navbar-expand>.container-fluid, .navbar-expand>.container-sm, .navbar-expand>.container-md, .navbar-expand>.container-lg, .navbar-expand>.container-xl { + padding-right: 0; + padding-left: 0; +} + +.navbar-expand .navbar-nav { + flex-direction: row; +} + +.navbar-expand .navbar-nav .dropdown-menu { + position: absolute; +} + +.navbar-expand .navbar-nav .nav-link { + padding-right: 1rem; + padding-left: 1rem; +} + +.navbar-expand>.container, .navbar-expand>.container-fluid, .navbar-expand>.container-sm, .navbar-expand>.container-md, .navbar-expand>.container-lg, .navbar-expand>.container-xl { + flex-wrap: nowrap; +} + +.navbar-expand .navbar-collapse { + display: flex !important; + flex-basis: auto; +} + +.navbar-expand .navbar-toggler { + display: none; +} + +@media (max-width: 991.98px) { + .navbar-expand-lg>.container { + padding-right: 0; + padding-left: 0; + } +} + +@media (min-width: 992px) { + .navbar-expand-lg { + flex-flow: row nowrap; + justify-content: flex-start; + } + .navbar-expand-lg .navbar-nav { + flex-direction: row; + } + .navbar-expand-lg .navbar-nav .dropdown-menu { + position: absolute; + } + .navbar-expand-lg .navbar-nav .nav-link { + padding-right: 1.2rem; + padding-left: 1.2rem; + } + .navbar-expand-lg>.container { + flex-wrap: nowrap; + } + .navbar-expand-lg .navbar-collapse { + display: flex !important; + flex-basis: auto; + } + .navbar-expand-lg .navbar-toggler { + display: none; + } +} + +@media (min-width: 992px) { + #nav { + padding-top: 1.5rem; + padding-bottom: 1.5rem; + border: none; + background-color: transparent; + transition: padding-top 0.3s ease-in-out, padding-bottom 0.3s ease-in-out; + } + #nav .navbar-brand { + font-size: 1.5em; + transition: font-size 0.3s ease-in-out; + } + #nav .navbar-brand img { + height: 2rem; + transition: height 0.3s ease-in-out; + } + #nav.navbar-shrink { + padding-top: 1rem; + padding-bottom: 1rem; + background-color: #212529; + } + #nav.navbar-shrink .navbar-brand { + font-size: 1.25em; + } + #nav.navbar-shrink .navbar-brand svg, #mainNav.navbar-shrink .navbar-brand img { + height: 1.5rem; + } + #nav.navbar-shrink .nav-link { + color: white; + } + #nav.navbar-shrink .nav-link:hover { + color: #23BCBA; + } + #nav .navbar-nav .nav-item { + margin-right: 1rem; + } + #nav .navbar-nav .nav-item:last-child { + margin-right: 0; + } +} diff --git a/dmp-frontend/src/assets/splash/css/section.css b/dmp-frontend/src/assets/splash/css/section.css new file mode 100644 index 000000000..5c78e417f --- /dev/null +++ b/dmp-frontend/src/assets/splash/css/section.css @@ -0,0 +1,202 @@ +section.start { + text-align: center; + color: #fff; + background: #23BCBA 0% 0% no-repeat padding-box; +} + +.template-img { + margin-right: 6.8rem; +} + +.options { + padding-top: 4rem; +} + +.option-row { + cursor: pointer; +} + +.option-number { + text-align: left; + font-weight: 700; + font-family: 'Roboto', sans-serif; + font-size: 3.25rem; + line-height: 1; + letter-spacing: 0px; + color: #0E6978; + opacity: 1; + padding: 0rem 1rem; +} + +.option-text { + display: flex; + align-items: center; + text-align: left; + font-weight: 300; + font-family: 'Roboto', sans-serif; + font-size: 1.56rem; + line-height: 1.68rem; + letter-spacing: 0px; + color: #FFFFFF; +} + +.selected { + opacity: 1; +} + +.not-selected { + opacity: 0.6; +} + +.features-layout { + display: flex; + justify-content: space-around; + padding-bottom: 4rem; +} + +.features-title { + display: flex; + justify-content: center; + font-weight: 700; + font-family: 'Roboto', sans-serif; + font-size: 2.37rem; + padding-bottom: 3rem; + color: #212121; + opacity: 1; +} + +.feature-subtitle { + text-align: center; + font-weight: 700; + font-family: 'Roboto', sans-serif; + font-size: 1.87rem; + padding: 1.5rem 0rem; + color: #000000; + opacity: 0.8; +} + +.feature-img { + display: flex; + justify-content: center; +} + +.feature-desc { + text-align: center; + font-size: 1rem; + color: #292747; + opacity: 1; + max-width: 429px; +} + +section.benefits { + background: #F3F3F3 0% 0% no-repeat padding-box; + opacity: 1; +} + +.benefits-title-1 { + text-align: center; + font-weight: 300; + font-family: 'Roboto', sans-serif; + font-size: 2.37rem; + color: #212121; +} + +.benefits-title-2 { + text-align: center; + font-weight: 700; + font-family: 'Roboto', sans-serif; + font-size: 2.37rem; + color: #212121; +} + +.benefit-card { + width: 370px; + height: 378px; + background: #FFFFFF 0% 0% no-repeat padding-box; + box-shadow: 0px 6px 15px #0000001A; + border-radius: 36px; + opacity: 1; +} + +.benefit-card-title { + text-align: center; + font-weight: 300; + font-family: 'Roboto', sans-serif; + font-size: 1.68rem; + color: #292747; + opacity: 1; + padding: 2.81rem 0rem 1.5rem 0rem; +} + +.benefit-desc { + text-align: center; + color: #292747; + max-width: 226px; +} + +.benefit-desc-1 { + text-align: center; + color: #292747; + max-width: 250px; +} + +.benefit-card hr { + width: 286px; + border: 1px solid #DBDBDB; + opacity: 1; + margin-top: 1.5rem !important; + margin-bottom: 1.5rem !important; +} + +.benefit-card-subtitle { + text-align: left; + font-weight: 400; + font-family: 'Roboto', sans-serif; + font-size: 0.87rem; + color: #292747; + padding-left: 10px; +} + +.benefit-card-sub-color { + text-align: left; + font-weight: 400; + font-family: 'Roboto', sans-serif; + font-size: 0.87rem; + color: #008887; +} + +.benefit-ic { + margin-left: 40px !important; + margin-bottom: .8rem; +} + +.branding-logo { + display: flex; + align-items: flex-end; +} + +.co-branding-text { + text-align: left; + font-family: 'Roboto',sans-serif; + font-weight: 300; + font-size: 1rem; + color: #212121; + opacity: 0.81; + max-width: 357px; + padding-top: 1.5rem; +} + +@media (min-width: 768px) { + section.start, section.features, section.co-branding, .footer { + padding-top: 6rem; + padding-bottom: 5.4rem; + } + section.benefits { + padding-top: 3.8rem; + padding-bottom: 5.4rem; + } + .footer { + padding-top: 4.8rem; + padding-bottom: 2rem; + } +} \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/css/styles.css b/dmp-frontend/src/assets/splash/css/styles.css new file mode 100644 index 000000000..82e2a4365 --- /dev/null +++ b/dmp-frontend/src/assets/splash/css/styles.css @@ -0,0 +1,184 @@ +*, *::before, *::after { + box-sizing: border-box; +} + +html { + font-family: sans-serif; + line-height: 1.15; + -webkit-text-size-adjust: 100%; + -webkit-tap-highlight-color: rgba(0, 0, 0, 0); +} + +body { + margin: 0; + font-family: 'Roboto', sans-serif; + font-size: 1rem; + line-height: 1.5; + color: #212529; +} + +.bootstrap-overrides a { + text-decoration: none; + background-color: transparent; +} + +.bootstrap-overrides a:hover { + color: #23BCBA; + text-decoration: none; +} + +.bootstrap-overrides h1, .bootstrap-overrides h2, .bootstrap-overrides h3, .bootstrap-overrides h4, .bootstrap-overrides h5, .bootstrap-overrides h6, .caption, .placeholder, .body-text, .h1, .h2, .h3, .h4, .h5, .h6 { + font-family: 'Roboto', sans-serif; + color: #212121; + text-align: left; +} + +.bootstrap-overrides h1, .h1 { + font-size: 3.3125rem; + line-height: 4rem; + font-weight: 300; +} + +.bootstrap-overrides h2, .h2 { + font-size: 3.16rem; + line-height: 3.66rem; + font-weight: 300; +} + +.bootstrap-overrides h3, .h3 { + font-size: 2.5rem; + line-height: 2.83rem; + font-weight: 700; +} + +.bootstrap-overrides h4, .h4 { + font-size: 1.66rem; + line-height: 1.2; + font-weight: 700; +} + +.bootstrap-overrides h5, .h5 { + font-size: 1.33rem; + line-height: 2.16rem; + font-weight: 300; +} + +.bootstrap-overrides h6, .h6 { + font-size: 1.66rem; + line-height: 1.2; + font-weight: 300; +} + +.caption { + font-size: 1rem; + line-height: 1.66rem; + font-weight: 300; +} + +.placeholder { + font-size: 1.33rem; + line-height: 1.83rem; + font-weight: 300; +} + +.title-1 { + text-align: left; + font-size: 2.37rem; + line-height: 2.75rem; + font-family: 'Roboto', sans-serif; + font-weight: 300; + color: #FFFFFF; +} + +.title-2 { + text-align: left; + font-size: 2.37rem; + line-height: 2.75rem; + font-family: 'Roboto', sans-serif; + font-weight: 700; + color: #FFFFFF; +} + +.title-3 { + text-align: left; + font-size: 2.37rem; + font-family: 'Roboto', sans-serif; + font-weight: 300; + color: #212121; + opacity: 0.95; +} + +.body-text { + font-size: 1rem; + line-height: 1.6; + font-weight: 400; + opacity: 0.8; +} + +hr { + margin-top: 1rem; + margin-bottom: 1rem; + border: 0; + border-top: 1px solid rgba(0, 0, 0, 0.1); +} + +.fixed-top { + position: fixed !important; + top: 0; + right: 0; + left: 0; + z-index: 1030; +} + +.container { + width: 100%; + padding-right: 0.75rem; + padding-left: 0.75rem; + margin-right: auto; + margin-left: auto; +} + +.normal-btn { + width: 162px; + height: 40px; + cursor: pointer; + background: #129D99 0% 0% no-repeat padding-box; + box-shadow: 0px 3px 6px #1E202029; + border-radius: 30px; + border: none; + color: #FFFFFF; + opacity: 1; +} + +.margin-right-6 { + margin-left: 5.8rem; +} + +.mirror { + -webkit-transform: scaleX(-1); + transform: scaleX(-1); +} + +@media (min-width: 576px) { + .container { + max-width: 540px; + } +} + +@media (min-width: 768px) { + .container { + max-width: 720px; + } +} + +@media (min-width: 992px) { + .container { + max-width: 960px; + } +} + +@media (min-width: 1244px) { + .container { + max-width: 1204px !important; + } +} \ No newline at end of file diff --git a/dmp-frontend/src/assets/splash/index.html b/dmp-frontend/src/assets/splash/index.html new file mode 100644 index 000000000..895bc7cc6 --- /dev/null +++ b/dmp-frontend/src/assets/splash/index.html @@ -0,0 +1,350 @@ + + + + + + Argos + + + + + + + + + + + + + + + + + + +
+
+
+
+

Plan and follow your data

+
+
+

Create

 
machine actionable DMPs.
+
+
+

Configure

 
to best fit your dicsipline.
+
+
+

Link

 
to EOSC components out of the box.
+
+
+

Share

 
easily in your repository.
+
+
+
+

Bring your Data Management Plans closer to where data are generated, analysed and stored.

+
+
+ +
+
+
+ +
+
+
+
+ +
+
+
+
+

Start your

+
+

Argos

 

experience

+
+
+
+

1

 

Select Templates

+
+
+

2

 

Fill the information

+
+
+

3

 

Share DMP

+
+
+
+
+ +
+
+
+ +
+ +
+
+
Features
+
+
+
+
+
+
+
Produce DMP outputs
+
+
+
+ Close the data management planning lifecycle by publishing your DMPs in a FAIR manner. Assign licenses, PIDs and publish DMPs in a repository of your choice. +
+
+
+
+
+ +
+
+
Update DMPs
+
+
+
+ Treat DMPs as living documents. Secure their provenance and continue work in new versions (new DOIs assigned). +
+
+
+
+
+
+
+ +
+
+
Re-use datasets & templates
+
+
+
+ Identify datasets to be re-used in your DMP. Copy or clone dataset descriptions to other DMPs. +
+
+
+
+
+ +
+
+
Import and Export DMPs
+
+
+
+ Import a .json file of your DMP and continue work in ARGOS. Export DMPs in machine readable (.xml) and machine-actionable (.json) formats. +
+
+
+
+
+
+
+ +
+
+
Customise dataset descriptions
+
+
+
+ Differentiate DMPs from dataset descriptions. Describe your datasets with more than one template and tailor its content to your specific needs. +
+
+
+
+
+ +
+
+
Connect with OpenAIRE & EOSC
+
+
+
+ Use OpenAIRE and EOSC underlying services, sources and semantics to ease completion of DMPs and trace the quality of your research. +
+
+
+
+
+
+ +
+
+
+
+
+ Who Benefits +
+
+
+ +
+
+
+
+
+
+
+
+ Funders +
+
+ Include DMPs in data management policies. +
+
+
+ + Add, update and modify DMP templates +
+
+ + Enrich your organisations’ research graph +
+
+ + Link argos to your  + Monitoring Dashboard +
+
+
+
+
+
+ Researchers +
+
+ Become Research Data Management literate and lead Open Science cultural change/ practices. +
+
+
+ + Comply with DMP requirements +
+
+ + Learn and apply best practices for DMPs +
+
+ + Co-edit DMPs and manage workload +
+
+
+
+
+
+ Institutions +
+
+ Support Open and FAIR Data Management Planning. +
+
+
+ + Add, update and modify DMP templates +
+
+ + Connect your organisations’ services +
+
+ + Ensure research integrity and excellence +
+
+
+
+
+ +
+ +
+
+
+
+ +
+
+
+ + co-branding +
+
+ + ARGOS is based on OpenDMP, an open source software that can be deployed by third parties. ARGOS development team welcomes contributions by the international community to strengthen functionalities and further align with global fora. + +
+
+
+ +
+
+
+
+
+ +
+ + + + + + diff --git a/dmp-frontend/src/assets/splash/js/scripts.js b/dmp-frontend/src/assets/splash/js/scripts.js new file mode 100644 index 000000000..f4d563ded --- /dev/null +++ b/dmp-frontend/src/assets/splash/js/scripts.js @@ -0,0 +1,26 @@ +function toggleClass(ids, option) { + ids.forEach(id => { + var element = document.getElementById(id); + var className = element.getAttribute("class").replace(/ .*/,''); + console.log(className); + if (id === option) { + element.classList.replace(className, "selected"); + } else { + element.classList.replace(className, "not-selected"); + } + }) +} + +function navbarCollapse() { + var element = document.getElementById('nav'); + if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) { + console.log('here') + element.classList.add("navbar-shrink"); + element.classList.add("fixed-top"); + } else { + element.classList.remove("navbar-shrink"); + element.classList.remove("fixed-top"); + } +}; +navbarCollapse(); +window.onscroll = function() { navbarCollapse() };