CSS for non editables in Attribute Inspector

[williamcarr]

Greetings,

     I currently have an app where some of the fields are set as non editable or uses a Map Service for the attribute Inspector. It serves it's purpose, but when seen on a tablet outdoors the colors(Grey text of light grey background) are almost impossible to see. I've tried:

  .esriAttributeInspector .atiField {   

        font-family: "Verdana";   

        font-size: 1em; 

        color: #000000;

        background: #ffffff;

        width: 200px;

        text:  #000000;

} 

  .esriAttributeInspector .atiTextAreaField {   

        font-family: "Verdana";   

        font-size: 1em;  

        background: #ffffff;

        color: #000000;

        width: 196px;  

} 

and other permutations, but to no avail. Is there another .ati*********** that I need to have for these non editable fields? I couldn't find that specific documentation.

Thanks.

[SteveCole]

Based on ESRI's attribute inspector sample, it looks like that shading is controlled by the Dojo dijitTextBoxDisabled css class.

[ChrisSergent · Accepted solution]

I got the text to change to red in just the disabled fields using this css:

.dj_webkit .claro .dijitDisabled input {

color: red;

}

and this will change the background color of the disabled fields to blue:

.claro .dijitSelectDisabled, .claro .dijitTextBoxDisabled, .claro .dijitTextBoxDisabled .dijitInputContainer {

background-color:Blue;

background-image: none;

}

Here is my code sample: JS Bin - Collaborative JavaScript Debugging

for this sample:

Attribute Inspector with one editable field | ArcGIS API for JavaScript

[williamcarr]

Thanks, Chris.

     Oddly enough, of all the changes that I made for some reason the dijitDisabled didn't display any changes in FireBug.. But it did in chrome!