Local SVG images with percentage width are not sized correctly

[na3shkw]

What information was incorrect, unhelpful, or incomplete?

SVG images with a percentage value set in the width attribute of the svg element are not displayed at the correct size.
For example, if you have a local SVG image with width="100%" set on the svg element, the attribute on the img element that displays it will be set to width="100".

What did you expect to see?

The width of an SVG image with a percentage value for the width attribute should be determined based on the value of the viewBox attribute.

Do you have any supporting links, references, or citations?

• MDN URL: https://developer.mozilla.org/ja/docs/Web/HTTP/CORS#%E3%83%97%E3%83%AA%E3%83%95%E3%83%A9%E3%82%A4%E3%83%88%E3%83%AA%E3%82%AF%E3%82%A8%E3%82%B9%E3%83%88
• Related Issue: 「オリジン間リソース共有 (CORS)」のページで SVG 画像が小さく表示されてしまっている translated-content#25551
• Related Pull Request: SVG画像の表示サイズとコンテンツの軽微な修正 translated-content#26012

Do you have anything more you want to share?

I believe this problem can be solved by using the width method to get the width of the image in the following code, instead of directly referencing the width of the Width structure. If the value of the width attribute of the svg element is specified as a percentage, the width method will calculate the width of the image based on the viewbox.

rari/crates/rari-doc/src/html/fix_img.rs

Line 65 in 28b1a2c

let width = meta.width.map(|w| w.width);