Bootstrap CSS |
Lite Client |
 |
|
Bootstrap CSS |
Lite Client |
|
The Bootstrap CSS is a free CSS library that provides a modern Responsive view of HTML. The Responsive aspect means that the components on the screen are moved and resized so that they are readable in browsers of different sizes (e.g. desktop, tablet, phone). This means that components can not be placed in a precise position on the screen (the traditional PROIV technique) but instead are placed in rows with percentage widths.
The Lite Client interprets the PROIV row and column properties to work out how to place PROIV components in a Responsive page. This may mean that existing PROIV sessions look somewhat different in Lite Client from other PROIV clients.
When Lite Client places PROIV components in a Responsive page it makes the assumption that the page has 80 columns per line. If a PROIV component has a column position greater than 80 then it will drop onto the next line which may make the page look odd.
The number of columns is defined in the bootstrap.css file and by default is set to 12. You can create an 80 column version by customising the bootstrap file on the bootstrap web site. The property to change is called ‘grid-columns’ and should be set to 80. You can customise many other bootstrap properties on the web site.
The Lite Client ships with Bootstrap 4 CSS file, with an 80 column version.
The Lite Client ships with a Bootstrap 4 CSS file (bootstrap.4.1.3-80col.css) which should be included in the page if not supplying an alternative 80 column bootstrap file. Bootstrap 4 does not include the glyphicons CSS so an additional CSS file (font-awesome.min.css) must be included to support icons. The fonts for the icons used by Lite Client also need to be included (fonts/fontawesome-webfont.woff2). The PROIVPropertyMap_bootstrap4.js mapping file should be used.
Topic ID: 870025