How to style the default Airlock IAM layout

Given that you want to change the look and feel of an instance called 'auth'.

These are the steps that you would need to follow:

  1. Initially create the templates for the instance authiam init-ui -i auth
  2. Open instances/auth/loginapp-layout/scss/8-custom/_custom-variables-instance.scss to edit the variables you want.
  3. Open instances/auth/loginapp-layout/scss/8-custom/_custom-instance.scss and add custom CSS in cases where the variables do not provide the flexibility you need.
  4. To make the changes visible, update the instance: iam build-ui -i auth
  5. Access the Loginapp via browser so see your changes.
  6. Repeat steps 2-5 for further customizations.

It is recommended that:

  • Do not make too many changes at once and check frequently whether your changes have the effect you expect.
  • Try to do as much customizing as possible using the SASS variables only instead of adding plenty of custom CSS.