LudoJS comes with several CSS skins. The css file css/ludojs-all.css contains the css for all skins. Include it with a link tag like this:
<link rel="stylesheet" href="ludojs/css/ludojs-all.css">This css file is minimized. ludojs-all-readable.css can also be used. It's the same css, but not minimized.
To choose a theme, assign your <body> tag to the name of the skin of your choice:
Example:
<body class="ludo-blue">Below, you will see the calendar view in all the skins
<body class="ludo-twilight">
<body class="ludo-blue">
<body class="ludo-light-gray">
<body class="ludo-gray">
To create your own skin, use ludojs/css-source/twilight.css as a template. As you can see in that file, all the css rules starts with .ludo-twilight. That's the class assigned to the body tag
.ludo-twilight .ludo-framed-view-titlebar-title{
text-align:center;
width:100%;
}Instead of .ludo-twilight, use a name of your choice(Search->replace->'ludo-twilight'->'name of your choice'), and remember to add that class to your body tag.
.my-theme .ludo-framed-view-titlebar-title{
text-align:center;
width:100%;
}
...
...
<body class="my-theme">
