Last active
March 30, 2017 21:47
-
-
Save mcnees/81bf5bbe62611d80d9d0 to your computer and use it in GitHub Desktop.
Install Stylish for your browser, then add this code as a new style that applies to the domain twitter.com. It let's you replace your fav button and notification stream icons with the emojis of your choice, and replaces "Likes" with "Favorites" on your profile page. You can also change the "Block" option under a user's drop-down menu to "Drop In…
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Install the Stylish extension for your browser, then add this code | |
as a new Style. Make sure it applies to the domain 'twitter.com' */ | |
/* You can get Stylish here: */ | |
/* Safari - http://sobolev.us/stylish/ */ | |
/* Chrome - https://chrome.google.com/webstore/detail/stylish/fjnbnpbmkenffdnngjfgmeleoegfcffe */ | |
/* Tweet improvements, comments, or corrections to @mcnees. */ | |
/* Thanks to: @pbausch, @mathowie, @blakestacey, @ukuleledan and others! */ | |
/* Hide the heart for un-Faved tweets. */ | |
.ProfileTweet-actionButton .HeartAnimationContainer { | |
visibility: hidden; | |
} | |
.WebToast .HeartAnimationContainer { | |
visibility: hidden; | |
} | |
/* Prevent .HeartAnimationContainer from clipping emoji */ | |
/* This overrides Twitter's default, set elsewhere. */ | |
.HeartAnimationContainer { | |
overflow: visible !important; | |
} | |
/* Specify an emoji to use in place of the heart, for un-Faved tweets. */ | |
.ProfileTweet-actionButton .HeartAnimationContainer:after { | |
/* Use a grayed-out emoji for the unclicked Fav button. */ | |
content:'🍺'; | |
/* Safari or Chrome */ | |
-webkit-filter: grayscale(100%); | |
opacity: 0.7; | |
/* Firefox or Mozilla */ | |
/* -moz-filter: grayscale(100%); */ | |
visibility: visible; | |
display: block; | |
position: relative; | |
vertical-align: middle; | |
} | |
/* Show the regular emoji when hovering over the fav button. Via @mrtnrs_ on twitter. */ | |
.ProfileTweet-actionButton .HeartAnimationContainer:hover:after { | |
/* Use a regular emoji for the hovered Fav button. */ | |
content:'🍺'; | |
/* Safari or Chrome */ | |
-webkit-filter: grayscale(0%); | |
/* Firefox or Mozilla */ | |
/* -moz-filter: grayscale(50%); */ | |
visibility: visible; | |
display: block; | |
position: relative; | |
vertical-align: middle; | |
} | |
/* Hide the heart for Faved tweets. */ | |
.ProfileTweet-actionButtonUndo .HeartAnimationContainer { | |
visibility: hidden; | |
} | |
/* Replace the heart for Faved tweets with an emoji. */ | |
.ProfileTweet-actionButtonUndo .HeartAnimationContainer:after { | |
/* Use a regular emoji for the clicked Fav button. */ | |
content:'🍺'; | |
visibility: visible; | |
display: block; | |
position: relative; | |
vertical-align: middle; | |
} | |
/* Change the text color for the Fav count. */ | |
.ProfileTweet-actionCountForPresentation { | |
color: #999; | |
} | |
/* ----------------------------------------------------------- */ | |
/* The following code changes icons in the Notification Stream */ | |
/* ----------------------------------------------------------- */ | |
/* Hide the heart icon for Favs in the notification stream. */ | |
.activity-type-favorite { | |
visibility: hidden; | |
} | |
/* Replace them with an emoji. */ | |
.activity-type-favorite:before { | |
content:'⭐️'; | |
visibility: visible; | |
display: inline-block; | |
position: relative; | |
vertical-align: middle; | |
line-height: 18px; | |
font-size: 15px; | |
} | |
/* Hide the icon for a retweet in notification stream. */ | |
.activity-type-retweet { | |
visibility: hidden; | |
} | |
/* Replace it with an emoji. */ | |
.activity-type-retweet:before { | |
content:'💯'; | |
visibility: visible; | |
display: inline-block; | |
position: relative; | |
vertical-align: middle; | |
line-height: 18px; | |
font-size: 15px; | |
} | |
/* Hide the icon for a favorited mention in notification stream. */ | |
.activity-type-favorited_mention { | |
visibility: hidden; | |
} | |
/* Replace it with an emoji. */ | |
.activity-type-favorited_mention:before { | |
content:'🔥'; | |
visibility: visible; | |
display: inline-block; | |
position: relative; | |
vertical-align: middle; | |
line-height: 18px; | |
font-size: 15px; | |
} | |
/* Hide the icon for a favorited retweet in notification stream. */ | |
.activity-type-favorited_retweet { | |
visibility: hidden; | |
} | |
/* Replace it with an emoji. */ | |
.activity-type-favorited_retweet:before { | |
content:'⚡️'; | |
visibility: visible; | |
display: inline-block; | |
position: relative; | |
vertical-align: middle; | |
line-height: 18px; | |
font-size: 15px; | |
} | |
/* Hide the icon for a retweeted retweet in notification stream. */ | |
.activity-type-retweeted_retweet { | |
visibility: hidden; | |
} | |
/* Replace it with an emoji. */ | |
.activity-type-retweeted_retweet:before { | |
content:'💯'; | |
visibility: visible; | |
display: inline-block; | |
position: relative; | |
vertical-align: middle; | |
line-height: 18px; | |
font-size: 15px; | |
} | |
/* Hide the icon for a new follower in notification stream. */ | |
.activity-type-follow { | |
visibility: hidden; | |
} | |
/* Replace it with an emoji. */ | |
.activity-type-follow:before { | |
content:'😄'; | |
visibility: visible; | |
display: inline-block; | |
position: relative; | |
vertical-align: middle; | |
line-height: 18px; | |
font-size: 15px; | |
} | |
/* ------------------------------------------------------------- */ | |
/* This code changes "Likes" to "Favorites" on the Profile Page. */ | |
/* ------------------------------------------------------------- */ | |
/* Remove 'Likes' on Profile Page */ | |
.ProfileNav-item--favorites .ProfileNav-label { | |
visibility: hidden; | |
} | |
/* replace it with 'Favorites' */ | |
/* Thanks to @pbausch and @mathowie for a fix here! */ | |
.ProfileNav-item--favorites .ProfileNav-label:after { | |
content:'Favorites'; | |
visibility: visible; | |
margin-left: -30px; | |
} | |
/* ------------------------------------------------------------- */ | |
/* Tired of clicking 'Moments' when you tried to click on */ | |
/* 'Notifications'? Hide the 'Moments' tab. */ | |
/* ------------------------------------------------------------- */ | |
/* via Izzy Galvez @iglvzx on twitter. */ | |
/* https://twitter.com/iglvzx/status/672900709596049408 */ | |
.global-nav .moments { | |
display: none; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The style should look something like this: