Sample Code

Some code samples

CSS sample code

Custom document styles

Here are some styles that could be applied to particular content in a document (in this example, a <block label="xyz">)

/* import standard document styles */
@import url(../../../../weborganic/document/css/psml-content.css);

/* Specific to type and section id 'xyz' */
.psml-content div.label-xyz {
  font-style: italic;
  color:      orange;
  text-align: center;
  border-top: 2px dotted orange;
}

Custom styles for a UI component

A stub to add style to a UI component. By convention, the content of each UI component (page, block, etc.) is wrapped in a div which ID is prefix by 'ps-content-' followed by the ID of the component. This can be used to filter the rules that apply to this component only.

/**
 * Custom styles for component ID 'XXX'
 */
#ps-content-XXX {
}

#ps-content-XXX p {
}

Created on , last edited on