Hello forums,
I need help (again)
I encountered an error on the console when activating the Bricks theme. However, when I use the Twenty Twenty-Four theme, this error does not appear.
Is there anything I missed?
How to solve it?
Hi Rio,
Thanks so much for your report!
Where exactly is the error output and to which SVG does it refer?
If it is an SVG that you have inserted yourself somewhere, you should give it a width and or height.
Best regards,
timmse
I think this is not the SVG element. However, the notification indicates an SVG error. Can you help me check the web?
This is the URL: https://riomastri.com
There are a bunch (10 in total) SVGs that have a width and height of “undefined”. Either remove the width and height attributes from your SVGs or use, e.g., 24 as a value.
1 Like
Thanks,
Solved
One of the icons in the library is missing the length attribute in the SVG.
@timmse I have a very similar situation with a Text Link element that contains an SVG icon.
Source page: Test - roatan-new.fizzpop.dev
I have tried every possible combination for sizing on the SVG and on the icon but it always remains undefined. What am I missing?
Here is the SVG code that is produced.
<svg class="fill stroke" xmlns="http://www.w3.org/2000/svg" width="undefined" height="undefined" viewBox="0 0 15 15">
<path fill="currentColor" d="m5.36 1.67l-.01 4.02a4.452 4.452 0 0 0-1.1-.11c-.37.1-.74.63-1.1.76a4.202 4.202 0 0 1 2.21-4.67Zm2.41-.64L9.8 4.48a3.183 3.183 0 0 1 .84-.61c.36-.1.94.17 1.34.11a4.202 4.202 0 0 0-4.21-2.95ZM1 13h13c-.66-.66-2.64-1.11-4.34-1.33l-1.87-7c.52-.05 1.15.03 1.53 0l-2.11-3.6H7.2a6.174 6.174 0 0 0-.7.14a4.38 4.38 0 0 0-.64.22l-.01 4.15c.35-.17.84-.54 1.3-.74l1.8 6.74c-.58-.05-1.09-.08-1.45-.08C6.03 11.5 2 12 1 13Z"></path>
</svg>
I also added a bunch of test cases on this test page with text links + icons and SVG only elements and none display a size.
However, other pages of the site do seem to work correctly:
https://roatan-new.fizzpop.dev/for-sale/
Note: These icons are using their inherent size and it is never declared:
Note I am running Bricks v1.10.3
@bvandrie The SVG height & width are correctly applied as far as I can see.
The code of your SVG file itself has the width & height attribute values set to undefined.
Bricks doesn’t edit the SVG code, but sets the width & height via CSS. Best to edit your SVG file directly if you want to remove those undefined values.
Great, thanks. I didn’t realize that the size was defined in the actual SVG code.
Someday I will understand how SVGs actually work.
1 Like