From 424eff78a11ba0f596e17821dfd93f6c28478e3d Mon Sep 17 00:00:00 2001 From: argirok Date: Tue, 3 May 2022 16:53:37 +0300 Subject: [PATCH] apply new theme changes - mainly for eosc --- src/app/app-routing.module.ts | 19 ++-- src/app/app.component.ts | 167 +++---------------------------- src/app/home/home.component.html | 25 ++++- src/app/home/home.component.ts | 1 + src/app/home/home.module.ts | 4 +- src/app/utils/aggregators.ts | 145 +++++++++++++++++++++++++-- src/environments/environment.ts | 2 +- src/eosc/index.html | 6 +- 8 files changed, 190 insertions(+), 179 deletions(-) diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 96b9210..f522e00 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -1,44 +1,41 @@ import {NgModule} from '@angular/core'; import {Router, RouterModule, Routes} from '@angular/router'; import {OpenaireErrorPageComponent} from './error/errorPage.component'; -import {ConnectHelper} from "./openaireLibrary/connect/connectHelper"; -import {PortalAggregators} from "./utils/aggregators"; -import {properties} from "../environments/environment"; import {ConfigurationService} from "./openaireLibrary/utils/configuration/configuration.service"; const routes: Routes = [ {path: '', loadChildren: () => import('./home/home.module').then(m => m.HomeModule)}, { path: 'search/result', - loadChildren: () => import('./landingPages/result/libResult.module').then(m => m.LibResultModule) + loadChildren: () => import('./landingPages/result/libResult.module').then(m => m.LibResultModule), data: { showHeader: true} }, { path: 'search/publication', - loadChildren: () => import('./landingPages/publication/libPublication.module').then(m => m.LibPublicationModule) + loadChildren: () => import('./landingPages/publication/libPublication.module').then(m => m.LibPublicationModule), data: { showHeader: true} }, { path: 'search/dataset', - loadChildren: () => import('./landingPages/dataset/libDataset.module').then(m => m.LibDatasetModule) + loadChildren: () => import('./landingPages/dataset/libDataset.module').then(m => m.LibDatasetModule), data: { showHeader: true} }, { path: 'search/software', - loadChildren: () => import('./landingPages/software/libSoftware.module').then(m => m.LibSoftwareModule) + loadChildren: () => import('./landingPages/software/libSoftware.module').then(m => m.LibSoftwareModule), data: { showHeader: true} }, { path: 'search/other', - loadChildren: () => import('./landingPages/orp/libOrp.module').then(m => m.LibOrpModule) + loadChildren: () => import('./landingPages/orp/libOrp.module').then(m => m.LibOrpModule), data: { showHeader: true} }, { path: 'search/project', - loadChildren: () => import('./landingPages/project/libProject.module').then(m => m.LibProjectModule) + loadChildren: () => import('./landingPages/project/libProject.module').then(m => m.LibProjectModule), data: { showHeader: true} }, { path: 'search/dataprovider', - loadChildren: () => import('./landingPages/dataProvider/libDataProvider.module').then(m => m.LibDataProviderModule) + loadChildren: () => import('./landingPages/dataProvider/libDataProvider.module').then(m => m.LibDataProviderModule), data: { showHeader: true} }, { path: 'search/organization', - loadChildren: () => import('./landingPages/organization/libOrganization.module').then(m => m.LibOrganizationModule) + loadChildren: () => import('./landingPages/organization/libOrganization.module').then(m => m.LibOrganizationModule), data: { showHeader: true} }, { path: 'search/find', diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 3c059b0..2ec8006 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -12,13 +12,13 @@ import {ConfigurationService} from "./openaireLibrary/utils/configuration/config import {Subscriber} from "rxjs"; import {DOCUMENT} from "@angular/common"; import {SmoothScroll} from "./openaireLibrary/utils/smooth-scroll"; -import {Router} from "@angular/router"; +import {ActivatedRoute, NavigationEnd, Router} from "@angular/router"; @Component({ selector: 'app-root', template: `
- @@ -52,19 +52,30 @@ export class AppComponent { loginCheck: boolean = false; footer = portalProperties.sectionFooter; header: Header; + showHeader; agg: AggregatorInfo = null; subscriptions = []; constructor(private userManagementService: UserManagementService, private configurationService: ConfigurationService, private smoothScroll: SmoothScroll, - @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2) { + @Inject(DOCUMENT) private document, private rendererFactory: RendererFactory2, private router: Router, private route: ActivatedRoute) { this.id = ConnectHelper.getCommunityFromDomain(this.properties.domain); this.agg = PortalAggregators.getFilterInfoByMenuId(this.id); this.setStyles(); this.configurationService.initStaticCommunityInformation(PortalAggregators.getCommunityInfoByMenuId(this.id)); + this.showHeader = this.agg.showHeaderAlways; } ngOnInit() { + this.subscriptions.push(this.router.events.subscribe(event => { + if (event instanceof NavigationEnd) { + let r = this.route; + while (r.firstChild) { + r = r.firstChild; + } + this.showHeader = (r.snapshot.data.showHeader == true || this.agg.showHeaderAlways); + } + })); if (typeof document !== 'undefined') { this.isClient = true; } @@ -135,155 +146,7 @@ export class AppComponent { } setStyles(){ - let css:string =':root {\n'; - if(this.agg.mainColor){ - css = css.concat('--portal-main-color: ' + this.agg.mainColor + ';\n'); - } - if(this.agg.darkColor){ - css = css.concat('--portal-dark-color: ' + this.agg.darkColor + ';\n'); - } - if(this.agg.darkColor){ - css = css.concat("--graph-background: url('" + this.agg.background + "\') no-repeat bottom;\n"); - } - css = css.concat('}'); - let css2 = ` - -#searchImage{ -background: url('https://marketplace.eosc-portal.eu/packs/media/images/eosc-logo-color-883f208671ef77b15b9cd067ecdc369b.png') no-repeat center left; -width: 250px; -height: 80px; -background-size: 250px 80px; -margin-left: 80px; -margin-bottom: 37px; -} -#searchForm advanced-search-form{ -float:right; -} -#searchForm{ -padding:0; - width:100%; - max-width:100%; -} -search-filter h6::after{ -border-bottom: 1px solid gray; -} -search-filter h6{ -text-transform: uppercase !important; -font-size: 12px; -} - -search-filter .tm-child-list-divider > ul > li:nth-child(n+2), .uk-list-divider > li:nth-child(n+2){ -border: none; -} - -.filterHeader{ -border-bottom:1px solid #ced4da; -} -.matSelection.mat-select { - - padding: 4px; - border: 1px solid #ced4da; - -} - - - -.search-results .uk-card-default.uk-card-hover:hover{ - box-shadow: none; -} -.search-results .uk-card-default { - border: 1px solid #ced4da; - box-shadow:none; -} - -element { - -} -.uk-pagination > .uk-active > *, .uk-pagination > .uk-active > :hover { - - border-radius: 0px; - - -} - .uk-button-primary:not(.uk-icon-button), .portal-button:not(.uk-icon-button) { - color: #fff !important; - background-color: #0c2bd5 !important; - background-image: linear-gradient(135deg,#05cae7,#0c2bd5) !important; - border:none !important; - } - - .uk-button-primary:hover, .portal-button:hover:not(.uk-icon-button) { - background: #0c2bd5 !important; - border:none !important; - } - - .search_box_bg .uk-button, #searchForm .uk-button, .search_box_bg .uk-button:hover, #searchForm .uk-button:hover { - border-radius: 0px; - margin-left: 0px !important; - color: rgb(102, 102, 102) !important; - background-color: #0c2bd5 !important; - background-color: rgba(255, 255, 255, 1.0) !important; - border: 1px solid rgba(0, 0, 0, 0.40) !important; - background-image: none !important; - - } - - .uk-navbar-nav > li > a, .uk-navbar-dropdown-nav > li > a, .uk-navbar-dropdown-nav > li > a:focus, .uk-navbar-dropdown-nav > li > a:hover { - color: #555 !important; - } - .uk-navbar-nav > li:hover > a, .uk-navbar-nav > li > a.uk-open, .uk-navbar-nav > li > a:focus { - color: #555 ; - outline: 0; - } - -.aggregator-menu .uk-navbar-nav>li { - margin-right:20px -} -.aggregator-menu .uk-navbar-nav>li>a { - padding:0 -} - -.navbar .nav > li > .dropdown-menu, .uk-navbar-dropdown{ -background-color: white; - color: #555; -} - -.aggregator-menu .uk-navbar-dropdown li:before { - bottom:0 -} -.navbar .nav>li>.dropdown-menu, -.uk-navbar-dropdown { - padding:20px -} - - -/* .aggregator-menu .uk-navbar-dropdown li:active::before, .aggregator-menu .uk-navbar-dropdown li:focus::before, .aggregator-menu .uk-navbar-dropdown li:hover::before, .aggregator-menu .uk-navbar-nav > li > a:active::before, .aggregator-menu .uk-navbar-nav > li > a:focus::before, .aggregator-menu .uk-navbar-nav > li > a:hover::before { - - transform: scaleX(1); - transform-origin: 0 50%; - -} -.aggregator-menu .uk-navbar-dropdown li::before, .aggregator-menu .uk-navbar-nav > li > a::before { - - content: ""; - position: absolute; - width: 100%; - height: 3px; - bottom: 20px; - z-index: 300; - left: 0; - background-color: #dc9d19; - transform: scaleX(0); - transition: transform .5s cubic-bezier(.7,0,.3,1); - transform-origin: 100% 50%; - -}*/ - - - `; - if(this.agg.menuId == 'eosc') { - css = css.concat(css2); - } + let css:string = this.agg.customCss; try { if( this.document.getElementById('customStyle')){ try { diff --git a/src/app/home/home.component.html b/src/app/home/home.component.html index 9c92591..ba52dad 100644 --- a/src/app/home/home.component.html +++ b/src/app/home/home.component.html @@ -1,5 +1,5 @@
-
+ + <!– (click)="goTo(false)"–> Advanced Search Advanced Search
@@ -65,6 +65,27 @@
+ --> +
+
+
+ +
+ + +
+ + +
+
+ +
+
+
+
+
diff --git a/src/app/home/home.component.ts b/src/app/home/home.component.ts index 30e5c4f..18c2a0f 100644 --- a/src/app/home/home.component.ts +++ b/src/app/home/home.component.ts @@ -58,6 +58,7 @@ export class HomeComponent { value: "Open Access" }; selectedEntity = "all"; + disableSelect; selectedEntitySimpleUrl; selectedEntityAdvancedUrl; resultTypes:Filter = {values:[],filterId:"type", countSelectedValues: 0, filterType: 'checkbox', originalFilterId: "", valueIsExact: true, title: "Result Types",filterOperator:"or"}; diff --git a/src/app/home/home.module.ts b/src/app/home/home.module.ts index 56b8b6c..690d34e 100644 --- a/src/app/home/home.module.ts +++ b/src/app/home/home.module.ts @@ -26,6 +26,8 @@ import {IconsModule} from "../openaireLibrary/utils/icons/icons.module"; import {IconsService} from "../openaireLibrary/utils/icons/icons.service"; import {arrow_right, book, cog, database, earth} from "../openaireLibrary/utils/icons/icons"; import {NumbersModule} from "../openaireLibrary/sharedComponents/numbers/numbers.module"; +import {AdvancedSearchInputModule} from "../openaireLibrary/sharedComponents/advanced-search-input/advanced-search-input.module"; +import {InputModule} from "../openaireLibrary/sharedComponents/input/input.module"; @NgModule({ imports: [ @@ -38,7 +40,7 @@ import {NumbersModule} from "../openaireLibrary/sharedComponents/numbers/numbers HomeRoutingModule, HelperModule, ErrorMessagesModule, - SEOServiceModule, EntitiesSelectionModule, QuickSelectionsModule, IconsModule, NumbersModule + SEOServiceModule, EntitiesSelectionModule, QuickSelectionsModule, IconsModule, NumbersModule, AdvancedSearchInputModule, InputModule ], declarations: [ HomeComponent diff --git a/src/app/utils/aggregators.ts b/src/app/utils/aggregators.ts index 33e872b..7391736 100644 --- a/src/app/utils/aggregators.ts +++ b/src/app/utils/aggregators.ts @@ -10,15 +10,14 @@ export class AggregatorInfo { queryFieldName: string; //country valueId: string; //gr valueName: string; // Greece - mainColor:string; - darkColor:string; - background:string; graphSectionTitle: string; graphSectionText: string; enableLogin: boolean; + customCss:string; + showHeaderAlways:boolean; constructor(menuId: string, title: string, logoUrl: string, fieldName: string, queryFieldName: string, valueId: string, - valueName: string, mainColor:string=null, darkColor:string=null, background:string=null,graphSectionTitle: string = null, graphSectionText:string = null, enableLogin:boolean = true ) { + valueName: string, graphSectionTitle: string = null, graphSectionText:string = null, enableLogin:boolean = true, showHeaderAlways:boolean = true, customCss:string = "" ) { this.menuId = menuId; this.title = title; this.logoUrl = logoUrl; @@ -26,18 +25,18 @@ export class AggregatorInfo { this.queryFieldName = queryFieldName; this.valueId = valueId; this.valueName = valueName; - this.mainColor = mainColor; - this.darkColor = darkColor; - this.background = background; this.graphSectionTitle = graphSectionTitle; this.graphSectionText = graphSectionText; this.enableLogin = enableLogin; + this.showHeaderAlways = showHeaderAlways; + this.customCss = customCss; } } export class PortalAggregators { static list: AggregatorInfo[] = [ - new AggregatorInfo("canada", "Canadian Aggregator", "assets/canada-logo.png", "Country", "country", "CA", "Canada","#E80000","#ad0000", "/assets/canada-background.svg", + new AggregatorInfo("canada", "Canadian Aggregator", "assets/canada-logo.png", "Country", + "country", "CA", "Canada", "Portal to Canadian Research Outputs", ` Welcome to the Portal of Canadian Research Outputs. This has been developed as part of a collaboration between Canadian Association of Research Libraries (CARL) and OpenAIRE. The portal presents research results collected @@ -53,10 +52,136 @@ export class PortalAggregators { Bienvenue sur le portal des résultats de la recherche canadienne, qui a été développé dans le cadre d'une collaboration entre l'ABRC et OpenAIRE dans le contexte du projet OpenAIRE Advance. Le portail permet aux utilisateurs de repérer et de parcourir le contenu canadien inclus sur la plateforme OpenAIRE. La quantité des résultats de la recherche canadienne disponible sur la plateforme augmentera tout au long de l'année 2021 au fur et à mesure que les dépôts canadiens se conformeront aux directives d'OpenAIRE et que les détails relatifs aux affiliations canadiennes seront améliorés. Pour plus d'informations, veuillez visiter le site Web de l’ABRC. - `), + `,true, true,` + :root { + --primary-color: #E80000; + --primary-color-rgb: 232,0,0; + --primary-dark-color: #ad0000; + --graph-background: url('/assets/canada-background.svg') no-repeat bottom; + --label-secondary: #E80000; + /* Fonts */ + --text-primary-color: var(primary-color); + --text-gradient-color: linear-gradient(110deg, var(primary-color) 0%, var(--monitor-dark-color) 100%); + + /** Label */ + --label-secondary: var(--primary-color); + + + } + `), new AggregatorInfo("italy", "Italian Aggregator", "assets/common-assets/logo-small-aggregator.png", "Country", "country", "IT", "Italy"), new AggregatorInfo("greece", "Greek Aggregator", "assets/common-assets/logo-small-aggregator.png", "Country", "country", "GR", "Greece"), - new AggregatorInfo("eosc", "Eosc Explore", "https://providers.eosc-portal.eu/assets/images/EOSC_Portal_Logo.png", null, null, null, null, "#3540b6","#233d4c", null,null,null ,false) + new AggregatorInfo("eosc", "Eosc Explore", "https://providers.eosc-portal.eu/assets/images/EOSC_Portal_Logo.png", + null, null, null, null,null,null ,false,false, + ` + :root { + --primary-color: #3540b6; + --primary-dark-color: #233d4c; + --search-form-background: transparent; + + } + .search-input { + --search-input-border-radius: 0px; + } + .input-wrapper.advanced-search { + --input-border-radius: 0px; + } + .input-wrapper { + --input-border-radius: 0px; + } + a, .uk-link, a.uk-link-heading{ + color: #3540b6; + } + a:hover, .uk-link:hover, a.uk-link-heading:hover{ + color: #233d4c; + text-decoration: none; + } + .uk-link-text a:hover, .uk-link-toggle:hover .uk-link-text, a.uk-link-text:hover{ + color:#0c2bd5; + } +.search_box_bg { + background: url(//marketplace.eosc-portal.eu/packs/media/images/home-bg-89b63b3d579f3530ec6283f51e1648bc.png) no-repeat; + background-position-x: 0%; + background-position-y: 0%; + background-position: 50% -120px; + z-index: 3; +} +#searchImage{ +background: url('https://marketplace.eosc-portal.eu/packs/media/images/eosc-logo-color-883f208671ef77b15b9cd067ecdc369b.png') no-repeat center left; +width: 250px; +height: 80px; +background-size: 250px 80px; +margin-left: 80px; +} +#searchForm advanced-search-form{ +float:right; +} +#searchForm{ +padding:0; + width:100%; + max-width:100%; +} +search-filter h6::after{ +border-bottom: 1px solid gray; +} +search-filter h6{ +text-transform: uppercase !important; +font-size: 12px; +} + +search-filter .tm-child-list-divider > ul > li:nth-child(n+2), .uk-list-divider > li:nth-child(n+2){ +border: none; +} + +.filterHeader{ +border-bottom:1px solid #ced4da; +} +.matSelection.mat-select { + + padding: 4px; + border: 1px solid #ced4da; + +} + +.search-results .uk-card-default.uk-card-hover:hover{ + box-shadow: none; +} +.search-results .uk-card-default { + border: 1px solid #ced4da; + box-shadow:none; +} + + +.uk-pagination > .uk-active > *, .uk-pagination > .uk-active > :hover { + + border-radius: 0px; + + +} + .uk-button-primary:not(.uk-icon-button), .portal-button:not(.uk-icon-button) { + color: #fff !important; + background-color: #0c2bd5 !important; + background-image: linear-gradient(135deg,#05cae7,#0c2bd5) !important; + border:none !important; + } + + .uk-button-primary:hover, .portal-button:hover:not(.uk-icon-button) { + background: #0c2bd5 !important; + border:none !important; + } + + .search_box_bg .uk-button, #searchForm .uk-button, .search_box_bg .uk-button:hover, #searchForm .uk-button:hover { + border-radius: 0px; + margin-left: 0px !important; + color: rgb(102, 102, 102) !important; + background-color: #0c2bd5 !important; + background-color: rgba(255, 255, 255, 1.0) !important; + border: 1px solid rgba(0, 0, 0, 0.40) !important; + background-image: none !important; + + } + + `) ]; static disabled = { diff --git a/src/environments/environment.ts b/src/environments/environment.ts index 2234523..ff29a10 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -119,6 +119,6 @@ export let properties: EnvProperties = { depositLearnHowPage: "/participate/deposit/learn-how", depositSearchPage: "/participate/deposit/search", altMetricsAPIURL: "https://api.altmetric.com/v1/doi/", - reCaptchaSiteKey: "6LcVtFIUAAAAAB2ac6xYivHxYXKoUvYRPi-6_rLu", + reCaptchaSiteKey: null, footerGrantText : "This OpenAIRE gateway is part of a project that has received funding from the European Union's Horizon 2020 research and innovation programme under grant agreements No. 777541 and 101017452" }; diff --git a/src/eosc/index.html b/src/eosc/index.html index e53b0d8..8456a58 100644 --- a/src/eosc/index.html +++ b/src/eosc/index.html @@ -46,8 +46,10 @@ - - +
+ + +