Mascot Testimonial CSS for itch.io

This lets you place a mascot image on your pages on the bottom right corner and lets you give them messages to display when people mouse over games, assets or whatever on your page.

Instructions:

Getting Started:

• Get CSS access on your pages from itch.io's support.  
• Make Visual Novels (Obligatory visual novel propaganda)
• Put an image somewhere in the description of your page.
• Switch to HTML mode in the editor, find the image (usually img scr= something)
• Add <div class="custom-mascot" in front of it.
• Add </div> after the </img> closing tag.  If you don't have one,  then after the img tag's /> at the end of that line.
• Copy and paste the contents of MVNMascot.css into the CSS theme editor.
  
• Your mascot graphicshould be visible in the bottom right now.  
• Play with the values in game_cell:before and after to customize the look.
• If you don't want a name box at all, remove the game_cell:hover:before section entirely from the CSS. Otherwise make sure you add the name of your character there.

Filling in speech bubbles:

Add this line for each game you have in your main game list:

.user_game_grid:nth-of-type(1) .game_cell:nth-of-type(#):hover::after { content: "\AWhat you want them to say"; }

Add this line for each thing you have in a collection that's on the page.:

.collection_row:nth-of-type(#) .game_cell:nth-of-type(#):hover::after { content: "\AWhat you want them to say";   }

In both cases, replace the # symbol above with the number of the game/asset or collection.  e.g: The 3rd game in your main list would get a 3.  The 4th game in your 2nd collection would get a 2 in the first #, and a 4 in the second # for the collection_rows.

Note: CSS on itch is presently limited to 5120 characters, which is very easy to hit with this.  Optimize your messages and CSS accordingly!

This is mostly here to prevent myself from having to explain how I achieved the effect on my own itch.io page.  If you need free support for this asset, I recommend picking up learning CSS.  If you'd like support or customization for CSS on your page, I take paying requests only