Fixing the Disabled-Field display drawback

If you have questions or if you want to share your opinion about Aware IM post your message on this forum
Post Reply
Elmar
Posts: 62
Joined: Tue Mar 06, 2007 12:19 pm

Fixing the Disabled-Field display drawback

Post by Elmar »

Hi there.

Sorry for not posting this earlier. I simply forgot about the issue as I fixed it on my local machine a while ago. Now I had to reinstall AwareIM and the ugly disabled fields were back.

fw/<yourstyle>/style/Forms.css:

.fc .fd INPUT[disabled], .fc .fd TEXTAREA[disabled] {

color: #000000;
border-top-style: none;
border-right-style: none;
border-left-style: none;
background-color: transparent;
border-bottom-style: none;
font-weight: normal;
}



Ok, so my approach is to swap the layout of ALL disabled input fields within AwareIM. That makes it a lot easier than having to apply a style to each disabled field seperatly. I can´t even think of an occasion where one would favor to have unreadable, greyed out textboxes anyway :wink:.

Unfortunatly -and God knows why- IE does not support or even ignores this. Anyhow it can be partly fixed if the AwareIM folks would append a class="disabled" or similar to every disabled input. Then it would be as easy to adress disabled fields in IE too. After that, one can control the visual layout of the box, the font-size etc. but unfortunatly not the font color in IE.

@AwareIM: Do you think it would be possible to add a class definition?
@All: Does anyone know of a way to change the font color of disabled fields in IE? That is the only issue that I could not fix.

All the best,
Elmar
Elmar
Posts: 62
Joined: Tue Mar 06, 2007 12:19 pm

Post by Elmar »

Follow-up:

To fix the hole issue altogether I can propose another approach which would render in all recent browsers.

Use ' readonly class="readonly" ' instead of ' disabled ' as a read-only indicator in forms fields.

In forms.css add

.readonly {
border-top-style: none;
border-right-style: none;
border-left-style: none;
background-color: transparent;
border-bottom-style: none;
font-weight: normal;
}

It works in FireFox and IE. Text is very readable and does not look like an input field anymore.

All the best,
Elmar
Elmar
Posts: 62
Joined: Tue Mar 06, 2007 12:19 pm

Post by Elmar »

Sorry, I forgot to state the this proposal is geared towards the AwareIM-Team. Exchanging disabled with readonly is something that needs to be done in the Form-Generator and can´t be done by endusers I suppose.
Post Reply