I’m trying to use SVGs inline in text boxes as topic markers.
With the SVG Support plugin installed, I import SVGs rendered to approximately 30px height and 30px width to the Media Library. Then I place them as media objects in the text module.
This works at the level of desktop display.
But on mobile, the SVGs are not responsive. They seize the entire width of the display. I’m aware of the issue of viewBox size and went through the painful process (as a rank beginner at coding) of trying to create 3 different sized SVG symbols and uses. I then assigned them by pixel breakpoints. Do do so, I emulated the process explained here: https://webdesign.tutsplus.com/tutorials/how-to-create-responsive-svg-images--cms-32140.
It took hours. Now the SVGs are too small and appear in a container that spans 5 or 6 lines of text. I can continue to slog along on this process. I’ll probably get it right eventually, but it’s burning way too much time.
(In another use case, I stuffed the SVGs into their own column. While the SVGs took the entire column width, they could be resized by resizing the column.)
Is there’s anything BB can do to make SVGs responsive or at least make resizing easier?