21 replies to this topic

[Yahtzeee]

firstly..english is no my native language..so forgive me for any grammar mistake..
soo..back to the topic..i have customize the old FS theme and is almost ready, but I have some problems regarding with the "Inventory slot" as you can see on the picture below
i want to change it based on the theme colour but i cant find the code for it
anyone know where is it located ?

 

[lerijs13]

use something like this:

table.inventory-table td
{
  background: darkblue !important;
}

[Yahtzeee]

almost..but what i want to change was the slot itself..not the slot background
so it will look like this


btw..thank for helping

[lerijs13]

How do you wanna change it then ? 

[Yahtzeee]

that what i want to know T_T
but..i reedit those code that i give me before..almost got it right 



 

table.inventory-table td
{
background-image: url('http://imageurl.gif');
}

[lerijs13]

edit the picture and show me what u want to achieve, i`ll help you. 

[koenvdv]

Would it work if u change this from CSS:

.inventory-item-slot
{
	background: url('http://fileserver.huntedcow.com/inventory/1x1.gif');
    display: inline-block;
}

[Anonemesis]

 

Would it work if u change this from CSS:

.inventory-item-slot
{
	background: url('http://fileserver.huntedcow.com/inventory/1x1.gif');
    display: inline-block;
}

Nope

table.inventory-table td
{
background-image: url('http://imageurl.gif');
}

lacks spacing and boundries so it repeats and scrunchs together

[Yahtzeee]

edit the picture and show me what u want to achieve, i`ll help you. 

that what i want to achieve..to make only the slot background to change..

[Anonemesis]

that what i want to achieve..to make only the slot background to change..

 

 

I do themes for points on here myself, I asked the dev's this in a support ticket as some things can't be changed like the Fallensword Logo...only masked with  a image which is what the code previously did except it had no boundries so it just kept repeating, anyone finds this out that'd be great =P

[lerijs13]

Use this:

table.inventory-table > tbody > tr > td[align=center] td
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) no-repeat;
}

table.inventory-table > tbody > tr > td:not([align])
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

[Anonemesis]

 

Use this:

table.inventory-table > tbody > tr > td[align=center] td
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) no-repeat;
}

table.inventory-table > tbody > tr > td:not([align])
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

Works perfect except

 

http://img577.images...7/6326/xqeg.png

 

The backpack icons have slot icons behind them, and components slots are still messed up

 

also

 

http://img856.images...6/7570/jayp.png

if you only have one row of backpack space it will be messed up as well

[lerijs13]

Ok, this code is only for the worn items:

div#profileRightColumn > div > div > table.inventory-table > tbody > tr > td[align=center] td
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) no-repeat;
}

div#profileRightColumn > div > div > table.inventory-table > tbody > tr > td:not([align])
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

[koenvdv]

Cool ... could u share the complete theme once it's finished? Then I could use that as base to make one myself if I find the time ^^

[Yahtzeee]

damn..ur good !
already solve my prob..thank you soo much !

[lerijs13]

Your welcome.. I am a WEB developer, so if you need any more help - just message me.  

[lerijs13]

here you go, guys!  

/**
* Inventory CSS by Lerijs13
*/
/* Worn rune, amulet and Ring slot */
div#profileRightColumn > div > div > table.inventory-table > tbody > tr > td[align=center] td
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) no-repeat;
}

/* rest of worn item slots */
div#profileRightColumn > div > div > table.inventory-table > tbody > tr > td:not([align])
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

/* backpack item slots */
div#profileRightColumn > form > div > table.inventory-table > tbody > tr > td[width]
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

/* component slots */
div#profileRightColumn > div > table.inventory-table > tbody > tr > td:not([valign])[width]
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

[Anonemesis]

 

here you go, guys!

/**
* Inventory CSS by Lerijs13
*/
/* Worn rune, amulet and Ring slot */
div#profileRightColumn > div > div > table.inventory-table > tbody > tr > td[align=center] td
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) no-repeat;
}

/* rest of worn item slots */
div#profileRightColumn > div > div > table.inventory-table > tbody > tr > td:not([align])
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

/* backpack item slots */
div#profileRightColumn > form > div > table.inventory-table > tbody > tr > td[width]
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

/* component slots */
div#profileRightColumn > div > table.inventory-table > tbody > tr > td:not([valign])[width]
{
  background: url(http://i1276.photobucket.com/albums/y462/Shahrul_Jebat/2x2_zpsc9caea2d.gif) repeat;
}

Very Nice Work Gotta Give Credit Where It's Due

 

Note that components are 20x20 not 30x30 so you'll have to shrink your image down accordingly in order to get it to fit properly, I'd suggest people use 1x1 images to make the process quicker if your using a image that mirrors itself

 

[koenvdv]

Finaly found out what this does:

.inventory-item-slot
{
	background: url('http://rs.wow-goldstore.com/images/other/logo-icon.png');
    display: inline-block;
}

It changes the guild store slots 

[Anonemesis]

Finaly found out what this does:

.inventory-item-slot
{
	background: url('http://rs.wow-goldstore.com/images/other/logo-icon.png');
    display: inline-block;
}

It changes the guild store slots 

NiiCe