Extension

Contribute to Rotala extension library to enhence the framework.

Kick-start#

A Rotala extension is quite straightforward. Before start, you'll need to refer to docs/build to learn more about compiling Rotala style sets.

Make sure to create an pleasing README file under the project. Follow the npm docs to learn about creating/publishing a package

# initialize
npm init your_project_folder

# publish
npm publish

# Here is an example of the project folder structure.
dist/
docs/
    index.html
style/
    components/
        button.pcss
        avatar.pcss
package.json
.browserslistrc
...

naming#

How to name your extension is all up to you. However, it's recommended to name together with the utility of your extension to improve its explicitness. Here are some preferrable naming conventions:

• rotala-theme-* -- used for a customized theme by extending the Rotala core style sets.
  • Example: rotala-theme-default-light

• rotala-extension-* -- used for a any general type of extension. It could also be an extra style sets that Rotala doesn't have yet.
  • Example: rotala-extension-css-icon

keywords#

Make sure that you included the following keywords in your extension's package.json file.

• rotala
• rotala-extension
• rotala-theme (include this keyword if your extension is a theme)

// package.json
{
  "name": "rotala-theme-superb",
  "description": "a superb rotala theme",
  "keywords": [
    "rotala",
    "rotala-extension",
    "rotala-theme"
  ],
  ...
}