How to Change Modal Header Text Color - Answers - Salesforce Trailblazer Community
Ask Search:
Ken VermillionKen Vermillion 

How to Change Modal Header Text Color

<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId,lightning:actionOverride" access="global">
     <aura:attribute name="isOpen" type="Boolean" default="false" access="private"/>
     <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
      <aura:if isTrue="{!v.isOpen}">
                <section role="dialog" tabindex="-1" aria-labelledby="modal-heading-01" class="slds-modal slds-fade-in-open">
                    <div class="slds-modal__container">
                        <header class="slds-modal__header" style="background:#16325c">
                            <h2 id="modal-heading-01" class="slds-modal__title">New Account Details</h2>
                            <lightning:buttonIcon iconName="utility:close" class="slds-modal__close" onclick="{!c.closeFlowModal}"/>
                        </header>
                        <div class="slds-modal__content slds-p-around_medium">
                            <lightning:flow aura:id="flow" onstatuschange="{!c.closeModalOnFinish}" />
                        </div>                      
                    </div>
                </section>
                <div class="slds-backdrop slds-backdrop_open"></div> 
        </aura:if>
</aura:component>
slds-text-color is not working
 
Best Answer chosen by Ken Vermillion
Piyush SinghalPiyush Singhal
Hi Ken,

You are applying styling on wrong tag. Replace your <h2> tag with the below code
 
<h2 id="modal-heading-01" class="slds-modal__title" style="color: #2f2f2f;">New Account Details</h2>

Give color according your need. I hope this helps you.

Thanks and Regards
Piyush