How to change the Text Color of Post button in RITM

[sattar3]

Hello All,

I want to change the Text color of Post button in RITM.

Please check the attached screenshot, at present the text color is Black but we want to change it to White.

It is OOTB Widget "Standard Ticket Actions" in our instance but in PDI the text color of the Post button is in white

Please check the HTML and CSS code in our instance.

HTML code with Post:

<form ng-submit="postEntry(data.journalEntry)" class="padding" id="sand">

<textarea ng-keypress="keyPress($event)" sn-resize-height="trim" rows="1" id="post-input"

<input type="submit" class="btn btn-primary post-btn" value="{{data.btnLabel}}" aria-label="{{data.btnLabel}}" ng-disabled="data.isPosting" ng-if="!data.read_only"/>

CSS code with Post:

.post-btn {
min-width: 80px;
padding: 9px 15px;
color:white;
}

Can some one please help me on this?

@Ankur Bawiskar @Dr Atul G- LNG @Mark Roethof @Community Alums 

Thanks,

Sattar

[Community Alums]

Hi @sattar3 ,

The solution mentioned might help you : https://www.servicenow.com/community/developer-forum/how-to-change-text-color-on-csm-portal-widget/m...

[HrishabhKumar]

Hi @sattar3 ,

Try using !important during setting the text color.

Updated CSS:

.post-btn {
min-width: 80px;
padding: 9px 15px;
color:white !important;
}

Check for Overriding Styles

Inspect the button using the browser's Developer Tools to see if there are any other CSS rules overriding your styles. Look for the "Post" button and check the applied styles:

1. Right-click on the "Post" button and select "Inspect" or "Inspect Element".
2. In the Elements panel, look at the styles applied to the button.
3. Ensure your .post-btn styles are being applied and not overridden by other styles.

Thanks,

Hope this helps.

If my response proves helpful please mark it helpful and accept it as solution to close this thread.

[sattar3]

Hi @HrishabhKumar Thanks for the reply.

If i add the cloned widget with updated CSS it shows Send button instead Post and the color is White.

I checked in inspection, it shows like this

Can you please help me on this?

Thanks,

Sattar

[Sid_Takali · Accepted solution]

Hi @sattar3 This kind of requirement there is no need customize/cloning a widget. You can just override CSS  code in page specific CSS

.post-btn {
 color: white !important; 
}