search

kando-menu / kando

🥧 The Cross-Platform Pie Menu.
https://ko-fi.com/post/Kando-1-0-0-released-G2G5Z1DOS
Other
1.23k stars 28 forks source link

Scale font in the center node to make text fit #331

Closed LelouBil closed 4 months ago

LelouBil commented 5 months ago

Hello, currently if the text set as "name" for a node is too long it can extend past the center node circle. Will there be a way to change the font size of the text for these cases ?

Schneegans commented 5 months ago

Hey there, thanks for the report! I think it should wrap to multiple lines and than ellipsize if there's not enough space. If that doesn't work currently, it's a bug :smile:

I'll look into it.

Schneegans commented 4 months ago

I looked into it and it is surprisingly difficult to wrap text inside a circle in CSS. There is the shape-outside which you can use in theory, however it is basically impossible to vertically center the text if it does not fill the entire circle.

For now, I chose to stay with a box shape, hide any overflowing text and added some margin to the text box so that it will not overflow the circle. This is not ideal but it should work in most cases. If it really becomes a common problem in the future, we may have to revisit it.

I really would not like to add some automatic text scaling as this would most likely result in forced reflows which would be very bad performance-wise. Manual text-scaling could be an option, but this would be pretty low on the priority list.