For a quick look & feel customization, please see also Deployment Information Type. Available since midPoint 3.5.1.
Current MidPoint theme is based on AdminLTE template. AdminLTE uses:
- Bootstrap 3
- jQuery 2.11
- other plugins
We're also using:
- Ace editor
- select and multiselect combo boxes for bootstrap
Quick customization tips
Template contains 12 predefined skins:
To change skin you have to modify
PageTemplate.html which you can find in module
admin-gui/src/main/java/com/evolveum/midpoint/web/page/PageTemplate.html. You can also change it in
war if you prefer to customize GA release.
Changing template header and logo
To change template header color and logo you have to edit file midpoint-theme.less which is located in module in
admin-gui/src/main/webapp/less/midpoint-theme.less. You can also change it in war if you prefer to customize GA release.
Stylesheets without overlay
This feature is available from version 3.7
It is possible to add file named
midpoint.home folder. This file will be used during less compilation (during runtime) and styles will be appended to the end of
midpoint-theme.css so it can be used to override existing CSS styles without need to build maven overlay project.
Stylesheet files description
All style sheets are compiled from LESS files located in
admin-gui/src/main/webapp/less/... based on
wro4j.xml definitions. Most interesting files for review/change when updating styles in MidPoint are:
Best way to change them is using maven overlay project.
admin-gui/src/main/webapp/js/... . Most of the MidPoint specific code is located in