Internet Explorer is not supported by Design Library

The last version of Internet Explorer, version 11, was released on October 17, 2013. This is a very long time ago when taking into account the rapid development of web technologies. These days it is often difficult and time consuming to get modern technologies to work well in this old browser. More and more frameworks are dropping support, and even Microsoft themselves has announced that they will fully drop support for IE in their own services in 2021.

Consequently, we have decided to not include support for IE in the Design Library website.

Luckily, there are modern options in active development. Please use Firefox, Edge or Chrome instead.

Components for Business Arena

Components

Channel settings

Short description

Channel settings is where the user finds personal user settings that will effect the whole channel. The settings are presented on a slide-out and is owned by the shell teams.

When and how to use it

Channel settings is for MFE-specific settings that will effect the MFE only, not the entire channel. The settings are connected to the user, not to a company. 

Users enters the component either from a main entry way via the top bar, or from a specific context linking the user to a specific setting within the component. It is placed on a slide out component

Behaviour

On the first level, all settings are displayed together with the first active setting below it (for example, the setting “Language and formats” shows the first active setting within that, which is "Language"). The user can toggle through different settings. The settings are saved when the user clicks save.

  • A success toast is displayed confirming that the users new settings are saved
  • An error toast is displayed if there is a problem saving the settings
  • A Warning toast is displayed if the user changes settings and presses cancel or exits the slide out without pressing save.
What goes in this component?
  • Settings that effect the whole channel and are connected to the user logged in
  • Settings that are persistent when logging out/in and changing company
  • Settings connected to the shell
  • If an MFE setting should live in the channel settings component, contact the shell team (BA, IBP or Nexus)
Channel settings, desktop

Channel settings, desktop

Channel settings, mobile

Channel settings, mobile

 

Company selector

Short description

A dropdown with a list displaying all the companies that a logged in person has access to, that enables quick change of company context.

When and how to use it

The user opens the company selector dropdown by clicking the logged in company name displayed in the top bar (header). The user can choose which company to work with from the list in the company selector dropdown. If the user clicks a company in the list, this company is “logged in” and is displayed in the top bar.

Behaviour
  • The user can scroll through all companies in the list
  • Do set users' permissions for the selected company automatically
  • User can filter the list of companies by company name or organisational number
  • Companies that match the users input will be displayed in the same list as all companies otherwise are displayed in
  • The bar that shows how many companies are in the list shows how many companies that match users input/search (ex “number of companies 2 of 12)
Future plans
  • The possibility for the user to set which company should be default when logging in
  • Add similar features for this as the ones in IBF today
  • Default company can be set to: Lastly logged in, most frequently logged in, specifically chosen company
  • Display indicator in the list of which companies have important notifications
Company selector

Company selector

 

Profile dropdown

Short description

A dropdown component where the user finds functionality and features connected to its user profile. It is a place where the user can see all options and features connected to its user so that it is easy to access.

When and how to use it

Users can enter the component from the user icon in the top bar, making it accessible from the entire channel. By clicking on the profile icon in the top bar, the profile dropdown is opened.

The pages and functions that are found in the profile menu are more closely connected to the user itself rather than their economy and holdings, such as security solutions, contact details and agreements.

Behaviour
  • Shows which user that is logged in at the top
  • A list of options in a dropdown component
  • When the user clicks one option it is directed to the page relevant to the option (for example settings slide-out opens when the user presses “settings”)
Profile dropdown

Profile dropdown

 

Page last updated

Feedback

Was this helpful?