Using Drupal 7 Views I have created a View which shows an SVG image file.
Here is an example scenerio: A Marketing Article Node is periodically created when a specific Prodcut offer is in place, the purpose being to show users of an new product offer (price discount etc), this offer includes within the node article 2 variations of the SVG discount graphic image i): a full graphic for Desktop/Laptop viewports ii): a smaller alternative sized graphic for mobile (cellular) devices such as iPhone/Android. Both images are listed at creation time of the Node, but ONLY ONE is to show a viewport.
Using a simple custom Drupal View, the 2 images are singularly shown on a relevant page (frontpage landing will suffice for example) based on the Viewport size, but my issue is that both show (ie on Desktop) and even though I have experimented with CSS within Views Field options and 'attribute' rules and considered CSS Field Modules and more all to no avail.
Again it is the INDIVIDUAL Files that needs to be accessed in order for the CSS Media Rule to be applied at CSS level.
Additionally, I have considered adding a CSS field to the image type in the system File-Types Module, but not sure if I can access the CSS there. Possibly my approach is wrong or simply missing something.
My final alternative would for now just create two types of Views for each Viewport and hide within the Panel.
Some directional pointers & advice please, is most welcome. I've spent over 4 hours on trying to find a solution. Thank you.
The following is not suitable: Different responsive image per breakpoint