search

dwmkerr / crosswords-js

Tiny, lightweight crossword control for the web.
https://dwmkerr.github.io/crosswords-js/
MIT License
71 stars 27 forks source link

use css variables for grid size #38

Closed mmkal closed 9 months ago

mmkal commented 9 months ago

Fix a bug, possibly introduced by https://github.com/dwmkerr/crosswords-js/pull/36 (not sure though, I didn't use the version before that pull request).

36 introduced less, which has variables, but the variables are still "static" - they don't know the dimensions of the actual crossword being rendered, because that's dynamic. CSS variables are designed for exactly this sort of thing. Less variables are still useful when dynamic values aren't needed (i.e. just for organization/developer experience) - so I didn't touch the other variables. Here's what a 9x9 crossword looks like without this change:

image

And here's what it looks like with this change (this is what it's supposed to look like!!):

image

Note: css variables are supported pretty much everywhere, but not IE 11 or Opera Mini: https://caniuse.com/css-variables

dwmkerr commented 9 months ago

awesome! Thanks @mmkal and thanks for the detailed write up of the changes and fix