diff --git a/frontend/src/app/components/medical-sources-card/medical-sources-card.component.html b/frontend/src/app/components/medical-sources-card/medical-sources-card.component.html index 212bf223..0f31ec28 100644 --- a/frontend/src/app/components/medical-sources-card/medical-sources-card.component.html +++ b/frontend/src/app/components/medical-sources-card/medical-sources-card.component.html @@ -2,7 +2,7 @@
- +
failed
diff --git a/frontend/src/app/directives/directives.module.ts b/frontend/src/app/directives/directives.module.ts index 10322dc2..2b838e53 100644 --- a/frontend/src/app/directives/directives.module.ts +++ b/frontend/src/app/directives/directives.module.ts @@ -3,16 +3,19 @@ import { NgModule } from '@angular/core'; // Directives import {ExternalLinkDirective} from './external-link.directive'; +import { ImageFallbackDirective } from './image-fallback.directive'; @NgModule({ declarations: [ ExternalLinkDirective, + ImageFallbackDirective, ], imports: [ ], - exports: [ - ExternalLinkDirective, - ] + exports: [ + ExternalLinkDirective, + ImageFallbackDirective, + ] }) export class DirectivesModule {} diff --git a/frontend/src/app/directives/image-fallback.directive.spec.ts b/frontend/src/app/directives/image-fallback.directive.spec.ts new file mode 100644 index 00000000..bc5e23d0 --- /dev/null +++ b/frontend/src/app/directives/image-fallback.directive.spec.ts @@ -0,0 +1,8 @@ +import { ImageFallbackDirective } from './image-fallback.directive'; + +describe('ImageFallbackDirective', () => { + it('should create an instance', () => { + const directive = new ImageFallbackDirective(); + expect(directive).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/directives/image-fallback.directive.ts b/frontend/src/app/directives/image-fallback.directive.ts new file mode 100644 index 00000000..1fb52a36 --- /dev/null +++ b/frontend/src/app/directives/image-fallback.directive.ts @@ -0,0 +1,16 @@ +import {Directive, ElementRef, HostListener, Input} from '@angular/core'; + +@Directive({ + selector: 'img[imageFallback]' +}) +export class ImageFallbackDirective { + + @Input() imageFallback?: string; + constructor(private elementRef: ElementRef) {} + + @HostListener('error') + loadFallbackOnError() { + this.elementRef.nativeElement.src = this.imageFallback || 'assets/images/no-image.svg'; + } + +} diff --git a/frontend/src/assets/banner/banner-trimmed.png b/frontend/src/assets/banner/banner-trimmed.png new file mode 100644 index 00000000..519ebc95 Binary files /dev/null and b/frontend/src/assets/banner/banner-trimmed.png differ diff --git a/frontend/src/assets/images/no-image.svg b/frontend/src/assets/images/no-image.svg new file mode 100644 index 00000000..22a2e0a5 --- /dev/null +++ b/frontend/src/assets/images/no-image.svg @@ -0,0 +1,4 @@ + + + +