Изменить прозрачность баннера?

Разработка
1

Можно ли изменить прозрачность баннера?

2

@JamesDb

Используя настройку темы banner_box_background_color, вы можете ввести значение rgba(). Вы можете воспользоваться генератором, например этим, и скопировать значение RGBA для этой настройки.

Или же вы можете добавить собственный CSS в свою тему, чтобы применить свойство opacity:

.below-site-header-outlet.welcome-link-banner-connector .welcome-wrapper {
    opacity: 0.5; // используйте значение от 0 до 1
}

Однако указанный выше подход с CSS изменит прозрачность и для содержимого (текст станет менее прозрачным).

3

Есть ли способ сохранить переменную, например var(--secondary), но добавить к ней прозрачность?

Поскольку я хочу, чтобы она адаптировалась к светлой и тёмной темам.

Редактирование: я уже пробовал rgba(var(--secondary), 0.5)

4

Я думаю, это должно сработать (хотя я не проверял):

rgba(--var(--secondary-rgb), 0.5)
5

Это не работает. Оно просто полностью удаляет цвет.

6

Хм, теперь понятно. Код должен использовать свойство background-color для поддержки этого, но в нём используется background.

Если вы добавите это в CSS вашей темы, всё должно заработать:


.below-site-header-outlet.welcome-link-banner-connector .welcome-wrapper {
    background-color: rgba(var(--secondary-rgb), 0.5);
}
7

Отлично, сработало, спасибо!