Documentation

Addon's CSS classes

Addon's default CSS class name

Each addon gets a unique class name: `MyPuzzle
This is the same ID used in a function 'MyPuzzle_create()'.

It means that it is possible to provide default styles for an addon by adding a class definition to a CSS section in this addon.

Classes added in the presentation's editor

While using an addon in the presentation's editor, it is possible to add another custom class name to the addon. The definition of this custom class will be put in the Presentation CSS file and most of the time it will overwrite the same default declaration.

Adding classes to the sub-elements

If you need to add classes to the sub-elements, then it is good practice to try to make them unique or use selectors with a base class name. All selectors should refer to the first element inside the element with the "Addon_Name" class. This element should have the class like "addonname-wrapper", e.g:

.addonname-wrapper .myInnerClass{
}

Restrictions

When defining CSS classes for your addon, please plan ahead on which of them to be included in the addon's documentation. Exposed classes can be accessed in Advanced Connector scripts by lesson creators and they explain the DOM structure. CSS classes that are not mentioned in the addon's documentation should not be accessed in AC scripts. This rule is especially important if any further modifications or bug fixes are to be made to the addon's source code in the future - in which case the exposed CSS classes (and consequently the DOM structure) should not be modified.