T
Thierry Ciot
Guest
Below are some rough graphic (drawn by hand) representing the fields structure in both object view and object edit. It may look a bit complicated but it's really not that bad in reality. There simply are containers in the right place to let you tailor any part of the rendering via CSS. And by the way, there is also a container for the separator between label and fields; so for example, you can add : as a separator if you like. We will update the doc with more in depth description as it looks like it didn't make it last time. Does this help? Thierry. Controlling Width + Separator With simple CSS rules, responsive to various device width, we can tailor how the width of a field is allocated to the labels, separator and value. When editing, the value is further split into how much the actual edit control uses out of the space available for the value. The overall field width is allocated by the section generator based on the number of columns and the responsive rules. Fields Details Here are more details on the structure of simple fields (as opposed to complex fields like calendar control that takes the whole canvas). 1 Line Here is the structure used when fields are rendered on 1 line that is label on left and value on right in LTR and label on right and value on left in RTL. 2 Lines Fields can also be rendered with labels above value. It is very similar to 1 line but we have two rbs-simpleField-box to ensure 2 lines. The diagram below depicts the structure and css classes used. Also the differences with 1 line are highlighted in orange:
Continue reading...
Continue reading...