| Version 9 (modified by , 12 years ago) ( diff ) |
|---|
Themes
Table of Contents
Sahana Eden supports custom Themes as part of it's overall Templates system.
This allows customisation of:
- Layout
- CSS
NOTE: This is still a work-in-progress: not everything here is ready yet & the details may change!
Default Theme
By default these files are used:
/private/templates/default/views/layout.html/private/templates/default/views/load.html/static/img
in non-Debug mode:
/static/themes/default/eden.min.css
in Debug mode:
/private/templates/default/css.cfg/static/themes/default/layout.css/static/themes/default/reset.css/static/themes/default/layout.css/static/themes/default/shortcut.css/static/themes/default/widgets.css/static/themes/default/style.css/static/themes/default/homepage.css
etc
User Theme
A new Theme should match the name of the controlling Template.
To create a new theme:
- Specify the Theme name in your template's
/private/templates/<templatename>/config.py:settings.base.theme = "themename"
- Create a new folder to hold the theme elements:
/static/themes/<themename>which will usually contain these files:layout.css,style.css(it is normally assumed that/static/themes/default/css/widgets.cssis also used)/static/themes/<themename>/img
- If not already using a template create one:
/private/templates/<templatename> - Create these files in your templates folder:
/private/templates/<templatename>/__init__.py- this can be empty but must be present./private/templates/<templatename>/css.cfg- list of CSS files to use in Debug mode, or be compressed together for the normal non-debug mode by the Build script (static/scripts/tools/build.sahana.py) into:/static/themes/<themename>/eden.min.css
/private/templates/<templatename>/views/layout.html- overall layout of the HTML.
Note that all CSS files should be able to find their images both in debug mode & when compressed into eden.min.css - this is normally done by having the files at the same depth in the tree.
NB Production sites who wish to compile their code either need to hardcode the theme name in their views/layout.html or upgrade to Web2Py version: 2.00.0 (2012-06-17 23:36:32), or newer.
Ext Theme
Use CodeBeautifier to merge the ext-all-notheme.css with xtheme-gray.css (merges properties on the same selectors which most minifiers don't):
static/scripts/ext/resources/css/ext-theme.min.css
Can also use this to merge a custom theme, e.g. built with http://extbuilder.dynalias.com
