Close icon about luminous HOT 1 CLOSED

if (document.querySelector(".lightbox-trigger") !== null) {

            Array.prototype.slice.call(document.querySelectorAll(".lightbox-trigger")).forEach((($lightboxEl) => {

                //create luminous instance
                new Luminous($lightboxEl, {
                    sourceAttribute: "href",
                    caption:         $lightboxEl.querySelector("img").getAttribute("alt"),
                    openTrigger:     "click",
                    closeTrigger:    "click",
                    closeWithEscape: true,
                    onOpen: () => {
                        Array.prototype.slice.call(document.querySelectorAll(".lum-lightbox")).forEach(($lumEl) => {

                            if ($lumEl.querySelector(".lum-close-icon") === null) {

                                //create close icon
                                const $closeEl = document.createElement('span')
                                $closeEl.classList.add("lum-close-icon")

                                //add close icon to DOM
                                $lumEl.insertAdjacentElement('beforeend', $closeEl)
                            }
                        })
                    }
                })
            }))
        }

.lum-close-icon {
  position: absolute;
  right: 32px;
  top: 32px;
  width: 32px;
  height: 32px;
  transform: rotate(0deg);
  transition: .25s ease-in-out transform;
  transform-origin: center center;
  cursor: pointer;

  &:hover {
    transform: rotate(90deg);
  }

  &:before, &:after {
    position: absolute;
    left: 15px;
    content: ' ';
    height: 33px;
    width: 2px;
    background-color: #fff;
  }

  &:before {
    transform: rotate(45deg);
  }

  &:after {
    transform: rotate(-45deg);
  }
}