Как изменить цвет панели управления в Fancybox 3?

Question

Я хочу изменить цвет элементов управления моей галереи Fancybox 3, так как значение по умолчанию едва читаемо.

Я уже загрузил отдельную таблицу стилей Fancybox, которая позволяет мне менять цвет фона. Я не могу найти способ изменить цвет элементов управления, используя тот же метод, хотя.

Содержание fancybox.css:

.fancybox-bg {
    background: #ccc;
}

.fancybox-is-open .fancybox-bg {
    opacity: 0.4;
}

Answer 1

Пожалуйста, используйте родительский элемент или класс или идентификатор для переопределения плагина css. Например,

div .fancybox-bg {...} или .class_name .fancybox-bg {...}

Answer 2

Вы должны быть более точными в отношении того, какой цвет вы хотели бы изменить, но если вы обращаетесь к кнопкам в верхнем правом углу, то вы можете сделать это, настроив класс .fancybox-button, пример:

.fancybox-button {
  background: red;
  color: #fff; /* Tip: This will change icon color */
  padding: 0; /* Tip: Change padding to resize icon */
}

Важно: Убедитесь, что вы добавили свой код настройки CSS ПОСЛЕ, включая fancybox.css

Answer 3

Использование

.fancybox-bg {
    background: #ccc !important;
}