text field value displays too light after being disabled

Products

• CA Service Management - Asset Portfolio Management
• CA Service Management - Service Desk Manager

Issue/Introduction

By design ,  when a text box field is disabled , it will  apply the default opacity setting for it  purposely  to  have it grayed out .     

The opacity property can take a value from 0.0 - 1.0. The lower value, the more transparent  . 

 Is there a way to change the disabled text box field  from   light gray  to a dark gray so that  the value in text box  can be seen clearly even it is disabled  ?

Environment

ITSM Service Catalog 17.0, 17.1 , 17.2  

Resolution

A .
The disabled text box's opacity setting is in form.css stylesheet file  under   catalog's  filestore\themes\common\css\  folder  .  In this file , it has the following to set  its opacity  to 0.5 as default :

div[ca-form] input[type="text"]:disabled, div[ca-form] input[type="password"]:disabled, div[ca-form] textarea:disabled, div[ca-form] .type_file:disabled, div[ca-form] .select-inactive {
  border-bottom-color: #CBD3DD;
  opacity:0.5;
}

div[ca-form] input[type="range"]:disabled, div[ca-form] button[type="button"]:disabled, div[ca-form] fieldSet:disabled, div[ca-form] .disabled-container, select:disabled{
    opacity:0.5;
}


If you  want the disabled text box's value NOT  be transparent  ,  you can set the opacity settings   above  as :   opacity:1.0;


B. 
If setting above ( opacity to 1.0 ) is still not enough ,  you can  add 
font-weight:bold;
into the sections above to make the disabled text field bold .

In other words , change the two sections above as the following :
 

div[ca-form] input[type="text"]:disabled, div[ca-form] input[type="password"]:disabled, div[ca-form] textarea:disabled, div[ca-form] .type_file:disabled, div[ca-form] .select-inactive {
  border-bottom-color: #CBD3DD;
  font-weight:bold; 
  opacity:1.0;
}

div[ca-form] input[type="range"]:disabled, div[ca-form] button[type="button"]:disabled, div[ca-form] fieldSet:disabled, div[ca-form] .disabled-container, select:disabled{
    font-weight:bold; 
    opacity:1.0;
}

and then stop catalog service , and delete all the files under USM_HOME/view/translets/   , and restart the catalog service to have the change take effect .   You will need to clear browser cache also . 



Note :
====
1.    please make a backup copy of original form.css  first before you modify form.css 
2.    after you set opacity value from default 0.5 to 1.0  in form.css  ,  you will need to clear browser cache to see the change take effect . 
3.    form.css  file under  catalog's  filestore\themes\common\css\  is not within catalog's customization framework .   So ,   in case, form.css is updated by any patch or upgrade ,  you will need to re-set this opacity  value as what you want .