siimple 3.2.0 siimple.xyz
Getting started
An introduction to how to get started with siimple.
Theming
Font and colors that siimple uses
Font
siimple uses Montserrat as the default font family, imported automatically from Google Fonts. If you want to use your own font, you can set that in your body tag. Here is an example:
body {
    font-family: Verdana, Arial, 'sans-serif';
}
All the elements on your page will inherit this font-family and will overwrite the Montserrat font set by default by siimple.
Colors
All colors in siimple are available as a SASS variables and a SASS map in scss/_variables.scss.
primary
success
warning
error
dark
light
You can these colors in your SASS styles using directly the SASS variable. You can also use our function siimple-default-color defined in scss/_functions.scss to import the color from the SASS map:
//Import colors
@import "siimple/scss/_variables.scss";
@import "siimple/scss/_functions.scss";

//Using the color variable
.button {
    background-color: $siimple-default-primary;
}

//Using the function
.button {
    background-color: siimple-default-color("success");
}
Legacy colors
The colors API defined in the latest version of siimple are still supported, but keep in mind that will be removed in a future major relase. Consider upgrading to the new colors API defined in v3.1.0.
navy
green
teal
blue
purple
pink
red
orange
yellow
grey
Found a mistake or want to help improve this documentation? Suggest changes.