nnda _^.itch.io

Source code for my itch.io profile page.

Main stylesheet: src/styles.css ｜ Profile content: src/content.html

Devlog

• May 23^rd 2025 — Profile Page Updates: Documentation

Page theme settings

Theme setting		Value
Color	BG	#15141B
	Text	#E7E9E8 (match --text CSS variable)
	Link	#EAEAEA (match --link CSS variable)
Text	Font	Zen Kaku Gothic New
	Size	96
Images	Size	Full width
My Projects	Layout	Grid
	B. Radius	0
Collections	Layout	List

Installation

Require Node.js >23.5 or as latest as you possibly can get.

0. Star this repo?? 👉👈 (optional)

1. Fork this repository, and clone your fork locally.

2. Install the dependencies.

   npm install
   

3. Modify the src/styles.css and/or the src/content.html to your liking.

   See the Development section.

4. Edit package.json, and bump the version field. e.g. from 1.2.0 to 1.3.0.

5. Build the CSS.

   npm run build
   

6. Test the CSS and the HTML, by copy-pasting the content of dist/test.css and dist/content.html to your itch.io profile page.

7. If everything's fine and ready, publish your updates.

   npm run publish
   

   And then copy-paste the CSS from dist/styles.css to your itch.io profile page, and save it.

Important

If you've only changed the HTML, there's no need to bump the version and publish the update via npm run publish, as that is only for the CSS updates.

You should, however, run the npm run build, and then commit and push the changes to the HTML files yourself.

Development

How do I update and develop the page with its HTML and CSS.

I use Firefox, because it has a nice style editor feature on its dev tool.

1. Open your itch.io profile page. And clear out the custom CSS field (just clear it out, you don't need to save it).

2. Open the Firefox Web Developer Tools by pressing f12 or Ctrl + Shift + I.

3. Go to the Style Editor tab, and import the CSS source file.

   

   You can start working with the CSS from here. And save your changes by pressing Ctrl + S.

Important

When importing CSS file that has unicode characters in it (like this CSS), Firefox might break those characters.

To fix that:

1. Open the CSS in your favourite text editor.
2. Select and copy ALL of the content.
3. Go back to the Firefox Style Editor, and paste over the imported CSS, overwriting it.

As for editing the HTML, I just copy-paste the content of src/content.html to the .user_profile.formatted element on the Inspector tab. Edit it there, and copy it back to the src/content.html HTML file.

License

MIT licensed :)