Griditor

A visual editor for making use of the grid-template css shorthand.

Todo

Features

• set columns width
• set rows height
• add rows
• add columns
• add areas
• add areas when no cell is empty
• rename areas
• move areas
• change areas horizontal and vertical span
• being able to change the output to use areas first and track names second
• being able to change the output to use onlt track names
• being able to initialise the editor with an grid-template value
• toggle formating for the output
• add styling to show the grid
  • gap fill style
  • render tracks
• add unit autocomplete in width/height fields
• add validity checks in width/height fields
• how to edit overlapping area ?
• accessibility https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/grid_role

Content

• add an explainer on how the grid-template shorthand works
• add an explainer on how the editor works (maybe avoid that)
• logo ?

Potential names

• InGrid
• Grid-itor
• Gridler
• Gridient
• Gridit
• Griddy
• Gridiculous
• Gridlicious
• Gridposium
• Gridorium