Only one
Theme for Web can be assigned to a Web object. However, if a
Web Panel object includes -and each one of these has a different Theme associated to it- the resulting page includes all the style sheets (i.e.: the ones of each Web Component).
It is important to highlight the fact that in this case classes are not differentiated by Theme.
If a Web Panel includes the "WA" and "WB" Components. If WA is associated to the ThA Theme, and WB to the ThB Theme and ThA and ThB have a class of the same name defined which is used in both Web Components, but with different settings in each case, in runtime, there will be no difference among the classes.
If different Themes are used, and the classes are actually different in their characteristics, the names of the classes should be different.
Precedence in which the CSS associated with the page are considered.
The CSS corresponding to the Themes are included in the HTML header in an order determined according to the distribution of the Web Components in the page.
The order is from left to right and from top to bottom.
For example, if the scheme is the following:
Webcomp1 -associated with thm01 Webcomp2 -associated with thm02
Webcomp3 -associated with thm03 Webcomp4 -associated with thm04
And the parent web panel (container) is associated to the "default" theme, the header will be the following:
<link rel="stylesheet" type="text/css" href="styles.css"/>
<link rel="stylesheet" type="text/css" href="Default.css"/>
<link rel="stylesheet" type="text/css" href="Thm01.css"/>
<link rel="stylesheet" type="text/css" href="Thm02.css"/>
<link rel="stylesheet" type="text/css" href="Thm03.css"/>
<link rel="stylesheet" type="text/css" href="Thm04.css"/>
To determine the value of the property of a class,
If a class has a common name in all the CSS, the value of one of its properties is determined using the following precedence:
1. It considers from the last included CSS to the first.
2. If the property is as default in the last one, it considers the value configured in the previous one, and so on.
In the example, if the "form" class is associated with the form of all the Web Components, and
- The textcolor property is as default in all the Thm04.css, Thm03.css themes. In Thm02.css it is configured as rgb (128, 255, 128).
- The backcolor property is as default in the Thm04.css, Thm03.css, and Thm02.css themes. In Thm01.css it is configured as rgb (255,128,128).
In this case, the backcolor of the page is taken from the Thm01css, and the textcolor from Thm02css. (Even if another text color were given in thm01.css and default.css, and another back color were given in default.css.)
Note: 'Property as Default' means that the property does not have a value.