Chapter 6. Fit and Finish
In the preceding chapters we laid down the foundations you need to create Enyo apps. In this chapter, weâll explore some of the pieces necessary to make those apps more memorable. Weâll cover how to style your apps, how to tune them to perform well on less powerful platforms, how to prepare them for translation to other languages, and how to troubleshoot bugs that inevitably arise. As always, weâll explore these concepts through interactive samples.
Styling
Enyo provides some very nice looking controls with the Onyx and Moonstone libraries. However, an app can set itself apart from others by having a unique user interface. Fortunately, itâs very easy to change the look of controls. Weâll explore several ways to accomplish that.
Styles and Classes
All Enyo controls have two properties to aid in styling: style
and classes
. These two properties correspond to an HTML elementâs style
and class
attributes. The style
property can be used to apply a specific style to a single control. To work with the classes
property, you must add CSS classes to a style sheet. In general, it is better to use classes
in an app for two reasons: first, components are more reusable if styling is not embedded within them; second, using CSS classes allows you to keep the styling in a single, centralized location.
Enyo provides applyStyle()
to update an individual style and addStyles()
to add styles onto the existing styles of a control. We used the applyStyle()
function in ...
Get Enyo: Up and Running, 2nd Edition now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.