Styling aggregation in a DataGrid

Hello,

how can I change the style of the aggregation row in a datagrid? On the one hand I want to change the colour of the row and on the other hand I want to change the alignment of a column from left to right.

Many thanks and greetings
Andreas

Hello!

Firstly, you need to extend application theme, see 3.5.9.2. Extending an Existing Theme.

You can extend theme using Studio:

There is a SCSS variable for background color of aggregation row in DataGrid $cuba-datagrid-aggregation-background-color, for instance:

$cuba-datagrid-aggregation-background-color: #9e68d9;

Place it to ***-ext-default.scss file.

To align text in the aggregation row you can define the following selector in the ***-ext.scss file.

/* Define your theme modifications inside next mixin */
@mixin com_company_myapp-hover-ext {

  .c-aggregation-row .v-grid-column-header-content {
    text-align: right;
  }
}
1 Like

Hello @Pinyazhin ,

thank you very much. Works like a charm.

Greetings
Andreas