# Themeing

Out of the box, the data-table is not styled. This gives you maximum flexibility.

There is a separate material theme distributed with data-table. In order to use it, you need to include that in your application `themes/material.css` and add the CSS class `material` to your data-table.

This is a simple way to apply the style of the demo.

```scss
@use '~@swimlane/ngx-datatable/index.css';
@use '~@swimlane/ngx-datatable/themes/material.scss';
@use '~@swimlane/ngx-datatable/assets/icons.css';
```

You can just add above to your `scss` file and then specify the class of your ngx-datatable to `<ngx-datatable class="material">`

## CSS Classes

* `ngx-datatable`: Master Table class
  * `fixed-header`: The header is fixed on the table
* `datatable-header`: Header row class
  * `datatable-header-cell`: Header cell class
    * `resizeable`: Cell resizeable class
    * `sortable`: Cell drag/drop sortable class
    * `longpress`: Cell long-press activated
    * `dragging`: Cell dragging activated
    * `sort-active`: Sort active on column
    * `sort-asc`: Sort active on column with ascending applied
    * `sort-desc`: Sort active on column with descending applied
  * `datatable-header-cell-label`: Header cell text label
    * `draggable`: Header cell draggable class
* `datatable-body-row`: Body row class
  * `datatable-row-even`: Odd row class
  * `datatable-row-odd`: Even row class
    * `datatable-body-cell`: Body cell class
      * `sort-active`: Sort active on column
      * `sort-asc`: Sort active on column with ascending applied
      * `sort-desc`: Sort active on column with descending applied


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://swimlane.gitbook.io/ngx-datatable/readme/themes.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
