Визуальные параметры

Параметры кастомизации и отображения отдельных элементов интерфейса (показывать/скрывать).

Основные параметры

fixedLocale

Фиксирует локаль интерфейса.

  • По умолчанию: ru
  • Возможные значения: ru, en

enableAutoDarkTheme

Автопереключение темы в зависимости от системных настроек устройства.

  • По умолчанию: false

fontsPath

Путь до расположения шрифтов (CSS файл).

  • По умолчанию: undefined
  • Пример: https://rim.dev.insider.mts.ru/l/static/mtsBankFonts.css

Подробнее см. Шрифты/иконки/изображения.

illustrations

Пути и параметры статических изображений.

  • По умолчанию: null
  • Формат:
{
  "PassportOnboarding": {
    "light": {
      "url": "https://example.com/passport.png",
      "width": 153,
      "height": 180
    },
    "dark": {
      "url": "https://example.com/passport-dark.png",
      "width": 153,
      "height": 180
    }
  },
  "SelfieOnboarding": {
    "light": {
      "url": "https://example.com/selfie.png",
      "width": 133,
      "height": 180
    }
  },
  "WrongIcon": {
    "light": {
      "url": "https://example.com/warning.png",
      "width": 120,
      "height": 120
    }
  },
  "AnotherTabIcon": {
    "light": {
      "url": "https://example.com/loading.png",
      "width": 120,
      "height": 120
    }
  }
}

Доступные ключи изображений: – PassportOnboarding — иллюстрация для шага паспорта – SelfieOnboarding — иллюстрация для шага селфи – WrongIcon — иконка ошибки – AnotherTabIcon — иконка для уведомления о другой вкладке – QrPanelTipIcon — иконка подсказки для QR-панели

i18n

Переводы текстов интерфейса.

fonts

Параметры шрифтов.

  • По умолчанию:
{
  "header-font-family": "MTS Wide",
  "header-font-weight": "500",
  "header-font-size": "24px",
  "regular-font-family": "MTS Compact",
  "regular-font-weight": "normal",
  "regular-font-size": "17px",
  "button-font-family": "MTS Wide",
  "button-font-weight": "bold",
  "button-font-size": "12px",
  "caption-font-family": "MTS Compact",
  "caption-font-weight": "normal",
  "caption-font-size": "14px",
  "bold-font-family": "MTS Compact",
  "bold-font-weight": "500",
  "bold-font-size": "17px"
}
  • Пример кастомизации:
{
  "header-font-family": "Manrope",
  "header-font-weight": "800",
  "header-font-size": "24px",
  "regular-font-family": "Manrope",
  "regular-font-weight": "500",
  "regular-font-size": "15px",
  "button-font-family": "Manrope",
  "button-font-weight": "500",
  "button-font-size": "15px",
  "caption-font-family": "Manrope",
  "caption-font-weight": "500",
  "caption-font-size": "13px",
  "bold-font-family": "Manrope",
  "bold-font-weight": "800",
  "bold-font-size": "16px"
}

theme.light / theme.dark

Цвета и параметры темы (светлая/тёмная).

  • По умолчанию: значения из таблицы параметров кастомизации для темы
  • Пример для светлой темы:
{
  "bottom-buttons-background-color": "transparent",
  "list-bullet-color": "#000000",
  "button-text-upper-case": false,
  "button-corner": "12px",
  "button-height": "44px",
  "button-primary-background-color": "#141414",
  "brand-color": "#141414",
  "button-secondary-background-color": "#F2F1F0",
  "button-disabled-text-color": "#757575",
  "button-disabled-background-color": "#F2F1F0"
}
  • Пример для тёмной темы:
{
  "primary-text-color": "#FAFAFA",
  "secondary-text-color": "#969FA8",
  "third-text-color": "#626C77",
  "link-text-color": "#45B6FC",
  "error-text-color": "#FFA080",
  "desktop-fill-color": "#000000",
  "desktop-content-outline": "1px solid #3C4349",
  "screen-background-color": "#1A1D20",
  "success-color": "#74DF8B",
  "camera-screen-icon-color": "#FFFFFF",
  "camera-screen-text-color": "#FFFFFF",
  "photo-frame-color": "#FFFFFF",
  "successful-photo-frame-color": "#26CD58",
  "error-color": "#FA8A64",
  "info-color": "#45B6FC",
  "warning-color": "#FAD67D",
  "brand-color": "#FF0032",
  "modal-background-color": "#000000",
  "modal-corner-radius": "32px",
  "bottom-buttons-background-color": "#000000",
  "list-bullet-color": "#FF0032",
  "icon-primary-color": "#FAFAFA",
  "icon-secondary-color": "#969FA8"
}

params / params.mobile

Общие параметры кастомизации (для desktop и mobile).

  • По умолчанию: значения из таблицы параметров кастомизации
  • Пример:
{
  "content-padding": "0 20px",
  "back-button-icon-position-left": "-8px",
  "content-padding-top": "30px",
  "list-bullet-element": "---",
  "bottom-buttons-alignment": "row",
  "bottom-buttons-wrap": "wrap",
  "bottom-buttons-gap": "6px",
  "bottom-buttons-position": "absolute",
  "bottom-buttons-margin-top": "24px",
  "header-text-alignment": "left",
  "buttons-padding": "11px 17px 13px 16px",
  "passport-recognized-bottom-gap": "8px"
}

Применение параметров

Параметры передаются при создании заявки на идентификацию через API или через конфигурацию WebSDK.

Подробнее о каждом параметре см. соответствующие разделы документации.