This version is deprecated. See the latest version.
Include the Global Assets In Your Application
X-UA-Compatible meta tag to get it all working.
head block should look like this:
As you can see in the example, your own stylesheet should be added after the global stylesheet. Your own stylesheet contains everything your application needs that is not contained in the global assets. Application specific files are not deployed to the asset server, those are served directly from your applications web server.
viewport meta tag must be included to get a responsive application. You must not set the
maximum-scale value in the
viewport meta tag; it is not our business to decide if the user wants to zoom in or not on a narrow device.
If you have an approved exception from firstname.lastname@example.org to not comply with the full WAG, you must at a minimum enable the intranet masthead in your application. To do so, change
masthead_standalone_without_jquery.js and if your application isn’t responsive, change the stylesheet to
Optimize Your Own Assets
Serve your assets with gzip/deflate compression from the web server with http caching headers optimized.
If you’re using AMD loading of assets, all individual files must be minified and you need to optimize the balance between the number of HTTP request and the size of the files.
The masthead, seen at the top of this page, is automatically included on every intranet page when you use the global assets. The
margin-top on the
body of your application must leave room for the masthead that has a fixed position on wider viewports and absolute on narrow ones.
The masthead is responsive and you must set the
viewport meta tag in your application for it to work (see above).
If one of the menu items in the masthead should be indicated as active in your application, add the corresponding class to your body tag. Available classes are:
- Mina sida:
- Min förvaltning:
- Mitt arbetsfält:
- Vår kommun:
- Min anställning:
Put the human name of your application at top of the page like we’ve done here by adding an app-title:
Components and Widgets in the Global Assets
Since the global assets are used by many applications and since they have a long life-cycle, we are cautious when it comes to include UI components and frameworks in the bundle. If you have need for components not included, add them to your own code and be sure to maintain and update them.
The global assets includes a full version of the icon web font Font Awesome. Check the vendor directory in the assets source code to see which version is included.
As noted in several sections, you should use relative units in your CSS code. Use
%. The exceptions are thin borders where you can use
1px and font size in forms (see the section on Typography).
Your Applications Domain
All web applications must have a subdomain under *.malmo.se. This is essential for the masthead to work.
Google Analytics tracking is included in the global assets and statistics are collected to the City of Malmö’s account. This is important so we can analyze traffic and user behavior across all off our services. You must not initiate other Google Analytics accounts in your application.
If you need to do custom event tracking in your application, use your applications technical name as a prefix for the event names so we don’t get Google Analytics events with colliding names.
To prevent data from your development and test environments to be collected in the production account, add a
test class to the
body tag. The data will then be collected to our test account.
Global Assets Internals
The source code for the global assets are available on Github. The deployed version on the asset server is in the 3.0-stable branch and is the same as the most recent production tag. Pre-releases are deployed to https://assets.malmo.se/internal/3.0-staging/.