Greasy Fork is available in English.

X (twitter) responsive + customizations

X (twitter) website is more suitable for wide screens.

/* ==UserStyle==
@name           X (twitter) responsive + customizations
@version        1.0.7
@description    X (twitter) website is more suitable for wide screens.
@author         BreatFR (https://breat.fr)
@namespace      https://gitlab.com/breatfr
@homepageURL    https://gitlab.com/breatfr/x-twitter
@supportURL     https://discord.gg/Q8KSHzdBxs
@license        AGPL-3.0-or-later; https://www.gnu.org/licenses/agpl-3.0.txt
@preprocessor   stylus

@var checkbox   hidemessages        "Hide messages"         0
@var checkbox   hidepremium         "Hide premium"          1
@var checkbox   hidesidebarleft     "Hide sidebar on left"  0
@var checkbox   hidesidebarright    "Hide sidebar on right" 0
@var checkbox   logocentred         "Logo centred"          1
@var select     previewtype         "Preview type"          {
    "Contain + Blur": "previewtypecontainblur",
    "Contain": "previewtypecontain",
    "Cover": "previewtypecover"
}
@var checkbox   oldlogo             "Old logo"              0
@var checkbox   widemode            "Wide mode"             1
==/UserStyle== */

/* === Credits ===
Website         https://breat.fr
facebook        https://www.facebook.com/breatfroff
mastodon        https://mastodon.social/@breat_fr
telegram        https://t.me/breatfr
vk              https://vk.com/breatfroff
X (twitter)     https://x.com/breatfroff
=== Credits === */

@-moz-document domain("x.com") {  
    /* ===================================================================================================================================
    Version
=================================================================================================================================== */
    :root {
        --themeversion: 'Theme v1.0.7';
        --author: 'by BreatFR';
        --link: ' gitlab.com/breatfr/x-twitter ';
    }

    header > div > div > div > div.css-175oi2r.r-1habvwh::after {
        background: linear-gradient(88.55deg, rgb(139, 109, 255) 22.43%, rgb(254, 132, 132) 92.28%);
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        content: var(--themeversion) ' · ' var(--author) '\A' url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBoZWlnaHQ9IjIwIiB3aWR0aD0iMjAiIHN0eWxlPSJ0cmFuc2Zvcm06IHNjYWxlWSgtMSk7Ij48IS0tIUZvbnQgQXdlc29tZSBGcmVlIDYuNS4xIGJ5IEBmb250YXdlc29tZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tIExpY2Vuc2UgLSBodHRwczovL2ZvbnRhd2Vzb21lLmNvbS9saWNlbnNlL2ZyZWUgQ29weXJpZ2h0IDIwMjQgRm9udGljb25zLCBJbmMuLS0+PHBhdGggZmlsbD0iI2NiY2JjYiIgZD0iTTMwNyAzNC44Yy0xMS41IDUuMS0xOSAxNi42LTE5IDI5LjJ2NjRIMTc2Qzc4LjggMTI4IDAgMjA2LjggMCAzMDRDMCA0MTcuMyA4MS41IDQ2Ny45IDEwMC4yIDQ3OC4xYzIuNSAxLjQgNS4zIDEuOSA4LjEgMS45YzEwLjkgMCAxOS43LTguOSAxOS43LTE5LjdjMC03LjUtNC4zLTE0LjQtOS44LTE5LjVDMTA4LjggNDMxLjkgOTYgNDE0LjQgOTYgMzg0YzAtNTMgNDMtOTYgOTYtOTZoOTZ2NjRjMCAxMi42IDcuNCAyNC4xIDE5IDI5LjJzMjUgMyAzNC40LTUuNGwxNjAtMTQ0YzYuNy02LjEgMTAuNi0xNC43IDEwLjYtMjMuOHMtMy44LTE3LjctMTAuNi0yMy44bC0xNjAtMTQ0Yy05LjQtOC41LTIyLjktMTAuNi0zNC40LTUuNHoiLz48L3N2Zz4=") var(--link) url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBoZWlnaHQ9IjIwIiB3aWR0aD0iMjAiIHRyYW5zZm9ybT0icm90YXRlKDE4MCkiPjwhLS0hRm9udCBBd2Vzb21lIEZyZWUgNi41LjEgYnkgQGZvbnRhd2Vzb21lIC0gaHR0cHM6Ly9mb250YXdlc29tZS5jb20gTGljZW5zZSAtIGh0dHBzOi8vZm9udGF3ZXNvbWUuY29tL2xpY2Vuc2UvZnJlZSBDb3B5cmlnaHQgMjAyNCBGb250aWNvbnMsIEluYy4tLT48cGF0aCBmaWxsPSIjY2JjYmNiIiBkPSJNMzA3IDM0LjhjLTExLjUgNS4xLTE5IDE2LjYtMTkgMjkuMnY2NEgxNzZDNzguOCAxMjggMCAyMDYuOCAwIDMwNEMwIDQxNy4zIDgxLjUgNDY3LjkgMTAwLjIgNDc4LjFjMi41IDEuNCA1LjMgMS45IDguMSAxLjljMTAuOSAwIDE5LjctOC45IDE5LjctMTkuN2MwLTcuNS00LjMtMTQuNC05LjgtMTkuNUMxMDguOCA0MzEuOSA5NiA0MTQuNCA5NiAzODRjMC01MyA0My05NiA5Ni05Nmg5NnY2NGMwIDEyLjYgNy40IDI0LjEgMTkgMjkuMnMyNSAzIDM0LjQtNS40bDE2MC0xNDRjNi43LTYuMSAxMC42LTE0LjcgMTAuNi0yMy44cy0zLjgtMTcuNy0xMC42LTIzLjhsLTE2MC0xNDRjLTkuNC04LjUtMjIuOS0xMC42LTM0LjQtNS40eiIvPjwvc3ZnPg==") ;
        bottom: -15%;
        display: flex;
        flex-direction: column;
        font-size: 18px;
        left: 0;
        position: absolute;
        text-align: center;
        width: max-content;
        white-space: pre-line;
    }
/* ===================================================================================================================================
    Hide scrollbars
=================================================================================================================================== */
    * {
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }
    ::-webkit-scrollbar {
        height: 0 !important;
        width: 0 !important;
    }
    
/* ===================================================================================================================================
    Header
=================================================================================================================================== */
    header {
        align-items: flex-start !important;
        flex-grow: 0 !important;
        margin-left: -3% !important;
        max-width: 335px !important;
        -webkit-box-align: start !important;
    }
    
    /* Logo */
    if logocentred {
        #react-root > div > div > div.css-175oi2r.r-1f2l425.r-13qz1uu.r-417010.r-18u37iz > header > div > div > div > div.css-175oi2r.r-1habvwh > div.css-175oi2r.r-dnmrzs.r-1559e4e {
            transform: translateX(195%);
            
        }
    }    
    
    if oldlogo {
        div[data-testid=interstitialGraphic] svg.r-13v1u17,
        h1 > a[href="/home"] svg,
        svg[aria-label="Twitter"],
        #placeholder svg {
            background-color: rgb(29, 155, 240);
            fill: none;
            mask-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIGNsYXNzPSJyLTEzdjF1MTcgci00cXRxcDkgci15eXl5b28gci0xNnkydW94IHItOGt6MGdrIHItZG5tcnpzIHItYm53cWltIHItMXBsY3J1aSByLWxydmliciByLWxyc2xscCIgdmlld0JveD0iMCAwIDI0IDI0Ij48Zz48cGF0aCBkPSJNMjMuNjQzIDQuOTM3Yy0uODM1LjM3LTEuNzMyLjYyLTIuNjc1LjczM2E0LjY3IDQuNjcgMCAwIDAgMi4wNDgtMi41NzggOS4zIDkuMyAwIDAgMS0yLjk1OCAxLjEzIDQuNjYgNC42NiAwIDAgMC03LjkzOCA0LjI1IDEzLjIyOSAxMy4yMjkgMCAwIDEtOS42MDItNC44NjhjLS40LjY5LS42MyAxLjQ5LS42MyAyLjM0MkE0LjY2IDQuNjYgMCAwIDAgMy45NiA5LjgyNGE0LjY0NyA0LjY0NyAwIDAgMS0yLjExLS41ODN2LjA2YTQuNjYgNC42NiAwIDAgMCAzLjczNyA0LjU2OCA0LjY5MiA0LjY5MiAwIDAgMS0yLjEwNC4wOCA0LjY2MSA0LjY2MSAwIDAgMCA0LjM1MiAzLjIzNCA5LjM0OCA5LjM0OCAwIDAgMS01Ljc4NiAxLjk5NSA5LjUgOS41IDAgMCAxLTEuMTEyLS4wNjUgMTMuMTc1IDEzLjE3NSAwIDAgMCA3LjE0IDIuMDkzYzguNTcgMCAxMy4yNTUtNy4wOTggMTMuMjU1LTEzLjI1NCAwLS4yLS4wMDUtLjQwMi0uMDE0LS42MDJhOS40NyA5LjQ3IDAgMCAwIDIuMzIzLTIuNDF6Ii8+PC9nPjwvc3ZnPg==');
            -webkit-mask-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIGNsYXNzPSJyLTEzdjF1MTcgci00cXRxcDkgci15eXl5b28gci0xNnkydW94IHItOGt6MGdrIHItZG5tcnpzIHItYm53cWltIHItMXBsY3J1aSByLWxydmliciByLWxyc2xscCIgdmlld0JveD0iMCAwIDI0IDI0Ij48Zz48cGF0aCBkPSJNMjMuNjQzIDQuOTM3Yy0uODM1LjM3LTEuNzMyLjYyLTIuNjc1LjczM2E0LjY3IDQuNjcgMCAwIDAgMi4wNDgtMi41NzggOS4zIDkuMyAwIDAgMS0yLjk1OCAxLjEzIDQuNjYgNC42NiAwIDAgMC03LjkzOCA0LjI1IDEzLjIyOSAxMy4yMjkgMCAwIDEtOS42MDItNC44NjhjLS40LjY5LS42MyAxLjQ5LS42MyAyLjM0MkE0LjY2IDQuNjYgMCAwIDAgMy45NiA5LjgyNGE0LjY0NyA0LjY0NyAwIDAgMS0yLjExLS41ODN2LjA2YTQuNjYgNC42NiAwIDAgMCAzLjczNyA0LjU2OCA0LjY5MiA0LjY5MiAwIDAgMS0yLjEwNC4wOCA0LjY2MSA0LjY2MSAwIDAgMCA0LjM1MiAzLjIzNCA5LjM0OCA5LjM0OCAwIDAgMS01Ljc4NiAxLjk5NSA5LjUgOS41IDAgMCAxLTEuMTEyLS4wNjUgMTMuMTc1IDEzLjE3NSAwIDAgMCA3LjE0IDIuMDkzYzguNTcgMCAxMy4yNTUtNy4wOTggMTMuMjU1LTEzLjI1NCAwLS4yLS4wMDUtLjQwMi0uMDE0LS42MDJhOS40NyA5LjQ3IDAgMCAwIDIuMzIzLTIuNDF6Ii8+PC9nPjwvc3ZnPg==');
            mask-position: center;
            mask-repeat: no-repeat;
            -webkit-mask-position: center;
            -webkit-mask-repeat: no-repeat;
        }
    }
    
/* ===================================================================================================================================
    Wide mode
=================================================================================================================================== */
    if widemode {
        main > div {
            width: 100% !important;
        }
        [data-testid="primaryColumn"] {
            max-width: calc(100% - 370px) !important;
        }
        [data-testid="sidebarColumn"] {
            margin-right: 10px !important;
            max-width: 350px;
        }
    }

/* ===================================================================================================================================
    Photos/Videos
=================================================================================================================================== */    
    [data-testid="cellInnerDiv"] {
        .css-175oi2r.r-1adg3ll.r-1udh08x {
            height: auto !important;
            width: 100% !important;
        }
        a[href*="https://pbs.twimg.com/media/"] > div {
            align-items: center !important;
            height: 100% !important;
            min-width: 100% !important;
        }
        .r-k200y {
            align-self: unset;
        }
    }
    .r-1ye8kvj {
        max-width: 100%;
    }

/* ===================================================================================================================================
    Preview type
=================================================================================================================================== */
        if (previewtype=="previewtypecontainblur") {
            img.css-9pa8cd {
                backdrop-filter: blur(100px);
                -o-backdrop-filter: blur(100px);
                -moz-backdrop-filter: blur(100px);
                -ms-backdrop-filter: blur(100px);
                -webkit-backdrop-filter: blur(100px);
                object-fit: contain;
                opacity: 1;
            }
        }
        if (previewtype=="previewtypecontain") {
            img.css-9pa8cd {
                object-fit: contain;
                opacity: 1;
            }
            .r-vvn4in {
                background: none !important;
            }
        }
        if (previewtype=="previewtypecover") {
            img.css-9pa8cd {
                object-fit: cover;
                opacity: 1;
            }
        }
    
    /* Make images/videos start under avatar */
    .css-175oi2r.r-9aw3ui.r-1s2bzr4 {
        margin-left: -50px;
    }
    
/* ===================================================================================================================================
    Hide messages
=================================================================================================================================== */
    if hidemessages {
        [style="position: absolute; bottom: 0px; width: 100%; transition: transform 300ms ease 0s; transform: translateY(0px);"] {
            display: none;
        }
    }
    
/* ===================================================================================================================================
    Hide premium
=================================================================================================================================== */
    if hidepremium {
        [aria-label="Premium"],
        a[href="/i/premium_sign_up"],
        a[href="/i/verified-choose"],
        a[href="/i/verified-orgs-signup"],
        .css-175oi2r.r-1hycxz.r-gtdqiz > div > div > div > div:nth-child(3),
        .r-uaa2di {
            display: none !important;
        }
    }

/* ===================================================================================================================================
    Hide sidebar on left
=================================================================================================================================== */
    if hidesidebarleft {
        header[role="banner"] {
            display: none;
        }
    }

/* ===================================================================================================================================
    Hide sidebar on right
=================================================================================================================================== */
    if hidesidebarright {
        [data-testid="sidebarColumn"] {
           display: none;
        }
        [data-testid="primaryColumn"] {
            max-width: 100% !important;
        }
        [data-testid="cellInnerDiv"] {
            .css-175oi2r.r-1adg3ll.r-1udh08x {
                height: auto !important;
                width: 100% !important;
            }
            a[href*="https://pbs.twimg.com/media/"] > div {
                height: 100% !important;
                min-width: 100% !important;
            }
            .r-k200y {
                align-self: unset;
            }
        }
    }
}

@-moz-document url-prefix("https://x.com/i/communities/suggested") {
/* ===================================================================================================================================
    Fix suggested communities view
=================================================================================================================================== */
    .css-175oi2r.r-1q9bdsx.r-1b7u577.r-1udh08x.r-7bouqp,
    .css-175oi2r.r-1adg3ll.r-1udh08x {
        height: 96px !important;
        width: 96.95px !important;
    }
    img.css-9pa8cd {
        min-height: 96px !important;
        max-width: 96.95px !important;
    }
}

@-moz-document url-prefix("https://x.com/settings/") {
/* ===================================================================================================================================
    Fix account view
=================================================================================================================================== */
    [aria-labelledby="root-header"] {
        min-width: fit-content !important;
    }
}

@-moz-document url-prefix("https://devcommunity.x.com/") {
    .menu-panel.drop-down {
        left: 0% !important;
    }
}

@-moz-document regexp("https:\\/\\/x\\.com\\/[^\\/]+\\/status\\/[^\\/]+") {
    /* Make images/videos start under avatar */
    .css-175oi2r.r-9aw3ui.r-1s2bzr4 {
        margin-left: 0 !important;
    }
}