fix: replace the PNG image with a self explaining SVG image without text

[andreassteinmann]

PR Type

[x] Bugfix
[ ] Feature
[ ] Code style update (formatting, local variables)
[ ] Refactoring (no functional changes, no API changes)
[ ] Build-related changes
[ ] CI-related changes
[ ] Documentation content changes
[ ] Application / infrastructure changes
[ ] Other:

What Is the Current Behavior?

Currently, the "Image Not Available" image includes text within the image. This should be prevented due to localization.

Issue Number: Relates to #625

What Is the New Behavior?

• The PNG image is replaced by an SVG image.
• The SVG image does not include text within the image any longer.
• The SVG image is self explaining and there is no need to add localized text. Furthermore, if the text would be added using pure HTML text it is hardly readable on thumbnail images (minicart, thumbs in product detail page etc.).
• The SVG image replaces the PNG in the same folder. It is not moved to a theme specific folder and the image reference is kept in the HTML component file(s) instead of SCSS.

Does this PR Introduce a Breaking Change?

[x] Yes
[ ] No

Other Information

The "Product Image Not Available" image is used for

• product images
• but also as a placeholder image for category images (until the category image is loaded)

Therefore both occurrences have to be tested.

How to test

Create a new product without product images and test the display of the "product image not available" SVG on the following pages:

• Product List
• PDP
• Minicart
• Cart
• Checkout Review
• Checkout Confirmation
• My Account - Order / Requisition Details
• My Account - Approval Details
• My Account - Order Template

AB#80263

[shauke]

Everything looks fine now, except for the Firefox rendering issue.