Nullboard: Kanban board in a single HTML file

This is very neat! I'd be interested to see something like this with a saving mechanism reminiscent of TiddlyWiki [0], which is saved as a portable HTML file. Documents that contain their own editors like this are really neat for offline use and long-term storage.

[0] https://tiddlywiki.com/#SavingMechanism

I tried this script (which Claude came up with) to save file with all it's changes. The steps are

1. Put this script in html file and add a save/download button to trigger it

2. Set `contenteditable` on you editable elements

That's it. Now make changes on the page and click download button to save the page with your changes. This should allow seeing your work without necessarily depending on JS.

The script:

    <script>
    function downloadHTMLFile() {
      // Get the current HTML content
      const html = document.documentElement.outerHTML;

      // Create a temporary link element
      const link = document.createElement('a');
      link.setAttribute('download', 'example-page.html');

      // Encode the HTML content as a data URI
      const encodedContent = encodeURIComponent(html);
      link.setAttribute('href', 'data:text/html;charset=utf-8,' + encodedContent);

      // Append the link to the DOM and click it
      document.body.appendChild(link);
      link.click();

      // Remove the temporary link element
      document.body.removeChild(link);
    }
    </script>

No need for the script. Browsers have "save as file" functionality built in!

I dont think using save as keeps the changes you make in HTML using contenteditable.