Внимание
Служба поддержки не оказывает помощь по работе с данным разделом.
Эта документация еще не завершена, поэтому не рекомендуется спешить воспользоваться всеми параметрами. Используйте только то, что уже задокументировано.
В текущей версии стилей, очень много данных не перенесено, поэтому используйте то, что уже перенесено.
По мере выхода релизов, данный конструктор добавлен совсем недавно и работает в beta режиме и многих блоков нет в конструкторе.
Все что вам нужно, ожидать релиза
Вопросы и Ответы
Copy --iex-exchange-search-bg: #fff;
--iex-exchange-search-border-color: #f5f5f5;
--iex-exchange-search-text-color: rgba(103 , 103 , 103 , 0 .89 );
--iex-exchange-search-pl-text-color: rgba(103 , 103 , 103 , 0 .89 );
--iex-payment-info-color: #b5b0b0;
--iex-payment-value-color: rgb(34 , 35 , 50);
--iex-rules-color: #a7a7a7;
--iex-rules-link-color: #999;
--iex-drawer-color: rgba(0 , 0 , 0 , .87);
--exchange-dop-comm-bg: #f7f7f7;
--exchange-dop-comm-color: #666;
--exchange-dop-comm-font-size: 13px;
--exchange-verification-color:#4c9100;
--exchange-verification-bg: #f7ffed;
--exchange-verification-font-size: 14px;
--exchange-verification-align:center;
--exchange-course-value-color: #878787;
--exchange-course-value-font-size: 1.2rem;
--exchange-rules-checkbox-color: #727272;
--exchange-rules-checkbox-mobile-font-size: 13px;
--exchange-rules-checkbox-font-size: 14px;
--iex-exchange-section-title-font-weight: 300;
--iex-exchange-section-title-align: center;
--home-description-text-color: #a9a6a6;
--banners-bg: #fff;
--banners-button-bg: #f9f9f9;
--banners-button-color: #000;
--banners-title-color: #29303e;
--banners-text-color: rgba(41 , 48 , 62 , 0 .5 );
--service-break-title-color: #3e4756;
--service-break-title-font-weight: 400;
--service-break-text-color: #999999;
--iex-mobile-home-welcome-h1-size: 30px;
--iex-mobile-home-welcome-h1: #5568d4;
--iex-mobile-home-welcome-text-size: 15px;
--iex-mobile-home-welcome-text: #4a5861;
--iex-font-family: 'Roboto' , sans-serif ;
--iex-offline-bg: #bd0303;
--iex-offline-color: #fff;
--iex-exchange-description-bg: #fbfbfb;
--iex-exchange-description-color: #5f5f5f;
--iex-exchange-description-color-title: #212121;
--iex-base-width: 1200px;
--iex-main-home-welcome-h1: #5568d4;
--iex-main-home-welcome-h1-size: 52px;
--iex-main-home-welcome-text: #4a5861;
--iex-main-home-welcome-text-size: 19px;
--iex-faq-navigation-title: rgb(34 , 35 , 50);
--iex-faq-navigation-title-mobile: #4a4a4a;
--iex-faq-navigation-bg: #f7f8f9;
--iex-faq-expansion-bg: #f7f8f9;
--iex-faq-expansion-bg-hover: rgba(131 , 134 , 179 , 0 .18 );
--iex-faq-text-color: #000;
--iex-faq-expansion-body-color: #000;
--iex-faq-expansion-header-title: rgb(34 , 35 , 50);
--iex-faq-desc: #878792;
--iex-faq-expansion-mobile-bg: #f7f8f9;
--iex-faq-expansion-mobile-hover-bg: #e6eaed;
--iex-contact-block-link-bg: #eceef2;
--iex-contact-block-link-color: #303a43;
--iex-contact-left-block-title: #303a43;
--iex-contact-title-bg: #2d2d2d;
--iex-contact-desc-color: #878792;
--iex-contact-left-block-bg: #f7f8f9;
--iex-contact-left-block-color: #787878;
--iex-contact-block-bg: #f7f8f9;
--iex-language-bg: #f7f7f7;
--iex-kyc-bg: #f3f4f8;
--iex-payment-input-hint: #fbfbfb;
--iex-footer-bg: #fff;
--iex-footer-desc-color: #a1aab1;
--iex-footer-header-color: #3c4859;
--iex-footer-a: #8b939b;
--iex-footer-a-hover: #0facf3;
--iex-footer-linear: #e5e5e5;
--iex-page-bg: #fff;
--iex-page-color: #1c1c1c;
--iex-exchange-block-in-bg: #fff;
--iex-exchange-block-out-bg: #fff;
--iex-exchange-block-data-bg: #fff;
--iex-exchange-list-height: 55px;
--iex-exchange-section-title: rgba(0 , 0 , 0 , 0 .87 );
--iex-exchange-section-bg-title: rgba(0 , 0 , 0 , 0 .87 );
--iex-exchange-section-bg: #fff;
--iex-exchange-section-color: #fff;
--iex-exchange-section-no-bg: '';
--iex-exchange-section-no-color: #fff;
--iex-main-bg: -webkit-linear-gradient(90deg , #ebf0f3 , #f4f6f7 ) fixed;
--iex-mobile-sidenav-bg: #5568d4;
--iex-mobile-sidenav-color: #fff;
--iex-mobile-sidenav-active-color: #fff;
--iex-checkbox-checked-bg:#5568d4;
--iex-title-font-weight: 500;
--iex-mobile-form-style-bg: #f1f2f8;
--iex-form-price-color: #252a48;
--iex-form-price-font-size: 20px;
--iex-form-price-hint-color: #95abb7;
--iex-form-price-code-color: rgba(0 , 0 , 0 , 0 .87 );
--iex-course-color: #111111;
--iex-course-border-color: #e9e9e9;
--iex-form-style-bg: #f3f4f8;
--iex-form-style-label: #818497;
--iex-progress-bg-order: #5568d4;
--iex-progress-spinner-bg: #5568d4;
--header-navigation-color: #787878;
--iex-partner-tab-bg: #eceef2;
--iex-partner-tab-color: #303a43;
--iex-partner-tab-active-bg: #5568d4;
--iex-partner-tab-active-color: #fff;
--iex-contests-bg: linear-gradient(18deg , rgba(85 , 104 , 212 , 1) 25%, rgba(158 , 119 , 237 , 1) 82%);
--iex-contests-button-bg: #fff;
--iex-contests-button-color: #000;
--iex-account-lottery-wrap-bg : linear-gradient(18deg , #5568d4 25% , #9e77ed 82%);
--iex-account-lottery-wrap-color : #fff;
--iex-order-link-color: #5568d4;
--iex-order-item-bg: rgba(243 , 244 , 248 , 0 .6 );
--iex-toolbar-mobile-color: #5568d4;
--iex-toolbar-mobile-text-color: #fff;
--iex-order-pay-field-bg: #2a343c;
--iex-order-pay-field-color: #fff;
--iex-create-order-button-bg: #5568d4;
--iex-create-order-button-color: #fff;
--iex-create-order-button-bg-hover: #4f60cc;
--iex-create-order-button-color-hover: #fff;
--iex-referral-first-bg: #f3f4f8;
--iex-referral-first-color: #1c1c1c;
--iex-referral-bg: #f3f4f8;
--iex-referral-color: rgba(0 , 0 , 0 , 0 .5 );
--iex-referral-percent-bg: #262626;
--iex-referral-percent-color: #fff;
--iex--toolbar-menu-bg: #5568d4;
--iex--toolbar-menu-color: #fff;
--iex--toolbar-menu-hover-bg: #e5e5e5;
--iex-auth-login-color: #787878;
--iex-auth-login-bg: 'transparent';
--iex-auth-register-color: #fff;
--iex-auth-register-bg: #5568d4;
--iex-auth-font-weight: 500;
--iex-login-bg-gradient: -webkit-linear-gradient( 90deg , rgba(85 , 104 , 212 , 1) 0, rgba(158 , 119 , 237 , 1) 100%);
--iex-login-bg-gradient-color: rgba(255 , 255 , 255 , 1);
--iex-login-form-button-register: #5568d4;
--iex-login-form-button-register-color: rgba(255 , 255 , 255 , 0 .85 );
--iex-login-form-button-disabled: #e3e3e3;
--iex-toolbar-link-color: #5568d4;
--iex-logotype-mobile-width: 150px;
--iex-logotype-mobile-height: auto;
--iex-logotype-width: 180px;
--iex-logotype-height: auto;
--iex-logotype-text: #5568d4;
--iex-logotype-text-hover: #222332;
--iex-bar-icon: #222332;
--iex-a: #337ab7;
--iex-a-hover: #23527c;
--iex-base-bg-color: #5568d4;
--iex-base-bg-text: #5568d4;
--iex-bg-color-button: #222332;
--iex-account-button-bg: #f5f3ff;
--iex-exchange-title: #222332;
--iex-exchange-mat-list-color: #222332;
--iex-exchange-mat-list-active-color: #222332;
--iex-footer-text: #222332;
--iex-color-white: #fff;
--iex-base-bg-color-white: #fff;
--iex-base-bg-font-weight: 400;
--iex-cashback-selected: #f5f3ff;
--iex-button-group-bg: #222332;
--iex-mat-button-toggle-color: #fff;
--iex-mat-button-toggle-bg: rgba(18 , 18 , 29 , 0 .68 );
--iex-main-menu-popup-renderer: hsl(231 , 34% , 95%);
--iex-tooltip-arrow: #465368e6;
--iex-statistic-bg: #5568d4;
--iex-default-main-gradient: -webkit-linear-gradient(90deg , #151c2d , #242b3c);
--iex-toggle-checked-bg: #465368e6;
--iex-toggle-checked-color: #fff;
--iex-toggle-search-icon: #b3b3b3;
--iex-toggle-filter-icon: rgba(103 , 103 , 103 , 0 .89 );
--iex-exchange-reserve-color: #222332;
--iex-exchange-reserve-code-color: #b6b6b6;
--iex-dialog-color: #4d4d4d;
--iex-dialog-bg: #fff;
--course-reserve-button-active-bg: #f2f2f2;
--course-reserve-button-active-color: #000;
--course-reserve-group-button-color: #989898;
--iex-exchange-block-radius: 8px;
--iex-exchange-indent: 8px;
--iex-exchange-common-bg: #fff;
--iex-exchange-common-bg-radius:10px;
--iex-exchange-common-border-color: #e9e9e9;
--iex-exchange-scrollbar: #f3f4f8;
--iex-exchange-scrollbar-thumb: #DFE1E5;
--iex-exchange-scrollbar-track: #f3f4f8;
--iex-exchange-scrollbar-radius: 10px;
--iex-exchange-scrollbar-width: 3px; Загрузить можно 2 способами.
1 Способ
В панели управления, зайдите "Настройки - Настройка системы" , нажмите на заголовок "Настройки продукта" и выберите "Настройки интерфейса" .
Во вкладке "Настройка стиля" , найдите пункт "Загрузить свой стиль" и добавьте все новые изменения
2 Способ.
На сервере, в папке /public/css , создайте файл custom.css
Стили можно прописать 2 способа, первая это использование нескольких цветов, второе это один цвет
Первый способ
Copy --iex-main-bg: linear-gradient() Второй способ
Copy --iex-main-bg: (вставьте цвет к примеру #fff; или rgba(188, 180, 217, 0 .3 );) Если цвет не применяется до в конце установленного цвета добавьте !important
Рекомендуем ее использовать только в тех стилях, где она предусмотрено по умолчанию, в остальных не рекомендуется.
Если вы хотите custom цвета, то заменяйте если в параметрах найдете
-webkit-linear-gradient(90deg, #ebf0f3, #f4f6f7) fixed
Замените на новые цвета
Основной цвет теста на сайте
Copy --iex-page-color: #1c1c1c; Шрифт сайта
Copy --iex-font-family: 'Roboto' , sans-serif ; Оформление поля "Суммы обмена"
Copy --iex-form-price-font-size: 20px; // Размер текста
--iex-form-price-color: #252a48; // Цвет текста
--iex-form-price-code-color: rgba(0, 0, 0, 0 .87 ); // Цвет текста кода валюты
--iex-form-price-hint-color: #95abb7; // Цвет текста внизу суммы обмена Оформление поля "Поиск"
Copy --iex-exchange-search-text-color: rgba(103, 103, 103, 0 .89 ); // Цвет введенного текста
--iex-toggle-search-icon: #b3b3b3; // Цвет иконки поиска
--iex-exchange-search-pl-text-color: rgba(103, 103, 103, 0 .89 ); // Цвет не введенного текста
--iex-toggle-filter-icon: rgba(103, 103, 103, 0 .89 ); // Цвет иконки фильтров (справа) Оформление выбранных валют в блоке "Ввод данных"
Copy --iex-payment-info-color: #b5b0b0; // Цвет валюты
--iex-payment-value-color: rgb(34, 35, 50); // Цвет суммы обмена
--iex-course-color: #111111; // Цвет текста "Обмен по курсу"
--iex-course-border-color: // Цвет линии внизу текста "Обмен по курсу" Цвет ссылок
Copy --iex-a: #337ab7; // Стандартный
--iex-a-hover: #23527c; // При наведении Цвет фона и текста страниц
Copy --iex-page-bg: #fff; // Цвет фона
--iex-page-color: #1c1c1c; // Цвет текста Цвет фона блоков
Copy --iex-exchange-block-bg: #fff; Цвет текста заголовков (на главной странице без фона)
Copy --iex-exchange-section-title: #000; Цвет текста заголовков (на главной странице с фоном)
Copy --iex-exchange-section-bg-title: #000; Высота названий валют
Copy --iex-exchange-list-height: 55px; Фон сайта
Здесь вы можете настроить фон сайта.
Если хотите градиент то используйте: -webkit-linear-gradient(90deg, Цвет , Цвет ) fixed
Если хотите один цвет: Цвет
Copy --iex-main-bg: -webkit-linear-gradient(90deg , #ebf0f3 , #f4f6f7 ) fixed; Цвет текстового логотипа
Стандартный
#5568d4, #222332 - замените на тот цвет, который вам нужен
Copy --iex-logotype-text: #5568d4; При наведении на логотип
Copy --iex-logotype-text-hover: #222332; Цвет фона полей
Для мобильной версии
Copy --iex-mobile-form-style-bg: #f1f2f8; Для web версии
Copy --iex-form-style-bg: #f3f4f8; Фон меню в мобильной версии
#5568d4 - замените на тот цвет фона, который вам нужен
Copy --iex-mobile-sidenav-bg: #5568d4; Цвет текста в меню мобильной версии
#fff - замените на тот цвет, который вам нужен
Copy --iex-mobile-sidenav-color: #fff; Цвет фона шапки в мобильной версии
#5568d4 - замените на тот цвет, который вам нужен
Copy --iex-toolbar-mobile-color: #5568d4; Цвет текста активного разделе в меню мобильной версии
#fff - замените на тот цвет, который вам нужен
Copy --iex-mobile-sidenav-active-color: #fff; Цвет фона Конкурсов
Для главной страницы
Если хотите градиент то используйте: linear-gradient(18deg, rgba(85,104,212,1) 25%, rgba(158,119,237,1) 82%)
Если хотите один цвет: Цвет
Copy --iex-contests-bg: linear-gradient(18deg , rgba(85 , 104 , 212 , 1) 25%, rgba(158 , 119 , 237 , 1) 82%); Для личного кабинета
Если хотите градиент то используйте: linear-gradient(18deg,#5568d4 25%,#9e77ed 82%);
Если хотите один цвет: Цвет
Copy --iex-account-lottery-wrap-bg: linear-gradient(18deg , #5568d4 25% , #9e77ed 82%); Цвет выделения галочек
#5568d4 - замените на тот цвет, который вам нужен
Copy --iex-checkbox-checked-bg:#5568d4; Цвет текста меню в шапке сайта
#787878 - замените на тот цвет, который вам нужен
Copy --header-navigation-color: #787878; Цвет текста остальных элементов в шапке сайта
#222332 - замените на тот цвет, который вам нужен
Copy --iex-bar-icon: #222332; Раздел "Партнерам"
Цвет фона активной кнопки
#5568d4 - замените на тот цвет, который вам нужен
Copy --iex-partner-tab-active-bg: #5568d4; Цвет текста, активной кнопки
#fff - замените на тот цвет, который вам нужен
Copy --iex-partner-tab-active-color: #fff; Цвет фона (неактивной) кнопки
#eceef2 - замените на тот цвет, который вам нужен
Copy --iex-partner-tab-bg: #eceef2; Цвет текста (неактивной) кнопки
#303a43 - замените на тот цвет, который вам нужен
Copy --iex-partner-tab-color: #303a43; Цвет кнопки и текста "Перейдите к оплате"
#5568d4 и #fff - замените на тот цвет, который вам нужен
Copy --iex-base-bg-color: #5568d4; // Цвет кнопки
--iex-base-bg-color-white: #fff; // Цвет текста 