Difference between revisions of "Updating to design version 5"
Jump to navigation
Jump to search
old>Admin |
old>Admin |
||
Line 20: | Line 20: | ||
=== Sample stylesheet === | === Sample stylesheet === | ||
:root { | |||
--themePrimary: #007bff; /* vivid blue */ | |||
--themePrimaryLight: #cbe4ff; /* light blue */ | |||
--themePrimaryDark: #312783; /* dark blue*/ | |||
--themePrimarySpecial: #648bb7; /* gray blue */ | |||
--themeSecondary:#8c2db3; /* purple */ | |||
--themeTeritary: #8e9aa7; /* blue dark grey */ | |||
--themeDark: #333333; | |||
--themeGreyDark: #5a626b; | |||
--themeGrey: #ced4da; | |||
--themeLightGrey: #f8f9fc; | |||
--themeLight: #ffffff; | |||
} | |||
.logo { | |||
background: url(https://www.kromannreumert.com/Static/resources/images/global/logo.png) no-repeat !important; | |||
background-position-x: 0px; | |||
background-position-y: 0px; | |||
opacity:0.6; | |||
zoom: 0.8; | |||
margin-top: 10px; | |||
margin-left: 75px; | |||
height: 55px; | |||
width: 300px; | |||
} | |||
=== Sample wrapper === | === Sample wrapper === |
Revision as of 13:29, 4 February 2020
Step by step guide
Thefollowing steps are rquired to update your design
- Activate version 5 layout + bootstrap 4
- Set configuration > layoutNewestVersion = true
- Update stylesheet
- Copy new stylesheet (see below)
- Change color codes in new sheet
- Set configuration > defaultStylesheet = <ID>
- Update wrapper
- Copy new wrapper (see below)
- Set configuration > defaultWrapper = <ID>
Additionally you might want to update how Dashboards work too
- Set configuration > dashboardMain = true
- Change widget layouts (for each)
- Set width to 1/12 parts (6 = half, 12 = full)
Sample stylesheet
:root { --themePrimary: #007bff; /* vivid blue */ --themePrimaryLight: #cbe4ff; /* light blue */ --themePrimaryDark: #312783; /* dark blue*/ --themePrimarySpecial: #648bb7; /* gray blue */ --themeSecondary:#8c2db3; /* purple */ --themeTeritary: #8e9aa7; /* blue dark grey */ --themeDark: #333333; --themeGreyDark: #5a626b; --themeGrey: #ced4da; --themeLightGrey: #f8f9fc; --themeLight: #ffffff; }
.logo { background: url(https://www.kromannreumert.com/Static/resources/images/global/logo.png) no-repeat !important; background-position-x: 0px; background-position-y: 0px; opacity:0.6; zoom: 0.8; margin-top: 10px; margin-left: 75px; height: 55px; width: 300px; }