top | item 40755239

(no title)

felixfbecker | 1 year ago

> In SVG land, there is no way to orient around a multiline text box's corners, you can only align the baseline of the first line of text. In fact, there is no way to set a width on a box and have text wrap to the next line when it hits said width. Etc., etc.

You can use <foreignElement> and just include HTML text with all CSS text layout capabilities to achieve that. It won't work in Illustrator or Figma, but it's fine for the web. I honestly am somewhat okay with that, let HTML+CSS handle what it's already best at instead of duplicating functionality into SVG.

The z-index is somewhat annoying for accessibility though, because the DOM order also determines the accessibility tree order, so it's not always possible to reorder the DOM to re-arrange the z-order without breaking screen reader order.

discuss

order

bobthepanda|1 year ago

to be honest i think the warts of svg aren't necessarily the worst for writing svg by hand, though it's not great.

but it makes writing design programs that output svg, annoying. the need for a `textarea` element is so great it's already in what was supposed to be the next generation of the spec; and pretty much all SVG output software has a way to input text boxes to treat them like that. But I suspect the complexity of dealing with svg is why alternatives to the Adobe Suite have only become more numerous recently; it's a complex beast.

to me, .ai and .svg are the equivalents to .doc and .docx, but we don't really have a great alternative a la Markdown that is significantly easier to output.