Tersus: Style Control of iPhone Applications through CSS

Style Control of iPhone Applications through CSSDate: Apr 25, 2012Tags:CSS,iPhoneControlling the Look and Feel of Tersus ApplicationsThe look of Tersus applications is controlled by a set of HTML, CSS and Javascript files in [studio root]/plugins/tersus.appserver_[version]/DefaultWebapp.The display elements in a Tersus model are using these style classes in two ways:

Some display elements have the html.styleClass property, which contains the name of a CSS style class. You can select a different style class by changing html.styleClass property of an element.

The Javascript implementation of some display elements is using additional style classes, which are not explicitly specified in the element's properties. It means you cannot change the style classes they use (but you can still change the definition of any style class, as explained below).

Adding Your Own StylesCopy the definitions of the style classes you wish to change to the stylesheet.css file in your project's web folder. Any change you make there will override their default definitions.You can also add new style classes and use them in the html.styleClass property of display elements (see example, and also Backgammon on iPhone).The Theme Editor is a tool to help you change the look and feel of applications in a more user friendly way, including a real time preview of the influence on your application of any change you make. This tool is still in development (available in version 1.3.45 or higher).
iPhone Style Classes
iPhone specific style classes are defined in a few files in [studio root]/plugins/tersus.appserver_[version]/DefaultWebapp/styles:

004-styles.iphone.css

005-styles.iphone.non-simulator.css

005-styles.iphone.safari.css

005-styles.iphone.nonsafari.css