DevRant-MOD

rant-image-viewer

Devrant image viewer

Από την 11/07/2017. Δείτε την τελευταία έκδοση.

Κάντε μια ερώτηση, δημοσιεύστε μια ανασκόπηση, ή αναφέρετε τον κώδικα.

Αναδίπλωση γραμμών

// ==UserScript==
// @name         rant-image-viewer
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Devrant image viewer
// @author       Himalay
// @match        https://www.devrant.io/*
// @grant        none
// ==/UserScript==

(function() {
  "use strict";
  document.querySelector("style").innerHTML += `.rant-lightbox {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.8);
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        z-index: 9999;
        padding: 10px;
    }
    .rant-lightbox img {
        max-height: 90vh;
    }
    .rant-lightbox a {
        margin-top: 10px;
        font-size: 1.5em;
    }`;
  document.addEventListener("click", e => {
    if (e.target.parentElement.classList.contains("rant-image")) {
      document.body.innerHTML += `<div class="rant-lightbox" onclick="this.parentElement.removeChild(this);"><img src="${e
        .target.src}" /><a href="${e.target
        .src}" download="${e.target.src.split("/").pop()}">?</a></div>`;
      e.preventDefault();
      e.stopPropagation();
    }
  });
})();