No description, website, or topics provided.
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.

Kawwa, the Markup Pattern Library

Kawwa is an initiative to promote semantic, standard and accessible HTML code through an online markup library of more than 50 components ( A Kawwa component is an identified web interface element made of:

  • An HTML template, or snippet (it can be either XHTML Strict or HTML5);
  • Related CSS declarations and, eventually,
  • Javascript files and function calls.

A component must be seen as an independent, single block of content, with specific characteristics and behavior, and that may be manipulated apart of the whole.

##Kawwa is not a CSS Framework Although the Kawwa portal offers the possibility to add different graphical themes, the goal of this library is not to propose a CSS framework. We strongly believe that the web design is above all a matter of identity and of content strategy, and that it cannot, in no way, be offered as a framework. Nonetheless, CSS design is a sophisticated part of the front-end development. In this way, the graphical themes available on the Kawwa portal – and consequently the CSS snippets of components - must be taken only as a starting “canvas” for your own web design.

##How can you contribute to this project?

We will be thrilled to have you contributing to our project! You may contribute:

  • By proposing and/or pulling new components;
  • By giving us feed-back on issues or bugs, or by giving us tips to improve existing components;
  • Write Unit or Integration tests for the portal;
  • Improve the quality of the project;
  • Write some Documentation

If you want to create a new component, you have to send a new pull request with this files :

  • dependencies/ : directory containing all external jQuery librairies
  • snippet.js and snippet.hmtl : the HTML and JavaScript codes of the component
  • forewords.html : Global documentation about the component
  • : Metatdata properties (name, type, tags, ...)
  • readmore.[js, css, html] : Extra informationd for the corresponding snippet. You should use HTML tags inside these files.
  • An updated of versionPortal/src/main/webapp/css/k-theme0.css with the CSS definition of your component.

Although, as mentioned before, Kawwa goal is not to spread graphical themes, your designs would be equally welcome. We'll add instructions about how you can do it asap.

##Getting started

The anatomy of Kawwa Components and the logical architecture of the Kawwa Portal are described in the document “Kawwa Reference” (PDF, 134 Kb). Before getting started, please refer to this document.

##Contribution requirements

All proposed components will be tested and validated before added to the portal. As mentioned before, we will only validate standard, semantic and accessible code.

In the case of interactive components, if you’re adding a plugin or a function, be sure also to use accessible, standard Javascript, including effective WAI/ARIA markup. For more information on WAI/ARIA, please refer to “WAI-ARIA 1.0 Authoring Practices” (

##License This project is licensed under the MIT License.