I want to implement an existing chat URL (https://chat.restream.io/embed?token=bebb117e-81d4-4394-9901-0c644ac2ee51) into a stream via OBS Studio’s internal browser. Instead of being rectangular, I want the text to wrap around a polygonal shape, basically a triangle in the bottom left corner.
As you can see in the source code, there are a lot of classes that could be used (like jss1, jss3, jss5 and chat-messages).
Playing around with clip-path and shape-outside, I somehow cannot get it to work properly.
The actual polygon will be a bit more complicated than these triangles, which should not matter for coming up with a solution. Right now, it just floats under.
I tried different shapes and paths in different classes, befores and afters, but it either cuts off the text before or after instead of making it wrap around the shape:
clip-path: polygon(0 0, 100% 0, 100% 100%);
shape-outside: polygon(0 0, 100% 100%, 0 100%);
You need to sign in to view this answers