FavoriteAbhilash Pavushetti (Salesforce) asked in #Lightning ExperienceSep 18, 2021, 8:42 AMadd colors to lwc datatable headerHi Everyone.I want to add colors to LWC standard Lightning datattable. Please let me know how to add. <div class="slds-m-top_small slds-m-bottom_xx-large" > <c-custom-type-component class="POdataTable" key-field="Id" data={POrecords} columns={columns} onrowselection={selectedRecord} selected-rows={preSelectedRows} onsave={handleReturnQuantity} draft-values={saveDraftValues} onclick={removeInlinePopover} oncancel={clearSelecteData} min-column-width="120" onrowaction={getPopUpInfo} suppress-bottom-bar={supp} onpicklistchanged={picklistChanged} ></c-custom-type-component> </div>-----JS----{label:'PO⌗', fieldName:'PO_Number__c', type:'text',class : "POdataTable", innerWidth:120, cellAttributes: { class: 'slds-text-color_success slds-text-title_caps slds-color__background_gray-5'} },-------- so on columns-------CSS-----.THIS {}.THIS .POdataTable thead th span { background-color: ⌗2a5596; color: white;}Show More4 answersSortSort by DateSort by Most HelpfulSort by DateLoad more comments...Kalpesh Shringarpure (PWC)Jun 1, 2023, 9:27 AMHi,try using below code for backgroud color of heaeders in your CSS:host { --lwc-tableColorBackgroundHeader : ⌗820000;}Similarly use standard variables like "--sds-c-card-color-background" for lightning card.Add a commentWrite an answer...BoldItalicUnderlineStrikethroughBulleted ListNumbered ListAdd linkCode blockInsert imageAttach filesLink URLCancelSave0/9000Reply
Kalpesh Shringarpure (PWC)Jun 1, 2023, 9:27 AMHi,try using below code for backgroud color of heaeders in your CSS:host { --lwc-tableColorBackgroundHeader : ⌗820000;}Similarly use standard variables like "--sds-c-card-color-background" for lightning card.
