v1.2.0 – Author Badge, Masonry Layout, & More!
Hello hello, its been a while. Lots of stuff going on. Here’s 4 more addition to the catalogue: Author Badge, Masonry Layout, Grouped Label, & In Development Sign.
The app’s layout and appearance also received some readjustment.

Author Badge New
I remembered reading this as a suggestion somewhere, but can’t point the exact posts or threads.
Sometimes, when I scroll through the ocean that is the comment section on various project pages, its kinda hard to see which one is the developers/contributors of said project at a glance. This tweak will add a badge of any titles right next to any user’s username in the comments.

You can technically have multiple badges for multiple users in the comments. I’m trying to implement multi-user badges within the app directly. But for now, you can add the following CSS manually to add more badges.
.game_comments_widget .avatar_container[
href="AUTHOR_BADGE_URL"
] + .post_header > .post_author::after {
content: "AUTHOR_BADGE_TITLE";
}
Replace AUTHOR_BADGE_URL
to your itch.io profile URL (i.e. https://itch.io/profile/nnda
). And replace AUTHOR_BADGE_TITLE
to the title of the badge.
Masonry Layout New Experimental
This tweak will enable masonry layout to the screenshot section of the project page, and put the screenshot section on top. This one is rather experimental, so make sure to test it thoroughly.

It will set the images to three-column masonry layout on desktop, and two-column on mobile. Works best with >6 screenshots, of varying aspect ratio.
Changelog
✨ New
- 1 new component: Label’s Grouped sub-component
- 1 new decoration: In Development Sign
- 2 new tweaks: Author Badge, and Masonry Layout
🛠️ Changes
- Minor app’s layout and appearance readjustment
Some other stuff is still cooking. And I’ll documents and tidy up the horror that is the TypeScript codes, and reconsider some of the app’s workflows in the next update.
Thank you for reading, and don’t forget to update your browser.
Pitch – CSS Components and Tweaks for Your Project Pages
Collection of CSS components to spice up your project page.
Status | Released |
Category | Tool |
Author | nnda |
Tags | css, design, framework, html, Open Source, page, sourcecode, Project template |
More posts
- v1.0.0 – Component selector web appSep 24, 2024
- v0.0.3 – Live preview, documentation guides, and Alert BoxNov 23, 2023
- v0.0.2 – Fallback & CompabilityAug 21, 2023
Leave a comment
Log in with itch.io to leave a comment.