Changing row colors in crosstab with static structure

[Former Member]

Hello,

I've a crosstab that consists of several key figures (static structure) in the rows and the fiscal period in the columns:

_____________|__January | February | March | .....

   Key Figure 1   |    3

+ Key Figure 2   |    4

= Sub Total        |    7

+ Key Figure  3  |    1

= Overall Total   |    8

Now, I'd like to assign different (background) colors to the key figures resp. totals in the rows in order to make them better readable. Is this possible?

I've already had a look at the custom style-sheet method described in http://scn.sap.com/community/businessobjects-design-studio/blog/2013/07/21/design-studio but that's not the same what I'd like to do...

Does someone have an idea on how to realize this?

Thanks and best regards,

Patrick

[TammyPowlas · Accepted solution]

Sorry for the delay - blame it on "World Cup" fever

Here's some custom CSS I used on the crosstab:

.sapzencrosstab-DataCellTotal

{

background-color: #F0AB00;

}

and it shows this as a background color:

I learned this through SAP's Learning Hub for Design Studio

Is this what you are looking for?

[Former Member · Accepted solution]

Thanks! Exactly what I need for the total rows.

But concerning the key figure rows: Is it also possible to set a color on e.g. key figure 1 (see crosstab above)?

[Former Member · Accepted solution]

Hi Patrick,

using css you can target individual rows with the :nth-child() selector.

For example:

table.sapzencrosstab-RowHeaderArea tr.sapzencrosstab-HeaderRow:nth-child(3) td {background: gold;}

table.sapzencrosstab-RowHeaderArea tr.sapzencrosstab-HeaderRow:nth-child(5) td {background: gold;}

table.sapzencrosstab-DataArea tr:nth-child(3) td {background: MediumSpringGreen;}

table.sapzencrosstab-DataArea tr:nth-child(5) td {background: MediumSpringGreen;}

Result:

Regards,

David

[Former Member · Accepted solution]

Hi David,

Great. That's exactly what I need!

Thanks and best regards,

Patrick

[Former Member · Accepted solution]

I have a question related to your last post.

I have a crosstab layout. I have setup custom CSS for my learning purposes. I am currently using 1.4 in a local install on my PC.

Here is the CSS I am using for the layout.

.sapzencrosstab-DataCellAlternating {

background-color: #CCFFCC !important;

}

.sapzencrosstab-DataCellDefault {

background-color: #EAF2D3;

}

/* This defines how tall the rows will be in the cross tab layout*/

.sapzencrosstab-DataCellContentDiv {

height: 40px;

}

/* This formats the Task Count with a gradient yellow*/

.sapzencrosstab-DataCellTotal {

font-weight: bold;

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr='#E6E600',GradientType=0); background-color: rgb(229, 234, 243); !important;

}

With the above CSS, I can get the Overall Result count to show up in yellow.

My goal is to get the cell that contains the Overall Result text to show up formatted the same way the count is formatted. (Gradient Yellow)

I looked at, and tried your solution, but it did not work for me. Is there a better way to do this?

Thanks,

Lloyd

[TammyPowlas · Accepted solution]

Hi Lloyd - since this thread is now closed, would you please create a new discussion, referencing this one?  Thank you

[Former Member · Accepted solution]

Okay, I hope I referenced it correctly. I created a new question.

Thanks for your help.