Перейти к основному содержимому

Настройка тем и цветов пользовательского интерфейса

Для изменения и настройки тем интерфейса Loop необходимо:

  • В правом верхнем углу перейти в Настройки (символ шестеренки).
  • На боковой панели выбрать Вид > Тема.

  • Возможно импортировать темы из Slack, настроить цвета самостоятельно или выбрать одну из стандартных тем, разработанных командой Loop.
  • Любые внесенные изменения применяются ко всем командам, которым вы принадлежите.

Мобильное приложение​

  1. Нажать на изображение профиля

  2. Выбрать Настройки > Экран > Тема.

Импорт темы из Slack​

Для импорта темы из Slack:

  • В Slack: перейти в Настройки > Темы, выбрать Создать пользовательскую тему, затем скопировать значения цвета темы.
  • В Loop: перейти в Настройки > Вид > Тема, выбрать Импортировать цветовую палитру темы из Slack, затем, вставить значения цвета в поле ввода и выбрать Отправить. Выбрать Сохранить для подтверждения изменения темы.
  • Любые настройки темы, которые не настраиваются в Slack, по умолчанию, будут соответствовать стандартным настройкам темы Loop.

Стандартные темы​

  1. В правом верхнем углу перейти в Настройки.
  2. На боковой панели слева выбрать Вид > Тема.
  3. Выбрать стандартную тему.
  • Для внесения пользовательских настроек в стандартные цвета темы: выбрать стандартную тему, затем, выбрать Пользовательскую тему для дополнительной настройки темы на основе предпочтений.
  1. Выбрать Сохранить, для подтверждения изменений темы.

Настройка пользовательских тем​

  1. В правом верхнем углу перейти в Настройки.
  2. На боковой панели слева выбрать Вид > Тема > Пользовательская тема.
  3. Развернуть настраиваемые параметры, чтобы настроить отдельные цвета интерфейса, такие как фон, ссылки, текст и границы.
к сведению

Пользовательские изменения темы применяются по мере их внесения.

  1. Выбрать Сохранить, для подтверждения изменений темы.
  • Для отмены внесенных изменений, необходимо выйти из окна настроек дисплея и выбрать “Да, отменить”.

Настройки боковой панели​

Боковая панель.

  • Цвет фона панели каналов и боковых панелей навигации по настройкам аккаунта и команды.

Текст на боковой панели.

  • Цвет текста каналов чтения на панели “Каналы” и вкладок на боковой панели навигации по настройкам аккаунта и команды.

Заголовки боковой панели.

  • Цвет фона заголовка над панелью “Каналы” и заголовков всех диалоговых окон.

Команды на боковой панели.

Заголовки боковой панели.

  • Цвет текста заголовка над панелью “Каналы” и заголовков всех диалоговых окон.

Непрочитанные сообщения на боковой панели.

  • Цвет текста непрочитанных сообщений на панели каналов.

Текст боковой панели при наведении курсора мыши.

  • Цвет фона за названиями каналов и вкладками настроек при наведении на них курсора.

Активная граница текста боковой панели.

  • Цвет прямоугольного маркера в левой части панели “Каналы” или боковой панели “Настройки”, указывающего на активный канал или вкладку.

Активный цвет текста боковой панели.

  • Цвет текста активного канала или вкладки в панели “Каналы” или боковой панели “Настройки”.

Онлайн-индикатор.

  • Цвет онлайн-индикатора, появляющегося рядом с именами членов команды в списке прямых сообщений.

Индикатор отсутствия.

  • Цвет индикатора отсутствия, появляющегося рядом с именами членов команды в списке прямых сообщений, когда они не были активны в браузере в течение 5 минут.

Индикатор “Не беспокоить”.

  • Цвет индикатора “Не беспокоить”, появляющегося рядом с именами членов команды в списке прямых сообщений.

Упоминание.

  • Цвет фона иконки упоминаний, указывающего на непрочитанные сообщения с упоминаниями, который появляется справа от названия канала. Это также цвет фона индикатора “Непрочитанные сообщения ниже/выше”, появляющегося в верхней или нижней части панели каналов.

Упоминания.

  • Цвет текста иконки упоминания указывает на количество непрочитанных упоминаний. Это также цвет текста на индикаторе “Непрочитанные сообщения ниже\выше”.

Стили центрального канала​

Цвет центрального канала.

  • Настройка цвета центральной панели, боковой панели и сообщениях.

Цвет текста центрального канала.

  • Настройка отображения цвета текста, за исключением упоминаний, ссылок, хештегов и блоков кода в центральной панели, боковой панели и сообщениях.

Разделитель новых сообщений.

  • Появляется под последним прочитанным сообщением после перехода к каналу с непрочитанными сообщениями.

Цвет текста ошибки.

  • Настройка цвета всего текста, в случае возникновения ошибки.

Цвет фона подсветки упоминаний.

  • Настройка цвета слов, вызывающих упоминания в центральной панели и боковой панели.

Цвет ссылки выделения упоминаний.

  • Настройка цвета текста слов, вызывающих упоминания в центральной и боковой панелях.

Тема кода.

  • Цвет фона и синтаксиса для всех блоков кода.

Стили ссылок и кнопок​

Цвет ссылки.

  • Цвет текста всех ссылок, хештегов, упоминаний членов команды и кнопок пользовательского интерфейса с низким приоритетом.

Кнопки.

  • Цвет прямоугольного фона за всеми кнопками пользовательского интерфейса с высоким приоритетом.

Текст кнопки.

  • Цвет текста, отображаемый на прямоугольном фоне для всех кнопок пользовательского интерфейса с высоким приоритетом.

Экспорт пользовательской темы​

Существует возможность экспорта тем из Loop, скопировав значения темы из меню пользовательской темы. Для этого:

  • Перейти в Настройки > Вид > Тема.
  • Выбрать Пользовательскую тему.
  • Выбрать Скопировать цвета темы.

Импорт пользовательской темы​

Существует возможность импорта тем в Loop, вставив значения темы в меню пользовательской темы. Для этого:

  • Скопировать существующие значения темы.
  • Перейти к: Настройки > Вид > Тема.
  • Выбрать Пользовательскую тему.
  • Вставить значение темы в поле копировать и вставить, чтобы поделиться цветами темы.

Примеры пользовательских тем​

  • Ниже приведены некоторые примеры тем с соответствующими им значениями темы.

Standard

{"sidebarBg":"#145dbf","sidebarText":"#ffffff","sidebarUnreadText":"#ffffff","sidebarTextHoverBg":"#4578bf","sidebarTextActiveBorder":"#579eff","sidebarTextActiveColor":"#ffffff","sidebarHeaderBg":"#1153ab","sidebarTeamBarBg":"#0b428c","sidebarHeaderTextColor":"#ffffff","onlineIndicator":"#06d6a0","awayIndicator":"#ffbc42","dndIndicator":"#f74343","mentionBg":"#ffffff","mentionBg":"#ffffff","mentionColor":"#145dbf","centerChannelBg":"#ffffff","centerChannelColor":"#3d3c40","newMessageSeparator":"#ff8800","linkColor":"#2389d7","buttonBg":"#166de0","buttonColor":"#ffffff","errorTextColor":"#fd5960","mentionHighlightBg":"#ffe577","mentionHighlightLink":"#166de0","codeTheme":"github"}

Organization

{"sidebarBg":"#2071a7","sidebarText":"#ffffff","sidebarUnreadText":"#ffffff","sidebarTextHoverBg":"#136197","sidebarTextActiveBorder":"#7ab0d6","sidebarTextActiveColor":"#ffffff","sidebarHeaderBg":"#2f81b7","sidebarTeamBarBg":"#256996","sidebarHeaderTextColor":"#ffffff","onlineIndicator":"#7dbe00","awayIndicator":"#dcbd4e","dndIndicator":"#ff6a6a","mentionBg":"#fbfbfb","mentionColor":"#2071f7","centerChannelBg":"#f2f4f8","centerChannelColor":"#333333","newMessageSeparator":"#ff8800","linkColor":"#2f81b7","buttonBg":"#1dacfc","buttonColor":"#ffffff","errorTextColor":"#a94442","mentionHighlightBg":"#f3e197","mentionHighlightLink":"#2f81b7","codeTheme":"github"}

Standard Dark

{"sidebarBg":"#1b2c3e","sidebarText":"#ffffff","sidebarUnreadText":"#ffffff","sidebarTextHoverBg":"#4a5664","sidebarTextActiveBorder":"#66b9a7","sidebarTextActiveColor":"#ffffff","sidebarHeaderBg":"#1b2c3e","sidebarTeamBarBg":"#152231","sidebarHeaderTextColor":"#ffffff","onlineIndicator":"#65dcc8","awayIndicator":"#c1b966","dndIndicator":"#e81023","mentionBg":"#b74a4a","mentionColor":"#ffffff","centerChannelBg":"#2f3e4e","centerChannelColor":"#dddddd","newMessageSeparator":"#5de5da","linkColor":"#a4ffeb","buttonBg":"#4cbba4","buttonColor":"#ffffff","errorTextColor":"#ff6461","mentionHighlightBg":"#984063","mentionHighlightLink":"#a4ffeb","codeTheme":"solarized-dark"}

Windows Dark

{"sidebarBg":"#171717","sidebarText":"#ffffff","sidebarUnreadText":"#ffffff","sidebarTextHoverBg":"#302e30","sidebarTextActiveBorder":"#196caf","sidebarTextActiveColor":"#ffffff","sidebarHeaderBg":"#1f1f1f","sidebarTeamBarBg":"#181818","sidebarHeaderTextColor":"#ffffff","onlineIndicator":"#399fff","awayIndicator":"#c1b966","dndIndicator":"#e81023","mentionBg":"#0177e7","mentionColor":"#ffffff","centerChannelBg":"#1f1f1f","centerChannelColor":"#dddddd","newMessageSeparator":"#cc992d","linkColor":"#0d93ff","buttonBg":"#0177e7","buttonColor":"#ffffff","errorTextColor":"#ff6461","mentionHighlightBg":"#784098","mentionHighlightLink":"#a4ffeb","codeTheme":"monokai"}

GitHub Theme

{"awayIndicator":"#D4B579","buttonBg":"#66CCCC","buttonColor":"#FFFFFF","centerChannelBg":"#FFFFFF","centerChannelColor":"#444444","codeTheme":"github","linkColor":"#3DADAD","mentionBg":"#66CCCC","mentionColor":"#FFFFFF","mentionHighlightBg":"#3DADAD","mentionHighlightLink":"#FFFFFF","newMessageSeparator":"#F2777A","onlineIndicator":"#52ADAD","sidebarBg":"#F2F0EC","sidebarHeaderBg":"#E8E6DF","sidebarHeaderTextColor":"#424242","sidebarText":"#2E2E2E","sidebarTextActiveBorder":"#66CCCC","sidebarTextActiveColor":"#594545","sidebarTextHoverBg":"#E0E0E0","sidebarUnreadText":"#515151"}

Monokai Theme

{"awayIndicator":"#B8B884","buttonBg":"#90AD58","buttonColor":"#FFFFFF","centerChannelBg":"#FFFFFF","centerChannelColor":"#444444","codeTheme":"monokai","linkColor":"#90AD58","mentionBg":"#7E9949","mentionColor":"#FFFFFF","mentionHighlightBg":"#54850C","mentionHighlightLink":"#FFFFFF","newMessageSeparator":"#90AD58","onlineIndicator":"#99CB3F","sidebarBg":"#262626","sidebarHeaderBg":"#363636","sidebarHeaderTextColor":"#FFFFFF","sidebarText":"#FFFFFF","sidebarTextActiveBorder":"#7E9949","sidebarTextActiveColor":"#FFFFFF","sidebarTextHoverBg":"#525252","sidebarUnreadText":"#CCCCCC"}

Solarized Dark Theme

{"awayIndicator":"#E0B333","buttonBg":"#859900","buttonColor":"#fdf6e3","centerChannelBg":"#073642","centerChannelColor":"#93a1a1","codeTheme":"solarized-dark","linkColor":"#268bd2","mentionBg":"#dc322f","mentionColor":"#ffffff","mentionHighlightBg":"#d33682","mentionHighlightLink":"#268bd2","newMessageSeparator":"#cb4b16","onlineIndicator":"#2AA198","sidebarBg":"#073642","sidebarHeaderBg":"#002B36","sidebarHeaderTextColor":"#FDF6E3","sidebarText":"#FDF6E3","sidebarTextActiveBorder":"#d33682","sidebarTextActiveColor":"#FDF6E3","sidebarTextHoverBg":"#CB4B16","sidebarUnreadText":"#FDF6E3","errorTextColor":"#dc322f"}

Gruvbox Dark Theme

{"awayIndicator":"#fabd2f","buttonBg":"#689d6a","buttonColor":"#ebdbb2","centerChannelBg":"#3c3836","centerChannelColor":"#ebdbb2","codeTheme":"monokai","errorTextColor":"#fb4934","linkColor":"#83a598","mentionBg":"#b16286","mentionColor":"#fbf1c7","mentionHighlightBg":"#d65d0e","mentionHighlightLink":"#fbf1c7","newMessageSeparator":"#d65d0e","onlineIndicator":"#b8bb26","sidebarBg":"#282828","sidebarHeaderBg":"#1d2021","sidebarHeaderTextColor":"#ebdbb2","sidebarText":"#ebdbb2","sidebarTextActiveBorder":"#d65d0e","sidebarTextActiveColor":"#fbf1c7","sidebarTextHoverBg":"#d65d0e","sidebarUnreadText":"#fe8019"}

One Dark Theme

{"sidebarBg":"#21252b","sidebarText":"#abb2bf","sidebarUnreadText":"#abb2bf","sidebarTextHoverBg":"#3a3f4b","sidebarTextActiveBorder":"#4d78cc","sidebarTextActiveColor":"#d7dae0","sidebarHeaderBg":"#282c34","sidebarHeaderTextColor":"#abb2bf","onlineIndicator":"#98c379","awayIndicator":"#d19a66","dndIndicator":"#be5046","mentionBg":"#98c379","mentionColor":"#ffffff","centerChannelBg":"#282c34","centerChannelColor":"#abb2bf","newMessageSeparator":"#c67add","linkColor":"#61afef","buttonBg":"#4d78cc","buttonColor":"#ffffff","errorTextColor":"#f44747","mentionHighlightBg":"#525a69","mentionHighlightLink":"#61afef","codeTheme":"monokai","mentionBg":"#98c379"}

Discord Dark Theme

{"sidebarBg":"#2f3136","sidebarText":"#ffffff","sidebarUnreadText":"#ffffff","sidebarTextHoverBg":"#33363c","sidebarTextActiveBorder":"#66cfa0","sidebarTextActiveColor":"#ffffff","sidebarHeaderBg":"#27292c","sidebarHeaderTextColor":"#ffffff","onlineIndicator":"#43b581","awayIndicator":"#faa61a","dndIndicator":"#f04747","mentionBg":"#6e84d2","mentionBg":"#6e84d2","mentionColor":"#ffffff","centerChannelBg":"#36393f","centerChannelColor":"#dddddd","newMessageSeparator":"#6e84d2","linkColor":"#2095e8","buttonBg":"#43b581","buttonColor":"#ffffff","errorTextColor":"#ff6461","mentionHighlightBg":"#3d414f","mentionHighlightLink":"#6e84d2","codeTheme":"monokai"}

Night Owl Dark Theme

{"sidebarBg":"#011627","sidebarText":"#d6deeb","sidebarUnreadText":"#d6deeb","sidebarTextHoverBg":"#1d3b53","sidebarTextActiveBorder":"#ff2c83","sidebarTextActiveColor":"#82aaff","sidebarHeaderBg":"#1d3b53","sidebarHeaderTextColor":"#d6deeb","onlineIndicator":"#addb67","awayIndicator":"#ffbc42","dndIndicator":"#f74343","mentionBg":"#d6deeb","mentionBg":"#d6deeb","mentionColor":"#145dbf","centerChannelBg":"#011627","centerChannelColor":"#d6deeb","newMessageSeparator":"#ff8800","linkColor":"#2389d7","buttonBg":"#166de0","buttonColor":"#011627","errorTextColor":"#fd5960","mentionHighlightBg":"#0b2942","mentionHighlightLink":"#82aaff","codeTheme":"solarized-dark"}

Темная тема (только настольное приложение)

  • В Windows и macOS настройки отображения системы, которые устанавливаются на десктопном устройстве (например, светлая или темная темы), также применяются к настольному приложению Loop.

  • В Linux можно управлять настройкой тем вручную через меню View