Accessibility First DevRel. I focus on ensuring content created, events held and company assets are as accessible as possible, for as many people as possible.
Why didn't you name the areas A1 to H8 - that way it becomes exactly like chess and makes it even easier to implement moves according to normal chess rules (B2 to B4) etc.
Anyway that is only a minor point, this is a great way to do it using grid! ❤
He/him, developer, builder of things both tangible and abstract, practitioner of yoga and ukulele... All-around complicated monkey.
https://www.buymeacoffee.com/tobyplaystheuke
I had actually realized this yesterday, I'm working on this very thing. It's a great point, and thanks to the flexibility of grid-template-area, easily implemented.
He/him, developer, builder of things both tangible and abstract, practitioner of yoga and ukulele... All-around complicated monkey.
https://www.buymeacoffee.com/tobyplaystheuke
Done and done. Easier change than I'd expected - update the CSS grid-template-areas, then update the class to calculate the clicked grid-area (using Math.ceil() rather than Math.floor()), and working fine.
Thank you again!
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Why didn't you name the areas A1 to H8 - that way it becomes exactly like chess and makes it even easier to implement moves according to normal chess rules (B2 to B4) etc.
Anyway that is only a minor point, this is a great way to do it using grid! ❤
I had actually realized this yesterday, I'm working on this very thing. It's a great point, and thanks to the flexibility of grid-template-area, easily implemented.
Thanks for the feedback!
Done and done. Easier change than I'd expected - update the CSS
grid-template-areas, then update the class to calculate the clicked grid-area (usingMath.ceil()rather thanMath.floor()), and working fine.Thank you again!