Difference between revisions of "SUNScholar/XMLUI Theme/M2/Customisation"
m (→XXXX) |
|||
| Line 27: | Line 27: | ||
===Tips=== | ===Tips=== | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
====Live Webapp Quick Changes==== | ====Live Webapp Quick Changes==== | ||
This saves you from having to recompile the whole DSpace webapp just to see what effect a few SASS CSS changes will make. | This saves you from having to recompile the whole DSpace webapp just to see what effect a few SASS CSS changes will make. | ||
Revision as of 15:09, 21 June 2015
Back to Mirage 2 Theme
Contents
Introduction
These wiki pages will assist you in customising the Mirage 2 theme that was introduced with DSpace 5.X.
Please read the requirements first, to gain an understanding of the "bootstrap" framework, then proceed with the rest of the customisation.
This customisation is very basic and is intended for those who have basic web 2.0 design skills.
It is assumed that the Mirage 2 theme was installed according to: http://wiki.lib.sun.ac.za/index.php/SUNScholar/XMLUI_Theme/M2.
It is also assumed that you installed DSpace according to: http://wiki.lib.sun.ac.za/index.php/SUNScholar/DSpace.
After you have completed your customisation, you will have to rebuild DSpace.
Procedures
- Requirements
- Introduction Text
- Institutional Branding
- Document Structure
- Banner Logo
- Palette (colours)
- Typography (fonts)
- Footer Design
- Multiple Themes
- Extra Customisation (Optional)
Tips
Live Webapp Quick Changes
This saves you from having to recompile the whole DSpace webapp just to see what effect a few SASS CSS changes will make.
Type the following:
cd $HOME/webapp/xmlui/themes/Mirage2
compass watch
Now using another login session, you can modify the SASS CSS stylesheets in the styles folders and the main.css file will compile instantly.
If you make an error, then compass will crash, so you must watch the terminal where compass is running to check for errors and if needed restart compass.
Just remember to make the same changes to the source SASS CSS files, so that your changes will be applied after the next DSpace rebuild:
To synchronise the live webapp styles folder with the source folder, type the following:
rsync -av $HOME/webapps/xmlui/themes/Mirage2/styles/ $HOME/source/dspace-xmlui-mirage2/src/main/webapp/styles/
To synchronise the live webapp stylesheet folder with the source folder, type the following:
rsync -av $HOME/webapps/xmlui/themes/Mirage2/xsl/ $HOME/source/dspace-xmlui-mirage2/src/main/webapp/xsl/
Help Links
- http://wiki.duraspace.org/display/DSDOC5x/Mirage+2+Configuration+and+Customization
- Read about Mirage 2 theme customisation on github.
- Use the custom Maties theme as a bootstrap template.
- http://gianthatworks.com/entry/bootstrap-for-designers
- http://mdo.github.io/code-guide
- https://github.com/twbs/bootstrap-sass/blob/master/assets/stylesheets/bootstrap/_variables.scss
- https://github.com/twbs/bootstrap/blob/master/less/variables.less