vladimirr89

В общем нужно было немного по другому подойти и задать before соседнему c img блоком элементу class="image-hover-effect" а далее уже дело техники. Вот готовый результат css

.banner-box .image-hover-effect::before{
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0)
}

.banner-box .image-hover-effect:hover::before {
background-color: rgba(255, 255, 255, 0.8);
}