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(`
`);
}
}