diff --git a/frontend/app/features/content/shared/list/content-value.component.html b/frontend/app/features/content/shared/list/content-value.component.html index 6cd833107..c878cfa92 100644 --- a/frontend/app/features/content/shared/list/content-value.component.html +++ b/frontend/app/features/content/shared/list/content-value.component.html @@ -1,6 +1,8 @@ - {{value}} + + {{value}} + -   + \ No newline at end of file diff --git a/frontend/app/features/content/shared/list/content-value.component.scss b/frontend/app/features/content/shared/list/content-value.component.scss index 8559d194b..9c4c63504 100644 --- a/frontend/app/features/content/shared/list/content-value.component.scss +++ b/frontend/app/features/content/shared/list/content-value.component.scss @@ -1,22 +1,20 @@ -:host ::ng-deep { - .html-value { - img { - margin-top: -15px; - max-height: 50px; - min-height: 50px; - position: absolute; - } +:host { + position: relative; +} - img + span { - padding-left: 60px; - } +:host ::ng-deep { + img { + max-height: 50px; + min-height: 50px; + position: absolute; + top: -15px; + } - span { - @include truncate; - } + img + span { + padding-left: 60px; } -} -.html-value { - position: relative; + span { + @include truncate; + } } \ No newline at end of file diff --git a/frontend/app/shared/state/contents.forms.spec.ts b/frontend/app/shared/state/contents.forms.spec.ts index 863e41e11..70e53ffa1 100644 --- a/frontend/app/shared/state/contents.forms.spec.ts +++ b/frontend/app/shared/state/contents.forms.spec.ts @@ -422,7 +422,7 @@ describe('StringField', () => { it('should format to preview image', () => { const field2 = createField({ properties: createProperties('String', { editor: 'StockPhoto' }) }); - expect(FieldFormatter.format(field2, 'https://images.unsplash.com/123?x', true)).toEqual(new HtmlValue('')); + expect(FieldFormatter.format(field2, 'https://images.unsplash.com/123?x', true)).toEqual(new HtmlValue('  ')); }); it('should not format to preview image when html not allowed', () => { @@ -463,7 +463,7 @@ describe('GetContentValue', () => { const result = getContentValue(content, language, assetWithImageAndFileName); - expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: new HtmlValue(' file13') }); + expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: new HtmlValue(' file13  ') }); }); it('should resolve image url only from referenced asset', () => { @@ -479,7 +479,7 @@ describe('GetContentValue', () => { const result = getContentValue(content, language, assetWithImage); - expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: new HtmlValue('') }); + expect(result).toEqual({ value: ['url/to/13', 'file13'], formatted: new HtmlValue('  ') }); }); it('should resolve filename only from referenced asset', () => { diff --git a/frontend/app/shared/state/contents.forms.visitors.ts b/frontend/app/shared/state/contents.forms.visitors.ts index 2eacffc6f..86beca463 100644 --- a/frontend/app/shared/state/contents.forms.visitors.ts +++ b/frontend/app/shared/state/contents.forms.visitors.ts @@ -55,9 +55,9 @@ export function getContentValue(content: ContentDto, language: LanguageDto, fiel const previewMode = field.properties['previewMode']; if (previewMode === 'ImageAndFileName') { - formatted = new HtmlValue(` ${value[1]}`); + formatted = new HtmlValue(` ${value[1]}  `); } else if (previewMode === 'Image') { - formatted = new HtmlValue(``); + formatted = new HtmlValue(`  `); } else { formatted = value[1]; } @@ -181,7 +181,7 @@ export class FieldFormatter implements FieldPropertiesVisitor { const src = thumbnail(this.value, undefined, 50); if (src) { - return new HtmlValue(``); + return new HtmlValue(`  `); } }