How to not mirror avatars

Created by Sofie Brijs, Modified on Mon, 20 Dec, 2021 at 4:55 AM by Sofie Brijs

By default 50% of the avatars are mirrored to create more variation and dynamic in the visualisation of the avatars. In case you upload avatars with text or numbers included, some of the avatars will be visualised mirrored. You can arrange that those avatars are not mirrored by making use of custom CSS.

How to not mirror certain avatars

First you have to save the avatars that cannot be mirrored with the following file name on your computer:
- File name: avatar-x-organisation
- For example: avatar-01-thola, avatar-02-thola, avatar-03-thola etc.
- Important: if the other avatars can be mirrored, you shoud give them another file name. For exampe: avatar-x (without organisation name)
Go to the dashboard
Select the correct event
Go to media library
- Upload the avatars that cannot be mirrored with the correct file name
Go to general info & event settings
Go to custom CSS
Paste the following code in the text box under 'desktop custom css'
- .x-avatar img[src$="-organisation.svg/jpeg/png"] {
  transform: unset !important;
  }
- Important: fill in the right organisation name and image type in the code
- Example with avatars that are uploaded in png:
  
  .x-avatar img[src$="-thola.png"] {
  transform: unset !important;
  }
Press save

Before:

After custom css: