xstyle is a framework for extending CSS, which can be used to improve the quality, maintainability, and performance of your stylesheets. While xstyle can be used as a full framework for building applications with data bindings and UI generation, in this post we will focus on making progressive improvements to stylesheets within the traditional role played by CSS.
The new dgrid is a powerful, but lightweight grid component. It is specifically built to be easily styled with CSS, rather than relying on programmatic properties and changes. The dgrid makes numerous element classes available to reference from CSS and avoids inline styles as much as possible to ensure ease of CSS customization.
Stylesheet Loading Order
Before diving into CSS styling of the dgrid, it is highly recommended that you start your dgrid styling stylesheet with an import (or a link) of dgrid.css (and any other dgrid stylesheets you will use). This will ensure that dgrid.css is loaded before your rules so that your rules can override those in dgrid.css without requiring higher specificity. The dgrid component will load dgrid.css if it hasn’t already been loaded by you, but this will usually cause dgrid.css to load after other stylesheets, and therefore take precedence over other stylesheets.
Dojo is a very flexible toolkit; it doesn’t dictate how you organize your code or create your widgets. It simply provides tools, and it’s up to you to decide how you want to fit them together. Developing with AIR puts you squarely in the browser-based application model, but aside from that it mostly stays out of your way as well. As part of our series on the Queued development process, I’m going to take a look at the decisions we made and the philosophies we adopted for the project. It should provide some insight into our process.