PDA

View Full Version : Modifying disclosure icon in a list



bcraun
3 Jun 2011, 5:47 AM
What's the trick to modify the disclosure icon in a list x-type? I found a few posts that describe the CSS overrides to use, but they do not work for me for some reason. The selector appears to be recognized, but the result is a solid blue box where the disclosure icon would normally be located. Here's the CSS I'm using (and the only way that I can even get the icon to change at all):


#foo.x-list .x-list-disclosure {

-webkit-mask-image: url('images/disclosure1.png') !important;

width: 24px;

height: 24px;

-webkit-mask-size: 24px 24px;
}

bgartenmann
3 Jun 2011, 7:08 AM
Hi bcbraun!

I don't know how this is achieved "correctly", but this solution seems to work:


.x-list .x-list-disclosure {
-webkit-mask: none;
background-image: url('images/disclosure1.png') !important;
background-size: 24px 24px;
width: 24px;
height: 24px;
}


Hope this helps ;)

bcraun
3 Jun 2011, 8:37 AM
Thanks bgartenmann, that did it.