Making and uploading the manual and JSON - kuro-ktane-mods/module-template GitHub Wiki

The Community ModKit contains a template manual, but this is usually out-dated. To get the latest template manual, go to the Repository of Manual Pages, then go to More > Template manual.

image

HTML

Follow the instructions in the Tutorial HTML file, remembering to delete it when done. This file should tell you everything you need to know, but I'll say some key things here which you can follow to make maintainers' lives easier :)

  • define CSS classes in a style element instead of using in-line CSS (using style attributes)
    • there are also some classes in main.css which may be of use. Some notable ones include invertible, centered, centered-img, and highlightable.
  • check that your manual looks good in dark mode. Switch to dark mode by pressing Alt+W. Dark mode adds the dark class to the body element, and any element with the darkable class
  • try not to exceed the page boundaries set by the background (especially visible in dark mode)
  • minify your component SVG and any other SVGs using SVGOMG. When making SVGs, make them directly using software like Inkscape, or ask in the #repo-discussion channel of the Official KTaNE Discord Server for someone to do it for you. Please do not embed PNGs into SVGs.
  • crush PNGs with PNGCRUSH (if you find trouble installing this, you can use an online version like this one)

JSON

To make the JSON file, go to the Repository of Manual Pages again and go to Tools > Create new module, and fill in the form.

image

Note that you need to upload your module to Steam to fill in the field Steam ID.

If multiple people contributed to your module, remember to fill in the Contributors section at the bottom.

Finally, click Generate JSON and save the file (save it as a .json file, not .txt), renaming it to match the name of your module.

Upload

Your manual folder should be structures like so:

  • the HTML file should be in the HTML folder, and the JSON file in the JSON folder, and have the same name.
  • the component SVG should be in HTML/img/Component/ and have the same name as the HTML and JSON files, and any other images should be in HTML/img/Module Name/, where the folder has the same name as the aforementioned files.
  • any extra Javascript or CSS files should be in HTML/js/Modules or HTML/css/Modules respectively, and be named the same as the rest of the files.

Place all your manual files in one folder, and zip it up. Lint your manual by sending LogBot a DM with this .zip file attached and the message !lint, and fix any errors it throws. Finally, send the file to #repo-requests, where a maintainer will pick it up and upload it.

If you have any questions about this process at any point, feel free to drop a question at #repo-discussion!