Skip to content

Twitter 2013 for OldTwitter by melongirl

Screenshot of Twitter 2013 for OldTwitter

Details

Authormelongirl

LicenseNo License

Categorytwitter

Created

Updated

Size169 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

an attempt at recreating twitter's 2013 website while using oldtwitter as a base!

Notes

readme!!

you need oldtwitter to use this!!! this won't work on normal twitter/x

if on firefox esr or any older version of firefox before late 2023: go to about:config and toggle layout.css.has-selector.enabled to true!!!

it'll still look weird in some spots though because firefox before then was weird. sorry!

not compatible with phones

(sorry!)

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           twitter 2013 4 oldtwitter
@namespace      github.com/openstyles/stylus
@version        1.3.9
@description    oh my olds
@author         melo
@var select bg "🖼️ | Theme" {
    "Nothing": "null",
    "Theme 1*": "theme1",
    "Theme 2": "theme2",
    "Theme 3": "theme3",
    "Theme 4": "theme4",
    "Theme 5": "theme5",
    "Theme 6": "theme6",
    "Theme 7": "theme7",
    "Theme 8": "theme8",
    "Theme 9": "theme9",
    "Theme 10": "theme10",
    "Theme 11": "theme11",
    "Theme 12": "theme12",
    "Theme 13": "theme13",
    "Theme 14": "theme14",
    "Theme 15": "theme15",
    "Theme 16": "theme16",
    "Theme 17": "theme17",
    "Theme 18": "theme18",
    "Theme 19": "theme19",
    "Theme 20": "theme20",
    "Pride": "ctheme1",
    "Twitter": "ctheme2"
}
@var checkbox rite "🖼️ | Hide right side bar" 1
@var checkbox fav "🖼️ | Hide Profile Favorites" 1
@var checkbox counter "🖼️ | Hide like, retweet and reply count on tweets" 1
@var checkbox bm "🖼️ | Hide Bookmark Button on Tweets" 1
@var checkbox reply "🖼️ | Hide Reply Counter on Tweets" 1
@var checkbox interact "🖼️ | Display interaction buttons above media" 1
@var checkbox userpop "🖼️ | Hide user popup modal" 1
@var checkbox contain "🖼️ | Remove container background" 0
@var checkbox larry "🖼️ | Use 2011 logo" 0
@var checkbox pfps "🖼️ | Use Twitter profile pictures for X branded accounts" 1
@preprocessor   stylus
==/UserStyle== */

@-moz-document domain("x.com"), domain("twitter.com") {
    /* twitter 2013 4 oldtwitter, made with love by melo 💜💛 */
    #loading-box {
        background-image: url("https://pbs.twimg.com/media/GN_qUA9XgAAooja.png");
        background-attachment: fixed;
        background-repeat: repeat;
    }
    #loading-box-text:before {
        content: "";
        background-image: url("https://pbs.twimg.com/media/GN_paFsWQAAW6xb.png");
        width: 72px;
        display: inline-block;
        height: 72px;
        margin-left: 0;
        margin-bottom: 20px;
        if larry {
            background-image: url("https://pbs.twimg.com/media/GN_pWMyW4AAaChf.png");
        }
    }
    #loading-box-error {
        color: white!important;
        text-shadow: 0 1px 0 #0d0d0d;
        font-weight: bold;
    }
    body:has(#profile-banner-sticky) #loading-box {
        top: 0;
    }
    #navbar {
        background-image: url(https://abs.twimg.com/a/1381432172/t1/img/twitter_web_sprite_bgs.png);
        background-position: 0 0;
        background-color: #252525;
        height: 40px;
        box-shadow: 0 2px 3px rgba(0,0,0,.25);
        border-bottom: 0;
    }
    #navbar-container {
        height: 40px;
    }
    #navbar-line {
        display: none;
    }
    #container:not(.app-columns-container), .container {
        background: url(https://abs.twimg.com/a/1381432172/t1/img/wash-white-30.png);
        padding-right: 15px;
    }
    .body-dark:not(.body-light) #container:not(.app-columns-container), .body-dark:not(.body-light) .container {
        background: url(https://abs.twimg.com/a/1381432172/t1/img/wash-black-40.png);
    }
    if contain {
        #container:not(.app-columns-container), .container {
            background: none!important;
        }
    }
    #twitter-logo {
        width: 24px;
        height: 21px;
        display: inline-block;
        padding-left: 0;
        background-position:-40px 0;
        background-image: var(--sprite);
        if larry {
            background-image: url(https://pbs.twimg.com/media/GN-kOGhWoAEyU5w.png);
            background-position: 0px 0;
            width: 33px;
            height: 25px;
            top: -2px;
        }
    }
    #navbar-right {
        bottom: 42px;
        if larry {
            bottom: 46px;
        }
    }
    #twitter-logo:before {
        display: none;
    }
    #navbar-links a {
        color: #bbb!important;
        text-shadow: 0 -1px 1px rgba(0,0,0,.75);
        font-weight: bold;
        box-shadow: none!important;
        top: 4px;
        padding-bottom: 12px!important;
    }
    #search-input {
        color: #444!important;
        background-color: #ccc!important;
        box-shadow: inset 0 1px 2px rgba(0,0,0,.2)!important;
        border-radius: 13px;
        border: none;
        padding: 6px 27px 6px 12px;
        width: 202px;
        height: 26px;
        transition: all .2s ease-in-out;
    }
    #search-icon {
        width: 26px;
        height: 26px;
        right: 2px;
    }
    #navbar-links a::before {
        content: ""!important;
        top: 4px;
        position: relative;
    }
    #search-icon:before {
        content: "";
        display: inline-block;
        width: 12px;
        height: 14px;
        background-image: var(--sprite);
        background-position: -20px -710px;
    }
    #pin-lists, #pin-bookmarks, #pin-profile {
        background-color: transparent;
    }
    #navbar-links a.menu-active {
        background-image: url(https://abs.twimg.com/a/1381432172/t1/img/twitter_web_sprite_bgs.png);
        background-position:0 -50px;
        box-shadow:inset 0 5px 10px rgba(0,0,0,.5) !important;
    }
    #navbar-links a:hover, #navbar-links a:focus {
        transition: none;
    }
    #navbar-links a.menu-active, #navbar-links a:hover, #navbar-links a:focus {
        color: white!important;
    }
    #home:before {
	    content: ""!important;
        background-image: var(--sprite);
        background-position:0 -50px;
        width:21px;
        height: 24px;
        display: inline-block;
    }
    #navbar-links #home:hover:before, #navbar-links #home:focus:before {
        background-position:0 -80px;
    }
    .menu-active#home:before {
        background-position:0 -110px!important;
    }
    #notifications:before {
        content: "";
        background-image: var(--sprite);
        background-position: -80px -50px;
        width: 22px;
        height: 24px;
        display: inline-block;
    }
    #navbar-links #notifications:hover:before, #navbar-links #notifications:focus:before {
        background-position:-80px -80px;
    }
    .menu-active#notifications:before {
        background-position:-80px -110px!important;
    }
    #messages:before {
        content: "" !important;
        background-image: url("https://abs.twimg.com/a/1383245068/t1/img/messages.png");
        background-position: 0 0;
        width: 21px;
        height: 16px;
        display: inline-block;
        top: 0 !important;
    }
    #navbar-links #messages:hover:before, #navbar-links #messages:focus:before {
        background-position: 0 -15px;
    }
    #pin-profile:before {
	    content: ""!important;
        background-image: var(--sprite);
        background-position:-120px -50px;
        width:21px;
        height: 24px;
        display: inline-block;
    }
    #pin-bookmarks:before, #pin-lists:before {
        display: none;
    }
    #navbar-links #pin-profile:hover:before, #navbar-links #pin-profile:focus:before {
        background-position:-120px -80px;
    }
    .menu-active#pin-profile:before {
        background-position:-120px -110px!important;
    }
    #navbar-tweet-button {
        background-image: url(https://abs.twimg.com/a/1381432172/t1/img/twitter_web_sprite_bgs.png);
        background-repeat:repeat-x;
        background-position:0 -140px;
        background-color:#2c77ba;
        padding: 3px 4px 5px 10px;
        box-shadow: inset 0 1px 0 rgba(255,255,255,.15);
        text-shadow: 0 -1px 1px rgba(0,0,0,.3);
        border-color: #111;
        border-radius: 4px;
        height: 30px;
        position: relative;
        top: -2px;
    }
    #navbar-tweet-button:hover {
        background-position:0 -170px;
        background-color:#1D68A7;
        filter: none;
    }
    #navbar-tweet-button:active {
        background-position:0 -200px;
        background-color: #3D8FD8;
        filter: none;
    }
    #navbar-tweet-button:before {
	    content: ""!important;
        background-image: var(--sprite);
        background-position:-200px -50px;
        width:22px;
        height:18px;
        display: inline-block;
        margin-right: 1px;
    }
    #navbar-tweet-button-text, #navbar-tweet-highlight {
        display: none;
    }
    #navbar-user {
        margin-top: -3px;
    }
    #navbar-right #navbar-user:after {
        background-image: var(--sprite);
        content: "";
        background-position:-240px -50px;
        width:2px;
        height:32px;
        display: inline-block;
        margin-left: 5px;
    }
    #navbar-right #navbar-user:before {
        background-image: var(--sprite);
        content: "";
        background-position:-240px -50px;
        width:2px;
        height:32px;
        display: inline-block;
        margin-right: 5px;
    }
    .dropdown-menu, #search-results {
        box-shadow: 0 5px 10px rgba(0,0,0,.2);
        border: 1px solid rgba(0,0,0,.2);
        margin: 2px 0 0;
        border-radius: 4px;
    }
    #search-results {
        width: 200px;
        margin-top: 9px;
        padding: 7px 0;
    }
    .search-result-item {
        padding: 4px 15px 4px 24px!important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 12px;
    }
    .search-result-item:before {
        content: "";
        vertical-align: text-top;
        display: inline-block;
        background-image: var(--sprite);
        background-repeat: no-repeat;
        width: 12px;
        height: 14px;
        background-position: -40px -710px;
        margin: -1px 4px 0 0;
    }
    .search-result-item:hover:before {
        background-position: -60px -710px;
    }
    .body-dark:not(.body-light) .search-result-item:hover:before {
        filter: invert(1);
    }
    .search-result-item:has(.search-result-item-avatar):before {
        display: none;
    }
    .search-result-item-avatar {
        background-color: var(--background-color);
        width: 24px;
        height: 24px;
        border-radius: 3px!impo...

Reviews

No reviews yet.