Skip to content

Instantly share code, notes, and snippets.

@nerdfiles
Last active January 2, 2023 02:59
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save nerdfiles/ad041bc46da6b0e6c2454bf35aa242af to your computer and use it in GitHub Desktop.
Save nerdfiles/ad041bc46da6b0e6c2454bf35aa242af to your computer and use it in GitHub Desktop.
personal twitter.com userstyles; note). i'm only using this on the homepage. i have a different style for hiding follower count information.
/**
* @appliesTo URLsStartingWith https://twitter.com/home
* @description use the extension for ff: https://mybrowseraddon.com/custom-style-script.html.
*/
body:before {
/*background-image: url(https://black-mode.surge.sh/fc5f1febeb2f5f83.png) !important;*/
background-repeat: no-repeat !important;
background-size: 100% !important;
width: 100%;
height: 100%;
content: ' ';
display: block;
z-index: -1;
position: fixed;
bottom: 0;
}
body:before {
background-image: url(https://black-mode.surge.sh/97b6c51ddf48c0d0.png) !important; /* library of [redacted] */
background-image: url(https://black-mode.surge.sh/fc5f1febeb2f5f83.png) !important; /* forest library */
background-image: url(https://black-mode.surge.sh/tumblr_1b8cd67f6a9542cb27360bab5a34318e_4bc87e44_1280.jpg) !important;
background-size: cover !important;
background-position: bottom left !important;
}
[data-testid="cellInnerDiv"]:nth-child(2n+1):after,
div:has([data-testid="tweet"]):nth-child(2n+1):after {
display: block; content: ' '; width: 10vw; height: 10vw;
position: absolute; left: -2vw; bottom: 0; z-index: -1;
background-image: url(https://black-mode.surge.sh/PNGPIX-COM-Comic-Speech-Bubble-PNG-Image_2.png) !important;
background-size: contain !important;
background-position: bottom left !important;
opacity: 0.4;
}
[data-testid="cellInnerDiv"]:nth-child(3n+1):after,
div:has([data-testid="tweet"]):nth-child(2n+1):after {
display: block; content: ' '; width: 10vw; height: 10vw;
position: absolute; left: -2vw; bottom: 0; z-index: -1;
background-image: url(https://black-mode.surge.sh/PNGPIX-COM-Speech-Bubble-PNG-Transparent-Image-6.png) !important;
background-size: contain !important;
background-position: bottom left !important;
opacity: 0.2;
}
[data-testid="cellInnerDiv"]:nth-child(4n+1):after,
div:has([data-testid="tweet"]):nth-child(1n+1):after {
display: block; content: ' '; width: 10vw; height: 10vw;
position: absolute; left: -2vw; bottom: 0; z-index: -1;
background-image: url(https://black-mode.surge.sh/PNGPIX-COM-Speech-Bubble-PNG-Transparent-Image-6.png) !important;
background-size: contain !important;
background-position: bottom left !important;
mix-blend-mode: pulse-lighter;
opacity: 0.2;
}
[data-testid="cellInnerDiv"]:nth-child(2n+1):after {
display: block; content: ' '; width: 10vw; height: 10vw;
position: absolute; left: -2vw; bottom: 0; z-index: -1;
background-image: url(https://black-mode.surge.sh/comic-book-speech-bubble-transparent-2.png) !important;
background-size: contain !important;
background-position: bottom left !important;
opacity: 0.8;
}
[data-testid="cellInnerDiv"]:nth-child(2n+2):after {
display: block; content: ' '; width: 10vw; height: 10vw;
position: absolute; left: -2vw; bottom: 0; z-index: -1;
background-image: url(https://black-mode.surge.sh/PNGPIX-COM-Comic-Speech-Bubble-PNG-Image_2.png) !important;
background-size: contain !important;
background-position: bottom left !important;
opacity: 0.8;
}
div:has([data-testid="tweet"]) {
}
/* EOF */
/**
* @filepath ./stylish/home--tweaks__initiative__.css
* @description it reveals more as you scroll down and right. huds everywhere.
* @author aha <patagnome@protonmail.com>
* @license wtfpl, version 2
* @version 0.0.0-novel.0
* @note turn on `layout.css.has-selector.enabled` in firefox.
* @kind initiative
* @appliesTo URLsStartingWith https://twitter.com/home
* @appliesTo URLsStartingWith https://twitter.com/notifications
* @appliesTo URLsStartingWith https://twitter.com/i/lists
* @appliesTo URLsStartingWith https://twitter.com/{username}{?/lists}
* @appliesTo URLsStartingWith https://twitter.com/explore
* @appliesTo URLsStartingWith https://twitter.com/i/bookmarks
* @appliesTo URLsStartingWith https://twitter.com/i/timeline
* @appliesTo URLsStartingWith https://twitter.com/search
* @appliesTo URLsMatchingTheRegexp https://twitter.com/((?!messages)[\s\S])*$
* @appliesTo URLsMatchingTheRegexp https://twitter.com/messages/compose
*/
[data-testid="cellInnerDiv"]:has(img):hover {
opacity: 1 !important;
z-index: 9001 !important;
position: relative;
}
[data-testid="cellInnerDiv"]:first-child {
height: 200vw !important;
background-color: rgba(0, 0, 0, 0.5) !important;
display: block !important;
clip: rect(0, 50vw, 50vw, 0) !important;
overflow: hidden !important;
z-index: 9001 !important;
animation: ease-in-out infinite alternate;
animation-name: bighover;
animation-duration: 6s;
}
[data-testid="cellInnerDiv"]:first-child:hover {
overflow: visible !important;
height: 300vw !important;
}
[data-testid="cellInnerDiv"]:first-child img {
opacity: 0.5 !important;
}
*:has([data-testid="cellInnerDiv"]:first-child) [data-testid="cellInnerDiv"]:first-child img {
opacity: 1 !important;
animation: ease-in-out infinite alternate;
animation-name: bighover;
animation-duration: 6s;
}
[data-testid*="HoverCard"] {
background-color: transparent;
}
[data-testid*="HoverCard"] > * > * > * > * > * {
background: linear-gradient(#ed8a12 8.5px, transparent 8.5px) 0px -4.25px / 37px 37px, linear-gradient(90deg, #cd8f12 8.5px, rgba(0, 0, 100, 0.4) 8.5px) -4.25px 0px / 37px 37px #fbab2f;
}
::selection {
background-color: rgba(0, 0, 0, 0.8);
color: white;
text-shadow: 5px 5px #558abb;
}
/* @description encircle some things */
[role="group"] *:hover {
background-color: transparent;
}
[role="group"] > * > * > * {
/*background: radial-gradient(circle, transparent 20%, #fecb2f 20%, #fecb2f 80%, transparent 80%, transparent) 0% 0% / 74px 74px, radial-gradient(circle, transparent 20%, #fecb2f 20%, #fecb2f 80%, transparent 80%, transparent) 37px 37px / 74px 74px, linear-gradient(#ed8a12 8.5px, transparent 8.5px) 0px -4.25px / 37px 37px, linear-gradient(90deg, #ed8a12 8.5px, #fecb2f 8.5px) -4.25px 0px / 37px 37px #fecb2f;*/
border-radius: 100vw;
overflow: visible;
}
/**
@description add using https://mybrowseraddon.com/custom-style-script.html
body:before {
background-repeat: no-repeat !important;
background-size: 100% !important;
width: 100%;
height: 100%;
content: ' ';
display: block;
z-index: -1;
position: fixed;
bottom: 0;
}
body:before {
background-image: url(https://black-mode.surge.sh/97b6c51ddf48c0d0.png) !important;
background-image: url(https://black-mode.surge.sh/fc5f1febeb2f5f83.png) !important;
background-size: cover !important;
background-position: bottom left !important;
}
*/
[aria-label="Timeline: Tweets"] {
outline: 3px dotted rgba(0, 0, 0, 0.3) !important;
display: flex !important;
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
grid-template-rows: repeat(5, 1fr) !important;
grid-column-gap: 0px !important;
grid-row-gap: 0px !important;
overflow: scroll !important;
}
[aria-label="Timeline: Tweets"] > * {
outline: 3px dotted rgba(0, 0, 0, 0.3) !important;
display: flex !important;
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
grid-template-rows: repeat(5, 1fr) !important;
grid-column-gap: 0px !important;
grid-row-gap: 0px !important;
overflow: scroll !important;
}
[aria-label="Timeline: Tweets"] > * > * {
outline: 3px dotted rgba(0, 0, 0, 0.3) !important;
display: flex !important;
display: grid !important;
grid-template-columns: repeat(4, 1fr) !important;
grid-template-rows: repeat(5, 1fr) !important;
grid-column-gap: 0px !important;
grid-row-gap: 0px !important;
overflow: scroll !important;
}
[data-testid="cellInnerDiv"] {
outline: 3px dotted rgba(0, 0, 0, 0.3) !important;
display: flex !important;
transform: none !important;
width: 40% !important;
height: 50% !important;
padding-right: 10% !important;
position: relative !important;
width: 50vw !important;
min-height: 15vw !important;
max-height: 30vw !important;
}
[aria-label*="Timeline"] > div {
min-height: 50% !important;
overflow: scroll;
flex-wrap: wrap !important;
}
/*div > * > * > * > * > :nth-child(1),*/
[aria-label*="Timeline"] > div {
display: flex !important;
outline: 3px dotted rgba(0, 0, 0, 1) !important;
filter: hue-rotate(100%) !important;
flex-direction: row;
display: grid !important;
grid-template-columns: repeat(5, 2fr) !important;
grid-template-rows: repeat(5, 1fr) !important;
grid-column-gap: 0px !important;
grid-row-gap: 0px !important;
overflow: scroll !important;
width: 100vw !important;
}
[data-testid="primaryColumn"] {
max-width: 100vw !important;
}
[aria-label="Home timeline"] > div {
max-width: 100% !important;
}
[title="Image"] {
outline: 3px solid gold !important;
width: 100%;
}
[role="header"],
[role="main"] > div {
width: 100% !important;
}
[data-testid="TopNavBar"] *,
[data-testid="TopNavBar"],
[data-testid="BottomBar"] *,
[data-testid="BottomBar"],
[role="main"] * {
background-color: transparent !important;
}
[aria-label] {
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
a[aria-label]:focus,
a[aria-label]:active,
a[aria-label]:hover {
border-bottom: 1px solid rgba(255, 255, 255, 1);
animation: ease-in-out infinite alternate;
animation-name: livrespairs;
animation-duration: 2s;
}
[role="menu"] * {
background: radial-gradient(circle, transparent 20%, #fecb2f 20%, #fecb2f 80%, transparent 80%, transparent) 0% 0% / 74px 74px, radial-gradient(circle, transparent 20%, #fecb2f 20%, #fecb2f 80%, transparent 80%, transparent) 37px 37px / 74px 74px, linear-gradient(#ed8a12 8.5px, transparent 8.5px) 0px -4.25px / 37px 37px, linear-gradient(90deg, #ed8a12 8.5px, #fecb2f 8.5px) -4.25px 0px / 37px 37px #fecb2f;
background-color: #fecb2f;
}
[role="menu"] {}
/* ## utils */
@-webkit-keyframes revhoverbit {
0% {
transform: translate3d(0px, 0px, 0px);
}
100% {
transform: translate3d(0px, 5px, 0px);
}
}
@-webkit-keyframes hoverbit {
0% {
transform: translateY(0);
}
100% {
transform: translateY(-5%);
}
}
@-webkit-keyframes hoverbit2 {
0% {
top: 0vw;
}
100% {
top: -1vw;
}
}
@-webkit-keyframes fade {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes fadein {
0% {
opacity: 0.8;
}
100% {
opacity: 1;
}
}
@-webkit-keyframes newtweets {
0% {
opacity: 0.35;
transform: scale(1.3) rotate(45deg) skew(20deg) perspective(10px) translate3d(-10px, 0, -5px);
}
100% {
opacity: 0.85;
transform: scale(1.3) rotate(45deg) skew(20deg) perspective(10px) translate3d(-10px, 0, -5px) translate3d(0, -5px, -5px);
}
}
@-webkit-keyframes bighover {
0% {
height: 50vw !important;
overflow: hidden; opacity: 0.8;
}
100% {
height: 200vw !important;
overflow: visible; opacity: 1;
}
}
@-webkit-keyframes livrespairs {
0% {
opacity: 0.35;
transform: translate3d(-10px, 0, -5px);
}
100% {
opacity: 0.85;
transform: translate3d(0, -5px, -5px);
}
}
@-webkit-keyframes upup {
0% {
/*
opacity: 0.85;
transform: translate3d(15px, 0, 0);*/
filter: invert(0);
}
100% {
filter: invert(100%);
/*
opacity: 1;
transform: translate3d(0, 5px, 5px);*/
}
}
@-webkit-keyframes rotate {
0% {
opacity: 0.85;
transform: translate3d(15px, 0, 0);
}
100% {
opacity: 1;
transform: translate3d(0, 5px, 5px);
}
}
svg,
h1, h2, h3, h4, h5, h6,
label,
p, li,
[class],
[aria-label*="Timeline"] *,
[data-testid="cellInnerDiv"] * {
color: #fff;
text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
}
[role="article"]:before {
content: '⌨︎';
position: absolute;
display: block;
transform: rotate(-20deg) scale(10);
opacity: 0.25;
}
[role="article"]:hover:before {
opacity: 1;
animation: ease-in-out infinite alternate;
animation-name: fadein;
animation-duration: 2s;
}
[role="article"] {
min-width: calc(50vw - 15%) !important;
max-width: calc(50vw - 15%) !important;
width: 25vw !important;
}
[role="article"] [role="group"] {
width: 50vw !important;
}
[data-testid="tweetText"] { }
body {
padding-bottom: 25vw !important;;
}
body {
/* Keyword values */
image-rendering: auto;
image-rendering: high-quality;
image-rendering: smooth;
image-rendering: crisp-edges;
image-rendering: pixelated;
/* Global values */
image-rendering: inherit;
image-rendering: initial;
image-rendering: revert;
image-rendering: revert-layer;
image-rendering: unset;
image-rendering: crisp-edges !important;
}
/**
* @description combine at will on tumblr dot com.
* @usage
* (mix|background)-blend-mode: normal;
* (mix|background)-blend-mode: multiply;
* (mix|background)-blend-mode: screen;
* (mix|background)-blend-mode: overlay;
* (mix|background)-blend-mode: darken;
* (mix|background)-blend-mode: lighten;
* (mix|background)-blend-mode: color-dodge;
* (mix|background)-blend-mode: color-burn;
* (mix|background)-blend-mode: hard-light;
* (mix|background)-blend-mode: soft-light;
* (mix|background)-blend-mode: difference;
* (mix|background)-blend-mode: exclusion;
* (mix|background)-blend-mode: hue;
* (mix|background)-blend-mode: saturation;
* (mix|background)-blend-mode: color;
* (mix|background)-blend-mode: luminosity;
*/
body {
mix-blend-mode: normal !important;
}
[aria-label="Home timeline"] > div > div > div > div,
[aria-label="Home timeline"] > div > div > div,
[aria-label="Home timeline"] > div > div,
[aria-label="Home timeline"] > div {
max-width: fit-content !important;
}
[aria-label="Home timeline"] > div,
[data-testid="tweetText"] *,
[data-testid="tweetText"] * *,
[data-testid="tweetText"] {
overflow: visible !important;
}
[role="group"] [role="dialog"] > * {
background-color: rgba(0, 0, 0, 0.25);
}
[aria-modal="true"] > * {
background-color: rgba(0, 0, 0, 0.25);
}
[aria-labelledby="modal-header"] > * {
background-color: rgba(0, 0, 0, 0.25);
}
[aria-labelledby="modal-header"] *,
[role="group"] [role="dialog"] * {
background-color: transparent;
}
/* @description LMAO */
[role="group"] [role="dialog"] * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * {
background-color: rgba(0, 0, 0, 0.25);
}
/* @description DO IT */
[role="alertdialog"] [role="group"] * {
background: radial-gradient(circle, transparent 20%, #fecb2f 20%, #fecb2f 80%, transparent 80%, transparent) 0% 0% / 74px 74px, radial-gradient(circle, transparent 20%, #fecb2f 20%, #fecb2f 80%, transparent 80%, transparent) 37px 37px / 74px 74px, linear-gradient(#ed8a12 8.5px, transparent 8.5px) 0px -4.25px / 37px 37px, linear-gradient(90deg, #ed8a12 8.5px, #fecb2f 8.5px) -4.25px 0px / 37px 37px #fecb2f;
background-color: #fecb2f;
}
[data-testid="UserCell"] {
width: 50vw;
}
/* @description fix for the profile menu's background in larger font-sizes. i'm expecting y'all
* to try increasing the font-size lol.
*/
[role="group"] [role="dialog"] {
background-color: transparent;
border-radius: 0 !important;
}
[aria-label*="Timeline"] > div:after {
content: '⌹';
display: block;
width: 100%;
height: 2vw;
}
[data-testid="cellInnerDiv"]:after {
content: '⌭';
display: block;
text-align: right;
width: 100%;
height: 2vw;
}
[data-testid="cellInnerDiv"]:nth-child(3n+4) [data-testid="tweet"]:after {
content: '🛋';
display: inline-block;
position: absolute;
right: 4vw;
bottom: 2vw;
transform: translateX(2vw) rotate3d(10, 3, 13, -10deg) scale(5);
z-index: -1;
}
[data-testid="cellInnerDiv"] [data-testid="UserCell"] {
}
[data-testid="cellInnerDiv"] [data-testid="UserCell"]:after {
content: '📪 📪 📪';
display: block;
color: white;
position: absolute;
right: 10vw;
bottom: -1vw;
transform: translateX(2vw) rotate3d(10, 3, 13, -10deg) scale(5);
}
[role="link"] {
border-bottom: 3px solid rgba(0, 0, 0, 0.2);
}
/*
[data-testid] [role="article"]:visited:before,
[data-testid] [role="article"]:active:before,
[data-testid] [role="article"]:focus:before,
[data-testid] [role="article"]:hover:before,
[data-testid] [role="link"]:visited:before,
[data-testid] [role="link"]:active:before,
[data-testid] [role="link"]:focus:before,
[data-testid] [role="link"]:hover:before {
content: "";
position: absolute;
top: -10px;
bottom: -10px;
left: -10px;
right: -10px;
z-index: -1;
background: linear-gradient(-45deg, #7765650a 45%, #0b5119 45%, #00000008 55%, #9516160a 55%) 0 0/10px 10px, linear-gradient(-45deg, #0973330a 45%, #354f1614 45%, #48844014 55%, #113e0a03 55%) 5px 0px/10px 10px;
background-image: radial-gradient(circle at center center, #507a4a, #7c6795), repeating-radial-gradient(circle at center center, #507a4a, #148a45, 65px, transparent 130px, transparent 65px);
background-blend-mode: color-burn;
opacity: 0.05;
}
*/
svg {
filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 1));
}
/* @note idfk yet. only applies to list pages like "i/timeline" or */
* > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > *:has([src*="card"]) {
opacity: 0.8;
}
* > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > *:has([src*="profile"]) {
opacity: 0.8;
}
* > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > * > *:has([src*="media"]) {
opacity: 0.8;
}
[data-testid="tweetPhoto"] div {
opacity: 0.8;
}
[data-testid="tweetPhoto"]:hover div,
*:has([src*="card"]):hover,
*:has([src*="profile"]):hover,
*:has([src*="media"]):hover {
opacity: 1 !important;
}
[role="button"] {}
[aria-label*="New Tweets are available"] * {
color: rgba(0, 150, 255, 1) !important;
}
[aria-label*="New Tweets are available"] span {
overflow: visible;
}
[aria-label*="New Tweets are available"] span:after {
content: '🏷';
font-size: 2rem;
transform: scale(1.3) rotate(45deg) skew(20deg) perspective(10px);
width: 2vw;
height: 2vw;
position: absolute;
padding-left: 1vw;
animation: ease-in-out infinite alternate;
animation-name: newtweets;
animation-duration: 2s;
}
[data-testid="tweetTextarea_0RichTextInputContainer"] {
max-width: 35vw;
}
[data-testid="tweetPhoto"] {
/*filter: saturate(1.5) drop-shadow(1px 1px 10px rgba(0, 0, 0, 0.3)) contrast(1.5) hue-rotate(-340deg);*/
}
/* EOF */
/**
* @filepath ./twitter--no-replies__notifications__.css
* @license wtfpl, version 2
* @author aha <patagnome@protonmail.com>
* @descriptions no replies for you!
* @appliesTo URL https://twitter.com/notifications
*/
[data-testid="tweet"] {
display: none !important;
}
/* EOF */
[data-testid="DMDrawer"] {
opacity: 0.25 !important;
display: none !important;
z-index: -1 !important;
position: absolute !important;
left: -9999px !important;
top: 0 !important;
}
/*
* @appliesTo URLsStartingWith https://twitter.com/messages
*/
[aria-label="Profile"] svg {
color: rgba(255, 255, 255, 1);
}
[data-testid="AppTabBar_Profile_Link"] svg {
color: rgba(255, 255, 255, 1);
}
[role="link"] svg {
color: rgba(255, 255, 255, 1);
}
[aria-expanded="false"] svg {
color: rgba(255, 255, 255, 1);
}
[aria-label="More menu items"] svg {
color: rgba(255, 255, 255, 1);
}
[aria-haspopup="menu"] svg {
color: rgba(255, 255, 255, 1);
}
[role="link"] span,
[role="link"] a,
[role="button"] *:not([role="presentation"]),
[role="main"] *:not([role="presentation"]) {
background-color: transparent;
color: white;
text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5);
}
[href="/compose/tweet"] {
display: none !important;
}
[data-testid="BottomBar"] {}
[data-testid="TopNavBar"] {}
[data-testid="TopNavBar"] *,
[data-testid="BottomBar"] *,
[data-testid="TopNavBar"],
[data-testid="BottomBar"] {
background-color: transparent !important;
}
a[aria-label*="Messages"],
a[aria-label]:focus,
a[aria-label]:active,
a[aria-label]:hover {
border-bottom: 1px solid rgba(255, 255, 255, 1);
animation: ease-in-out infinite alternate;
animation-name: livrespairs;
animation-duration: 2s;
}
svg {
filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 1));
}
@-webkit-keyframes livrespairs {
0% {
opacity: 0.35;
transform: translate3d(-10px, 0, -5px);
}
100% {
opacity: 0.85;
transform: translate3d(0, -5px, -5px);
}
}
/**
* @filepath ./twitter-no-blue.css
* @description .
*/
a[href*="twitter_blue_sign_up"] {
display: none !important;
}
/*
[href="/notifications/verified"] {
display: none !important;
}
*/
/* hide likes and view count on tweets */
[role="link"][href*="retweets"],
[role="link"][href*="likes"],
[role="link"][href*="analytics"] {
display: none !important;
}
/* at night, hide all the <time> tags */
[role="link"][aria-label*="PM"] {
display: none !important;
}
/* EOF */
/**
* @appliesTo URLsStartingWith https://twitter.com/notifications
*/
/* @description replies and rts are visually muted on /notifications */
[data-testid="cellInnerDiv"] [aria-labelledby] {
opacity: 0.15;
/*display: none !important;*/
}
[data-testid="cellInnerDiv"] [aria-labelledby]:hover {
opacity: 1;
animation: ease-in-out infinite alternate;
animation-name: fade;
animation-duration: 6s;
}
@-webkit-keyframes fade {
0% {
opacity: 0;
}
100% {
opacity: 0.85;
}
}
/**
* @description you'll have to toggle this with the main css document that turns
* everything grid-ish. this is mainly for long twitter threads. e.g.: https://twitter.com/maybeelse/status/1544754877955731457
* why stylish is great: toggle-able stylesheets.
* @appliesTo URLsStartingWith https://twitter.com
*/
[role="region"][aria-labelledby*="accessible-list-28"] {
display: none;
}
[aria-label="Who to follow"] *,
[aria-label="Timeline: Trending now"] *,
[data-testid="primaryColumn"] * {
color: white;
text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5) !important;
}
[class*=".r-"],
* *:has([aria-label="Timeline: Trending now"]),
* *:has([data-testid]),
[data-testid="primaryColumn"] {
background-color: transparent !important;
}
div *:has([aria-level="2"]),
div:has([aria-label="Relevant people"]) {
background-color: transparent !important;
}
[aria-label="Relevant people"] * {
text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5) !important;
color: white !important;
}
div:has([aria-label="Search Twitter"]) {
background-color: transparent !important;
}
::placeholder {
color: white !important;
text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.5) !important;
}
[aria-label="Search Twitter"] input {
color: white !important;
}
[aria-label="Search Twitter"] > div > div {
background-color: transparent !important;
}
[aria-label="Footer"],
.footer,
footer {
filter: invert(100%);
}
svg {
color: white !important;
filter: drop-shadow(1px 1px 1px rgba(0, 0, 0, 0.35));
}
/* EOF */
[role="link"] {}
[role="article"] {}
/**
* i'll keep this application universal so all the blocklist strategies can be more easily shared.
* we're not so much concerned with making a passlist for tlds, but with the tactics and assemblage patterns
* by which we identify, analyze, recognize input specificities and specifications.
*/
/* hides apple.com ads on twitterdotcom's homepage */
[data-testid="tweet"]:has([role="link"][href*="microsoft"]),
[data-testid="tweet"]:has([role="link"][href*="att"]),
[data-testid="tweet"]:has([role="link"][href*="apple"]),
[data-testid="tweet"]:has([role="link"][href*=".com"]),
[data-testid="tweet"]:has([role="link"][href*=".net"]),
[data-testid="tweet"]:has([role="link"][href*=".org"]),
[data-testid="tweet"]:has([role="link"][href*=".gov"]),
[data-testid="tweet"]:has([role="link"][href*="onelink"]),
[data-testid="tweet"]:has([role="link"][href*="peacock"]),
[data-testid="tweet"]:has([role="link"][href*="uber"]),
[data-testid="tweet"]:has([role="link"][href*="Uber"]),
[data-testid="tweet"]:has([href*="peacock.com"]),
[data-testid="tweet"]:has([aria-label*="peacock.com"]),
[data-testid="tweet"]:has([href*="www.apple.com"]),
[data-testid="tweet"]:has([aria-label*="apple.com"]) {
display: none !important;
}
[role="region"] {}
/**
* @appliesTo URL https://twitter.com/home
* @appliesTo URLsMatchingTheRegexp https://twitter.com/([A-Za-z0-9].*)/timeline
* @appliesTo URLsStartingWith https://twitter.com/notifications
* @appliesTo URLsStartingWith https://twitter.com/i/bookmarks
* @appliesTo URLsStartingWith https://twitter.com/explore
*/
/*
[aria-label="Timeline: Your Home Timeline"] > div > div:nth-child(1),
[aria-label="Timeline: Your Home Timeline"] > div > div:nth-child(2) {
display: none !important;
}
*/
div[aria-label="Timeline: Your Lists"] > div > div:nth-child(1),
div[aria-label="Timeline: Your Lists"] > div > div:nth-child(2),
div[aria-label="Timeline: Your Lists"] > div > div:nth-child(12),
div[aria-label="Timeline: Your Lists"] > div > div:nth-child(13),
div[aria-label="Timeline: Your Lists"] > div > div:nth-child(14),
[role="banner"] > div > div > div > div:last-child,
[role="progressbar"] + div,
[data-testid="AppTabBar_More_Menu"],
/*a[href*="/compose/tweet"],*/
/*a[href*="notifications"],*/
a[href*="twitter_blue_sign_up"],
/*a[href*="message"]*/
a[href*="logout"],
a[href*="login"],
[data-testid="AppTabBar_Home_Link"],
a[href*="communities"] {
display: none !important;
}
[aria-label="Account menu"] {
}
[aria-label="Account menu"] > * {
animation: ease-in-out infinite alternate !important;
animation-name: twitterhover !important;
animation-duration: 2s !important;
}
[role="article"] {}
[class="css-1dbjc4n r-1loqt21 r-18u37iz r-1ny4l3l r-1udh08x r-y8nl5v r-n3sdqm r-o7ynqc r-6416eg"] { }
@-webkit-keyframes twitterhover {
0% {
transform: translateY(0);
}
100% {
transform: translateY(-5%);
}
}
/* EOF */
@nerdfiles
Copy link
Author

dunno if this one works but it's not terribly janky

@nerdfiles
Copy link
Author

hide the universal message box, hide "verified" tab, hide the "blue" offering in the main nav

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment