Difference between revisions of "Updating to design version 5"
Jump to navigation
Jump to search
old>Admin |
old>Admin |
||
| Line 44: | Line 44: | ||
=== Sample wrapper === | === Sample wrapper === | ||
<html> | |||
<head> | |||
<link rel="icon" type="image/png" href="https://www.tempusserva.dk/favicon.ico" /> | |||
<meta name="application-name" content="Tempus Serva" /> | |||
<meta name='viewport' content='initial-scale=1.0, maximum-scale=1.0'> | |||
<meta name="mobile-web-app-capable" content="yes"> | |||
<meta name="apple-mobile-web-app-capable" content="yes"> | |||
</head> | |||
<body> | |||
</body> | |||
</html> | |||
Revision as of 14:08, 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;
--themePrimaryLight: #cbe4ff;
--themePrimaryDark: #312783;
--themePrimarySpecial: #648bb7;
--themeSecondary:#8c2db3;
--themeTeritary: #8e9aa7;
--themeDark: #333333;
--themeGreyDark: #5a626b;
--themeGrey: #ced4da;
--themeLightGrey: #f8f9fc;
--themeLight: #ffffff;
}
.logo {
background: url(https://alpha.tempusserva.dk/TempusServa/media/korsbaek-white.13.svg) no-repeat !important;
background-position-x: 0px;
background-position-y: 0px;
opacity:0.6;
zoom: 0.8;
margin-top: 8px;
margin-left: 70px;
}
Sample wrapper
<html> <head> <link rel="icon" type="image/png" href="https://www.tempusserva.dk/favicon.ico" /> <meta name="application-name" content="Tempus Serva" /> <meta name='viewport' content='initial-scale=1.0, maximum-scale=1.0'> <meta name="mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes"> </head> <body>
</body> </html>