loktevich

/* Dark lightning datatable without header actions simplified example */

/* Better to create selectors with your entire component (c-my-component)  */
c-my-component lightning-datatable .slds-th__action-button {
    display: none;
}
/* Sometimes it needs to create more specific selectors as standard components may contain another componenets */
c-my-component lightning-datatable th .slds-cell-fixed {
    background-color: #333;
    color: #fff;

loktevich

// Rendered callback adds style element that hides standard action buttons
renderedCallback() {
    if (!this.hasRendered) {
        const style = document.createElement("style");
        style.innerText =
            "c-my-component lightning-datatable .slds-th__action-button {display: none;}";
        this.template
            .querySelector("lightning-datatable")
            .appendChild(style);

loktevich

<template>
    <!-- A custom component instead of lightning-datatable -->
    <c-my-custom-datatable
        key-field="textCol"
        columns={columns}
        data={tableData}
        wrap-text-max-lines="3">
    </c-my-custom-datatable>
</template>