Skip to content
This repository has been archived by the owner on Jun 4, 2024. It is now read-only.

option to remove case sensitivity icon #932

Open
cldougl opened this issue Aug 3, 2021 · 1 comment
Open

option to remove case sensitivity icon #932

cldougl opened this issue Aug 3, 2021 · 1 comment

Comments

@cldougl
Copy link
Member

cldougl commented Aug 3, 2021

Screen Shot 2021-08-03 at 1 35 32 PM

It would be nice for dash developers to have the option of including or removing the case icon rather than always displaying the option

@AnnMarieW
Copy link
Contributor

AnnMarieW commented Aug 4, 2021

That's a good idea, and this also came up on the forum recently regarding removing the "eyeball" icon for hideable columns: https://community.plotly.com/t/how-to-remove-the-individual-column-hide-action-buttons-from-a-datatable/50618/2

It would be nice to control this with a prop (maybe filter_options?), but in the meantime it can be done fairly easily with CSS:

        dash_table.DataTable(
            columns=[{"name": i, "id": i, "hideable": True} for i in df.columns],
            data=df.to_dict("records"),            
            sort_action="native",
            filter_action="native",
            filter_options={"case": "insensitive"},
            css=[
                {   # hides "hideable" icon
                    "selector": ".column-header--hide",
                    "rule": "display: none",
                },
                {   # hides "case-sensitive" icon
                    "selector": ".dash-filter--case",
                    "rule": "display: none",
                },
            ],
        )

Or include in the .css file in the assets folder

.column-header--hide {
  display: none;
}

.dash-filter--case {
  display: none;
}

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants