CODEWITHSUNDEEP
javascriptcsstabulator
Serge Aleynikov
Serge Aleynikov

Reputation: 11

How to color arrow in tabulator group rows?

How can I specify color of the arrows in group rows that collapse/expand a group? Also, what's the proper CSS code to define font color for column group summaries?

You can see an example that I trying to customize here: https://jsfiddle.net/saleyn/a6hyxe24/74/

#equity-table .tabulator-footer {
  background-color:#333;
  color:#BBB;
  font-weight: normal !important;
}

In that snippet, the color of the "grand total" calculations was changed, but how do I change the color of sub-total group summaries?

Upvotes: 1

Views: 712

Answers (1)

BENARD Patrick
BENARD Patrick

Reputation: 30975

Look at this fiddle: https://jsfiddle.net/17dtamrq/

The correct css is : 

.tabulator-row.tabulator-group.tabulator-group-visible .tabulator-arrow {
    border-top-color:red;
}

.tabulator-row.tabulator-group .tabulator-arrow {
    border-left-color: green;
}

// For the last row fore color
.tabulator .tabulator-footer .tabulator-calcs-holder .tabulator-row {
    color: #f00;
}

// For the inner table sub-calcs
.tabulator-table .tabulator-row.tabulator-calcs > div {
    color: red;
}

Upvotes: 1

Related Questions