updates to customization component to use the background image for the forms
This commit is contained in:
parent
8acbe5889d
commit
08ac3c8d19
|
@ -169,7 +169,7 @@ export class AppComponent {
|
|||
this.configurationService.initCommunityInformation(this.properties, (communityId) ? communityId : this.properties.adminToolsPortalType);
|
||||
}
|
||||
initLayout(communityId){
|
||||
if(!this.layout) {
|
||||
if(!this.layout && location.pathname.indexOf("/preview") == -1) {
|
||||
this._layoutService.getLayout(this.properties, communityId).subscribe(
|
||||
layout => {
|
||||
if (layout) {
|
||||
|
|
|
@ -62,15 +62,19 @@ export class CustomizationComponent {
|
|||
:root {
|
||||
--portal-main-color: ` + this.layout.identity.mainColor+`;
|
||||
--portal-dark-color: ` + this.layout.identity.secondaryColor+`;
|
||||
--background-light-color:` + this.layout.backgrounds.light.color+`;
|
||||
}
|
||||
`;
|
||||
//Search SVG
|
||||
let search = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2000 532"><defs><style>.cls-1{isolation:isolate;}.cls-2{fill:{{color}};mix-blend-mode:multiply;}</style></defs><title>Asset 3</title><g class="cls-1"><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-2" d="M0,431s362,109,841,62,632,68,1159-9V0H0Z"/><path class="cls-2" d="M0,514s1401,71,2000-69V0H0Z"/></g></g></g></svg>`;;
|
||||
let svg = 'data:image/svg+xml,' + encodeURIComponent(search.replace('{{color}}', this.layout.backgrounds.form.color));
|
||||
this.customizationCss = this.customizationCss.concat('.generalSearchForm,.publicationsSearchForm,.projectsSearchForm, .projectsTableSearchForm,.organizationsSearchForm,.datasourcesSearchForm {');
|
||||
this.customizationCss = this.customizationCss.concat(' background: ' + "url('" + svg + "') transparent no-repeat center bottom; ");
|
||||
this.customizationCss = this.customizationCss.concat(" background-size: cover !important; ");
|
||||
this.customizationCss = this.customizationCss.concat(" height: inherit; }");
|
||||
console.log(" create form css " , this.layout.backgrounds.form)
|
||||
//Search SVG
|
||||
let search = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2000 532"><defs><style>.cls-1{isolation:isolate;}.cls-2{fill:{{color}};mix-blend-mode:multiply;}</style></defs><title>Asset 3</title><g class="cls-1"><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-2" d="M0,431s362,109,841,62,632,68,1159-9V0H0Z"/><path class="cls-2" d="M0,514s1401,71,2000-69V0H0Z"/></g></g></g></svg>`;
|
||||
;
|
||||
let svg = 'data:image/svg+xml,' + encodeURIComponent(search.replace('{{color}}', this.layout.backgrounds.form.color));
|
||||
this.customizationCss = this.customizationCss.concat('.generalSearchForm,.publicationsSearchForm,.projectsSearchForm, .projectsTableSearchForm,.organizationsSearchForm,.datasourcesSearchForm {');
|
||||
this.customizationCss = this.customizationCss.concat(' background: '
|
||||
+ "url('" + (this.layout.backgrounds.form.imageFile?(this.properties.utilsService + '/download/' +this.layout.backgrounds.form.imageFile): svg) + "') transparent no-repeat "+this.layout.backgrounds.form.position+" ;");
|
||||
this.customizationCss = this.customizationCss.concat(" background-size: cover !important; ");
|
||||
this.customizationCss = this.customizationCss.concat(" height: inherit; }");
|
||||
|
||||
//Button link SVG
|
||||
let arrow = `<svg width="23" height="11" viewBox="0 0 23 11" xmlns="http://www.w3.org/2000/svg"><polyline fill="none" stroke="{{color}}" points="17 1 22 5.5 17 10 " /><line fill="none" stroke="{{color}}" x1="0" y1="5.5" x2="22.4" y2="5.5" /></svg>`;;
|
||||
|
|
|
@ -24,7 +24,8 @@ export class PiwikHelper{
|
|||
"gotriple":490,
|
||||
"neanias-underwater":474,
|
||||
"inspired-ris":530,
|
||||
"citizen-science":538
|
||||
"citizen-science":538,
|
||||
"eut":558
|
||||
};
|
||||
public static getSiteId(communityId:string, environment:string){
|
||||
return this.siteIDs[communityId];
|
||||
|
|
Loading…
Reference in New Issue