Twitter_Uncircle.user.js

// ==UserScript==
// @name         Twitter un-circle
// @namespace    https://gist.githubusercontent.com/DesertEagleDerek/afa3281b951b4b05c27422aa2ff104ee/raw/Twitter_Uncircle.user.js
// @updateURL    https://gist.githubusercontent.com/DesertEagleDerek/afa3281b951b4b05c27422aa2ff104ee/raw/Twitter_Uncircle.user.js
// @downloadURL  https://gist.githubusercontent.com/DesertEagleDerek/afa3281b951b4b05c27422aa2ff104ee/raw/Twitter_Uncircle.user.js
// @version      0.9
// @author       DesertEagleDerek
// @description  Revert to older square elements
// @homepage     http://www.deserteaglederek.com/
// @match        https://twitter.com/*
// @run-at       document-start
// @grant        none
// ==/UserScript==

function addGlobalStyle(css) {
    var head, style;
    head = document.getElementsByTagName('head')[0];
    if (!head) { return; }
    style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = css;
    head.appendChild(style);
}

function addStyleCSS(values) {
    var finalCSS = "";
    for(var i = 0; i < values.length; i++) {
        for(var j = 0; j < values[i].length; j++) {
            if(j > 0) {
                finalCSS += values[i][j] + " !important;";
            } else {
                finalCSS += values[i][j] + " { ";
            }
        }
        finalCSS += " } \n";
    }
    addGlobalStyle(finalCSS);
}

(function() {
    'use strict';
    // array
    var cssArray = [];
    // get rid of those circles! (pre-2019 layout)
    cssArray.push([".Avatar, .ProfileAvatar-image", "border-radius:8px"]);
    cssArray.push([".ProfileAvatar", "border-radius:12px"]);
    cssArray.push([".ProfileCard-avatarLink", "border-radius:6px"]);
    cssArray.push([".ProfileCard-avatarLink img", "border-radius:5px"]);
    cssArray.push([".DashboardProfileCard-avatarImage", "border-radius:5px"]);
    cssArray.push([".avatar", "border-radius:5px"]);
    cssArray.push([".EdgeButton", "border-radius:5px"]);
    cssArray.push(["#tweet-box-global", "padding:5px"]);
    cssArray.push([".RichEditor", "border-radius:5px"]);
    cssArray.push([".tweet-content", "margin-bottom:16px"]);
    cssArray.push([".dropdown-toggle", "border-radius:8px"]);
    cssArray.push([".dropdown-toggle:before", "border-radius:8px"]);
    cssArray.push([".Gallery-media", "border-radius:6px"]);
    cssArray.push([".ProfileCardMini-avatarImage", "border-radius:4px"]);
    cssArray.push([".DMAvatar", "border-radius:4px"]);
    cssArray.push([".avatar--circular", "border-radius:4px"]);
    // get rid of those circles! (2019 layout)
    cssArray.push([".r-sdzlij", "border-radius:4px"]);
    // add style to page
    addStyleCSS(cssArray);
})();

I think they broke it again - I'm getting a faint circular overlay on the mini-avatar of mine in the top-right of the Twitter UI. I got that before, but only because I had a conflicting userscript installed, which I since removed and, at that time, fixed the issue.

I'm not 100% sure, since my Firefox session is a bit borked, but I think this has broken again. I'm still using it, and it's been working with GoodTwitter for ages, but as of this morning the circles reappeared...

Thanks for continuing to maintain this! Surely I can't be the only user of this, but I've recently been having problems with this userscript in terms of reliability. Sometimes when I reload the page, the squares work fine, but other times I refresh the page, it's circles. It seems more or less random, so I wonder whether there's some kind of race condition happening? I see this issue in Firefox with violentmonkey on multiple machines. Have you noticed this behaviour yourself? Is there anything I could do to help find this?

I've experienced this a few times but not recently. I use Google Chrome and more often use TweetDeck rather than Twitter itself and it never seems to happen on there. Whenever I witnessed this behaviour, it seemed to be when the site was taking too long to load. One thing you can try is in the header section of the script, change the run-at from document-start to one of the other accepted values. You can find a description of the values at the link below.

https://www.tampermonkey.net/documentation.php#_run_at

Aha! "Document Body" seems to have fixed it for now. My "stress test" is to open 10+ new tabs (by, say, mass opening people's profiles from my geed) and then checking once loaded to see whether the elements are circles or squares. I will keep testing and see whether that remains the case. Thanks a lot!