Siebel Open UI: Alternating Row Colours
With a huge hat tip to fellow Siebelite Duncan Ford, here is a quick solution to show rows in list applets with alternating colours. Like this:
Duncan has provided the following CSS rules which, when added to a custom style sheet, do the trick. Totally without any JavaScript coding.
.ui-jqgrid .ui-widget-content:nth-child(odd) {
background: #e4bf66;
}
.ui-jqgrid .ui-widget-content:nth-child(even) {
background: #f9e6b7;
}
tr.ui-state-highlight {
background:rgba(0, 0, 0, 0.2) !important;
}
.ui-jqgrid .ui-state-highlight, .ui-jqgrid .ui-widget-content .ui-state-highlight, .ui-jqgrid .ui-widget-header .ui-state-highlight {
background:initial;
}
As you can see, CSS can distinguish odd and even children of a selection. I have seen quite a lot of jQuery code which accomplishes the same (and of course allows for a more dynamic colouring). But you can't deny the purity and simplicity of CSS.
Many thanks to Duncan for sharing this.
have a nice day
@lex
Duncan has provided the following CSS rules which, when added to a custom style sheet, do the trick. Totally without any JavaScript coding.
.ui-jqgrid .ui-widget-content:nth-child(odd) {
background: #e4bf66;
}
.ui-jqgrid .ui-widget-content:nth-child(even) {
background: #f9e6b7;
}
tr.ui-state-highlight {
background:rgba(0, 0, 0, 0.2) !important;
}
.ui-jqgrid .ui-state-highlight, .ui-jqgrid .ui-widget-content .ui-state-highlight, .ui-jqgrid .ui-widget-header .ui-state-highlight {
background:initial;
}
As you can see, CSS can distinguish odd and even children of a selection. I have seen quite a lot of jQuery code which accomplishes the same (and of course allows for a more dynamic colouring). But you can't deny the purity and simplicity of CSS.
Many thanks to Duncan for sharing this.
have a nice day
@lex
תגובות
הוסף רשומת תגובה