Overview

Interfacing Carefully

UI definitions in Semantic are given the class name ui. This is to help tell the difference between ui elements and parts of the definition of an element. This means any element with the class name UI has a corresponding UI definition.

For example a menu may have menu items inside of it. These items are contained as part of the menu definition but do not receive the class name ui because they are part of a UI menu collection.

Changing an Element

Class names in Semantic always use single english words. If a class name is an adjective it is either a type of element or variation of an element. CSS definitions always define adjectives in the context of a noun. In this way class names cannot pollute the namespace.

Combining elements

All UI definitions in semantic are stand-alone, and do not require other components to function. However, components can choose to have optional couplings with other components.

For example you might want to include a badge inside a menu. A label inside of a menu will automatically function as a badge.

Semantic APIs

Modules define a public API using verbs and simple phrases. When methods are invoked internally those phrases are matched to internal methods automatically.

Opening a new tab with a behavior

Modules have simple behaviors for triggering common actions

Opening a new tab with multiple behaviors

Any internal behavior is accessible as well

Turning on HTML5 State

Modules can be re-initialized at any time with different settings