Skip to content

Instantly share code, notes, and snippets.

@rpgroot
Forked from vcastroi/css-layout-hack.js
Created July 11, 2022 13:21
Show Gist options
  • Save rpgroot/cf50169d637c688f86da5778b4565ef9 to your computer and use it in GitHub Desktop.
Save rpgroot/cf50169d637c688f86da5778b4565ef9 to your computer and use it in GitHub Desktop.

Revisions

  1. @vcastroi vcastroi created this gist Sep 4, 2019.
    27 changes: 27 additions & 0 deletions css-layout-hack.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,27 @@
    // create a bookmark and use this code as the URL, you can now toggle the css on/off
    // thanks+credit: https://dev.to/gajus/my-favorite-css-hack-32g3
    javascript: (function() {
    var elements = document.body.getElementsByTagName('*');
    var items = [];
    for (var i = 0; i < elements.length; i++) {
    if (elements[i].innerHTML.indexOf('* { background:#000!important;color:#0f0!important;outline:solid #f00 1px!important; background-color: rgba(255,0,0,.2) !important; }') != -1) {
    items.push(elements[i]);
    }
    }
    if (items.length > 0) {
    for (var i = 0; i < items.length; i++) {
    items[i].innerHTML = '';
    }
    } else {
    document.body.innerHTML +=
    '<style>* { background:#000!important;color:#0f0!important;outline:solid #f00 1px!important; background-color: rgba(255,0,0,.2) !important; }\
    * * { background-color: rgba(0,255,0,.2) !important; }\
    * * * { background-color: rgba(0,0,255,.2) !important; }\
    * * * * { background-color: rgba(255,0,255,.2) !important; }\
    * * * * * { background-color: rgba(0,255,255,.2) !important; }\
    * * * * * * { background-color: rgba(255,255,0,.2) !important; }\
    * * * * * * * { background-color: rgba(255,0,0,.2) !important; }\
    * * * * * * * * { background-color: rgba(0,255,0,.2) !important; }\
    * * * * * * * * * { background-color: rgba(0,0,255,.2) !important; }</style>';
    }
    })();