Customization: rename hero to hero section, add description below

This commit is contained in:
argirok 2022-08-11 16:06:50 +03:00
parent d9853e1d91
commit 0dbb8b2c75
3 changed files with 12 additions and 6 deletions

View File

@ -9,12 +9,14 @@ declare var UIkit;
<color [color]="background.color"
[label]="label" [light]="light"
(colorChange)=
" background.color = $event;"></color>
" background.color = $event;" [description]="description"></color>
`
})
export class BackgroundComponent implements OnInit {
@Input() label:string = "";
@Input() description:string = null;
@Input() background;
@Input() oldBackground;
@Input() light:boolean;

View File

@ -11,9 +11,12 @@ import {CustomizationOptions} from '../../openaireLibrary/connect/community/Cust
<input class="uk-margin-small-left color-input" color-picker [colorPicker]="color" [style.background]="color"
(colorPickerChange)="color=$event; colorChanged();"/>
</div>
<div class="uk-margin-small-left"> {{label}}</div>
<div class="uk-margin-small-left"> {{label}}
<div class="uk-text-meta uk-text-xsmall" *ngIf="description" >{{description}}</div>
</div>
</div>
</div>
</div>
<div class="uk-text-warning uk-text-xsmall uk-margin-small-left" *ngIf="warningForContrast(color)">Contrast ratio may be too low.</div>
`,
styles:[
@ -35,6 +38,7 @@ export class ColorComponent implements OnInit {
@Input() addMargin: boolean = false;
@Output() colorChange = new EventEmitter();
@Input() light:boolean;
@Input() description:string = null;
public warningForContrast(color:string){
return (this.light && CustomizationOptions.isForLightBackground(color)) || (!this.light && !CustomizationOptions.isForLightBackground(color));
}

View File

@ -213,12 +213,12 @@
[light]="false"></background>
<background label="Light" [background]="draftCustomizationOptions.backgrounds.light"
[light]="true"></background>
<background label="Hero" [background]="draftCustomizationOptions.backgrounds.form"
<background label="Hero section" [background]="draftCustomizationOptions.backgrounds.form"
[light]="true"
[oldBackground]="publishedCustomizationOptions.backgrounds.form"
[communityId]="communityId"></background>
[communityId]="communityId" description="The area under menu"></background>
<div class="uk-margin-xsmall-bottom uk-text-uppercase uk-text-meta uk-text-bold uk-margin-large-top">
Hero Image
Hero section image
<a *ngIf="(formHasChanges(publishedCustomizationOptions, draftCustomizationOptions) )
&& draftCustomizationOptions.backgroundsIsCustom"
(click)="resetImageTo(publishedCustomizationOptions.backgrounds);" class="uk-margin-small-left"