Forums » Advanced Editor Forum » Read Thread

Is there is a way to change the background of the border of the inventory section (i.e. the part with the words "My Inventory")?  I ask because my game has a parchment background; and, as it stands, the white background of the inventory section looks kinda weird.

Yes there is. How? I've completely forgotten, sorry. I am looking around to see if I can find what I used...

Thanks, Ogre. The advanced editor is an ancient artifact from a lost civilization. Beautiful, powerful, and strange. 

Ugh! I wish I could find it, but I can't. I'm hoping @BradinDvorak will pop in, he likely knows quickly where to find the secret code for this...

This CSS replaces all of the images in the table's border with ones that have proper transparency.

<!--

<style>
td>img[src*='i_m'], td>img[src*='i_t'] {box-sizing: border-box; padding-top: 19px; height: 19px;}
td>img[src*='i_b'], td>img[src*='i_tb']  {box-sizing: border-box; padding-top: 5px; height: 5px;}
td>img[src*='i_bbar'] {background-image: url(data:image/gif;base64,R0lGODlhAQAFAIABAAAAAP///yH5BAEAAAEALAAAAAABAAUAAAIDTGAFADs=);}
td>img[src*='i_bl'] {background-image: url(data:image/gif;base64,R0lGODlhBQAFAIABAAAAAP///yH5BAEAAAEALAAAAAAFAAUAAAIHTGCGCZ2fCgA7);}
td>img[src*='i_br'] {background-image: url(data:image/gif;base64,R0lGODlhBQAFAIABAAAAAP///yH5BAEAAAEALAAAAAAFAAUAAAIHTGCGB5ufCgA7);}
td[style*='i_m'] {background-image: url(data:image/gif;base64,R0lGODlhBQATAIABAAAAAP///yH5BAEAAAEALAAAAAAFABMAAAIQTGCGuZr3GmSx0uvwzHzPAgA7) !important;}
td>img[src*='i_ml'] {background-image: url(data:image/gif;base64,R0lGODlhBQATAIABAAAAAP///yH5BAEAAAEALAAAAAAFABMAAAIQjI8GuNfKolPgBYslnDylAgA7);}
td>img[src*='i_mr'] {background-image: url(data:image/gif;base64,R0lGODlhBQATAIABAAAAAP///yH5BAEAAAEALAAAAAAFABMAAAIQjI8GuNfKomOgvXCzhKmnAgA7);}
td>img[src*='i_tbar'] {background-image: url(data:image/gif;base64,R0lGODlhAQAFAIABAAAAAP///yH5BAEAAAEALAAAAAABAAUAAAIDTGAFADs=);}
td>img[src*='i_tl'] {background-image: url(data:image/gif;base64,R0lGODlhBQATAIABAAAAAP///yH5BAEAAAEALAAAAAAFABMAAAIPjI+py20AHwKzHnqtzKEAADs=);}
td>img[src*='i_tr'] {background-image: url(data:image/gif;base64,R0lGODlhBQATAIABAAAAAP///yH5BAEAAAEALAAAAAAFABMAAAIOjI+pyw2PQJxHVmpspgUAOw==);}
</style>

-->

There's an alternative that takes advantage of the multiply blend mode since the images' backgrounds are white, but it's also got less browser support.

<!--

<style>
td>img[src*='i_b'],td>img[src*='i_m'],td>img[src*='i_t'],td[style*='i_m']{mix-blend-mode:multiply;}
</style>

-->

That worked! You rock. Thanks! :-D