diff --git a/client/src/app/site/common/components/start/start.component.html b/client/src/app/site/common/components/start/start.component.html index 32a1a0126..0cb9e172b 100644 --- a/client/src/app/site/common/components/start/start.component.html +++ b/client/src/app/site/common/components/start/start.component.html @@ -8,6 +8,6 @@

{{ welcomeTitle | translate }}

-
+
diff --git a/client/src/app/site/common/components/start/start.component.scss b/client/src/app/site/common/components/start/start.component.scss new file mode 100644 index 000000000..f188d70b9 --- /dev/null +++ b/client/src/app/site/common/components/start/start.component.scss @@ -0,0 +1,6 @@ +.app-content { + img { + max-width: 100%; + height: auto; + } +} diff --git a/client/src/app/site/common/components/start/start.component.ts b/client/src/app/site/common/components/start/start.component.ts index b7f5b97ba..876b1df85 100644 --- a/client/src/app/site/common/components/start/start.component.ts +++ b/client/src/app/site/common/components/start/start.component.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import { Title } from '@angular/platform-browser'; +import { Title, DomSanitizer, SafeHtml } from '@angular/platform-browser'; import { TranslateService } from '@ngx-translate/core'; // showcase @@ -11,11 +11,12 @@ import { ConfigService } from 'app/core/ui-services/config.service'; */ @Component({ selector: 'os-start', - templateUrl: './start.component.html' + templateUrl: './start.component.html', + styleUrls: ['./start.component.scss'] }) export class StartComponent extends BaseComponent implements OnInit { public welcomeTitle: string; - public welcomeText: string; + public welcomeText: SafeHtml; /** * Constructor of the StartComponent @@ -23,8 +24,14 @@ export class StartComponent extends BaseComponent implements OnInit { * @param titleService the title serve * @param translate to translation module * @param configService read out config values + * @param sanitizer */ - public constructor(titleService: Title, translate: TranslateService, private configService: ConfigService) { + public constructor( + titleService: Title, + translate: TranslateService, + private configService: ConfigService, + private sanitizer: DomSanitizer + ) { super(titleService, translate); } @@ -42,8 +49,19 @@ export class StartComponent extends BaseComponent implements OnInit { .subscribe(welcomeTitle => (this.welcomeTitle = welcomeTitle)); // set the welcome text - this.configService - .get('general_event_welcome_text') - .subscribe(welcomeText => (this.welcomeText = welcomeText as string)); + this.configService.get('general_event_welcome_text').subscribe(welcomeText => { + this.welcomeText = this.sanitizeText(this.translate.instant(welcomeText)); + }); + } + + /** + * Sanitizes the value from database. + * + * @param text The plain text to sanitize. + * + * @returns {SafeHtml} Html, that will be rendered with styles and so on... + */ + public sanitizeText(text: string): SafeHtml { + return this.sanitizer.bypassSecurityTrustHtml(text); } } diff --git a/client/src/styles.scss b/client/src/styles.scss index ab622e721..5a8bf12e5 100644 --- a/client/src/styles.scss +++ b/client/src/styles.scss @@ -19,6 +19,7 @@ @import './app/shared/components/tile/tile.component.scss'; @import './app/shared/components/block-tile/block-tile.component.scss'; @import './app/shared/components/icon-container/icon-container.component.scss'; +@import './app/site/common/components/start/start.component.scss'; /** fonts */ @import './assets/styles/fonts.scss';