Shows screens borders for detecting screens for displaying mobile banners

adv-screens.js

// ==UserScript==
// @name         Adv Screens
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://www.livejournal.com/*
// @match        https://www.lj-13.dev.lj.rambler.tech/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    var screensQunatity = Math.ceil(document.body.scrollHeight / document.body.clientHeight);
    var topOffset = 115; // close top banner, then start screens under categories
    console.log('Screens: ', screensQunatity);

    var divScreenHolder = document.createElement('div');
    divScreenHolder.style = `position: absolute; z-index: 2000; top: ${topOffset}px; left: 0; width: 100%; pointer-events: none;`;

    var colors = ['tomato', 'lightseagreen', 'gold', 'purple', 'yellowgreen', 'darkorange', 'teal'];
    var colorsCounter = 0;

    for (var i = 0; i < screensQunatity; i++ ) {
        var divScreen = document.createElement('div');
        var color = colors[colorsCounter];
        var divStyles = [
            'position: relative;',
            'width: 100%;',
            'height: ' + document.body.clientHeight + 'px;',
            'box-shadow: inset 0 0 0 5px ' + color + ';',
        ];
        divScreen.style = divStyles.join('');
        divScreen.innerHTML = '<span style=\'position: absolute; top: 0; right:0; padding: 3px 5px; background: ' + color + '; color: #000; pointer-events: none;\'>Screen ' + (i + 1) + '</span>';
        divScreenHolder.appendChild(divScreen);

        colorsCounter ++;
        if (colorsCounter == colors.length) {
            colorsCounter = 0;
        }

    }

    document.body.appendChild(divScreenHolder);

})();