mirror of
git://git.tartarus.org/simon/puzzles.git
synced 2025-04-20 15:41:30 -07:00
Files

In the old design, when they wrapped onto multiple lines, various bad things happened. The lines overlapped one another, the lines got broken within buttons but not between buttons, and if they had got broken between buttons the left button on each line would have lacked a left border. I've made two major changes to fix this. First, I've switched from flow layout to flex layout. This has much better default behaviour, breaking lines in the right places, not overlapping lines, and even arranging line-wrapping within a button when the viewport gets really narrow. Second, I've given each button a border on all four sides and then used negative margins to overlap them. This required changing the borders from transparent black to opaque grey to make them display correctly when overlapping. The result is not quite identical to the old version on a wide viewport, but I think it's as close as I can get while keeping the new CSS pleasant. Ideally, the separator would vanish when it was adjacent to a line break, but I've not worked out how to do that yet.