As part of e(fx)clipse we are implementing a custom CSS-Editor based upon Xtext.

We have a grammer of CSS-Specification so that we can parse CSS-Files, the interesting part though e.g. which properties are available, what values they can have is at least for JavaFX not speced in a machine useable format but as plain HTML.

There are rules in this file but they are not useable for tools so we defined our own small language to store the information in a structured format so that we can make use of them in the CSS-Editor to:

• Show documentation
• Provide attribute proposals
• Provide value proposals
• Validate attribute values

Today we’ve reached an important first milestone by showing the documentation of attributes and elements.

The language definition looks like this:

and results in the following documentation tooltips in our CSS-Xtext-Editor:

If you’d like to follow the implementation or want to take a look at the CSS-Definition-Grammer we’ve developed you can do this by cloning our git-repo and use the cssext-branch