Adding a CSS definition

Supporting data : Supporting Data : CSS definitions : Adding BaseOrderCSS : Adding a CSS definition

Procedure

1. Go to CSS definitions.

2. Select BaseOrderCSS in the CSS definitions list.

3. On the action panel, click Add.

4. Fill the data section fields.

See the descriptions of these fields in the following table.

Field	Description
System name	Specify a name to the definition.
CSS	Enter a CSS definition. By entering a user defined CSS color code here, you can assign a unique color to the selected reservation status. See Examples in this section for customizing CSS definitions.
Parent level	Select the parent level of the CSS definition.

5. Click Save.

6. Do Refresh all.
You have now added a definition.

For more information on reservations, see Reservations.

Examples:

Example I: If no CSS styling is applied, the reservations under the status UsrRequested are displayed as follows:

Example II: If you want to color the status UsrRequested, the following CSS definition should be added in the BaseOrderCSS.

#fillPaintActivity[userStatePnName="UsrRequested"]
{ class : "ilog.views.java2d.IlvLinearGradientPaint(start,end,
stops,colors,adapting)" ;
start : "0.0,0.0" ;
end : "0.0,1.0" ;
stops[0] : "0.0" ;
stops[1] : "0.5" ;
stops[2] : "1.0" ;
colors[0] : "255,255,255" ;
colors[1] : "255,230,0" ;
colors[2] : "255,200,0" ;
adapting : "true" ;
}

Example III: If you have two user-defined business objects, you can color the statuses as follows:

#fillPaintActivity[userStatePnName="UsrRequested"]
{ class : "ilog.views.java2d.IlvLinearGradientPaint(start,end,
stops,colors,adapting)" ;
start : "0.0,0.0" ;
end : "0.0,1.0" ;
stops[0] : "0.0" ;
stops[1] : "0.5" ;
stops[2] : "1.0" ;
colors[0] : "255,255,255" ;
colors[1] : "255,215,0" ;
colors[2] : "255,215,0" ;
adapting : "true" ;
}

#fillPaintActivity[userStatePnName="UsrOption"]
{ class : "ilog.views.java2d.IlvLinearGradientPaint(start,end,
stops,colors,adapting)" ;
start : "0.0,0.0" ;
end : "0.0,1.0" ;
stops[0] : "0.0" ;
stops[1] : "0.5" ;
stops[2] : "1.0" ;
colors[0] : "255,255,255" ;
colors[1] : "205,95,95" ;
colors[2] : "205,95,95" ;
adapting : "true" ;
}

Example IV: If you want to display a customized tool tip, the attributes can be added or removed from the activity element in the CSS definition of BaseOrderCSS as follows:

activity {
class : "ilog.views.gantt.graphic.renderer.composite.
IlvActivityCompositeGraphicRenderer" ;
graphic : "@+compositeActivity" ;
toolTipText : '@|"<html>"+"displayValue=" + @displayValue + " "
+"boTypePnName=" + @boTypePnName + " " +"orderNumber="
+@orderNumber + " " +"orderDescription=" + @orderDescription
+ " "+"userStatePnName="+ @userStatePnName +
" " +"isReservation="+ @isReservation +"</html>"';
}

Example V: If you do not want to display an icon for the reservations, the Subobject#compositeActivity element in the CSS definition of BaseOrderCSS should be updated as follows:

Subobject#compositeActivity {
_EDITABLE : "true" ;
class : "ilog.views.graphic.composite.IlvCompositeGraphic" ;
children[0] : "@+activityRectangle" ;
children[1] : "" ;
children[2] : "@+Text" ;
constraints[2] : "@+AttachmentText" ;
children[3] : "" ;
resizingPolicy : "ResizingBase";
}

You can also hide the icon for a particular business object. To achieve this, you must include the appropriate attributes with the element.
For example, Subobject#compositeActivity[userStatePnName=
"UsrReservationMeetingRoomConfirmed"][boTypePnName="UsrReservationMeetingRoom"]