MM5.4 Styling Guide

Owned by Stefan Fodor (Unlicensed)
Last updated: Oct 28, 2020 by Gosia Creosteanu (Unlicensed)
2 min read

Theming

Main theme

Custom styling in MM5.0.0 can be done using the theme editor, which can be found in "Settings". To enable the Settings button in MM5 you append the Media Manager URL with /settings The following 4 colors can be changed:

  1. Theme color
  2. Hover effect color
  3. Active effect color
  4. Color of icons and text

Please ensure that the chosen text color is visible on top of the background color.

Instead of setting the hover color and the active color manually, it is possible to generate them based on the theme color. A positive darkening percentage darkens the hover color and the active color. A negative darkening percentage lightens the hover color and the active color. To save the theme and make sure that it is remembered after refreshing the application, press "Save".Ā 

Topbar theme

The user can style the topbar independently of the main theme. The following 4 colors can be changed:

  1. Topbar background color
  2. Topbar text color
  3. Hover effect color
  4. Active effect color.

The changes are applied in real time so the user can observe the effects of the changes. The changes will not be saved, though, until the user clicks "Save".

The button "Factory reset" resets the four colors to their standard values.

Logo

In the "Settings" section the user can also change the logos available in the Media Manager.

The header logo appears in the upper left corner of the navigation bar. The login screen logo appears in the login box as well as inside the mobile navigation menu.

The user can select a new logo from one of the two sources:

  • assets already uploaded to the Media Manager ("Browse")
  • desktop ("Upload").

Once the new logo is selected, the user can see the visual combination of the new logo with the currently applied theme and make theming decisions based on that.

After making changes, the user needs to click "Save" before exiting this section of settings. If the user attempts to leave without having saved the changes, a warning will appear. The user can then either discard the changes ("Leave") or remain in order to save them ("Stay").