Как убрать усиление цвета на пересечении after и before?

Question

[EGORIKEBOLIK]

Делая крестик с помощью псевдоэлементов, столкнулся с тем, что на пересечении before и after изменяется цвет

$Dark50 : rgba(31, 32, 65, 0.5);
          minus-button {
          height: 30px;
          width: 30px;
          border: 1px solid $Dark50;
          border-radius: 50%;
          position: relative;
          &::before,
          &::after {
            content: '';
            height: 7px;
            width: 2px;
            position: absolute;
            top:50%;
            left:50%;
            background-color: $Dark50;
          }
          &::before {
            transform: rotate(90deg);
          }
        }

Скорее всего это из-за прозрачности цвета. Можно ли это как-то исправить, не использую svg и применяя только псевдоэлементы?

Comments

[YavaDev]

$Dark50 : rgb(31, 32, 65);

.minus-button {
  opacity: 0.5;
  ...
}