Last active
November 11, 2015 00:44
-
-
Save MaverickTse/b56792794c62a9e0ab20 to your computer and use it in GitHub Desktop.
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
/* Reference: https://userstyles.org/styles/120402/twitter-s-fav-button-back */ | |
/* The is the old default star, no animation */ | |
.HeartAnimationContainer:before,.Icon--heart:before{content:"\f147";display:block;font-family:"rosettaicons";font-weight:normal;font-style:normal;text-align:center;-webkit-font-smoothing:antialiased;} | |
.ProfileTweet-action--favorite.withHeartIcon.is-animating .HeartAnimation,.HeartAnimation{display:none!important;} | |
.tweet-action[rel="favorite"]:hover,.tweet-detail-action[rel="favorite"]:hover,.tweet-action[rel="favorite"]:focus,.tweet-detail-action[rel="favorite"]:focus,.tweet-action[rel="favorite"]:active,.tweet-detail-action[rel="favorite"]:active,.tweet-action.is-selected[rel="favorite"],.Icon--favorited,.Icon--colorFavorited,.ProfileTweet-action--favorite .ProfileTweet-actionButton:hover *,.ProfileTweet-action--favorite .ProfileTweet-actionButton:focus,.ProfileTweet-action--favorite .ProfileTweet-actionCount:hover,.ProfileTweet-action--favorite .ProfileTweet-actionCount:focus,.tweet.favorited .tweet-actions .Icon--favorite,.tweet.favorited .ProfileTweet-actionList .Icon--favorite,.tweet.favorited .ProfileTweet-action--favorite .ProfileTweet-actionCount,.Icon--colorHeart,.Icon--circleActiveHeart,.Icon--heartBadge,.ProfileTweet-action--favorite.withHeartIcon .ProfileTweet-actionButton:hover,.ProfileTweet-action--favorite.withHeartIcon .ProfileTweet-actionButton:focus,.ProfileTweet-action--favorite.withHeartIcon .ProfileTweet-actionCount:hover,.ProfileTweet-action--favorite.withHeartIcon .ProfileTweet-actionCount:focus,.favorited .ProfileTweet-action--favorite .Icon--heart,.favorited .ProfileTweet-action--favorite.withHeartIcon .ProfileTweet-actionButtonUndo,.favorited .ProfileTweet-action--favorite .ProfileTweet-actionButtonUndo{color:#FFA200!important;} | |
.ProfileTweet-action--retweet .ProfileTweet-actionButton:hover,.ProfileTweet-action--retweet .ProfileTweet-actionButton:focus,.ProfileTweet-action--retweet .ProfileTweet-actionCount:hover,.ProfileTweet-action--retweet .ProfileTweet-actionCount:focus,.Icon--retweeted,.Icon--colorRetweeted,.ProfileTweet-action--retweet .ProfileTweet-actionButton:hover *,.ProfileTweet-action--retweet .ProfileTweet-actionButton:focus,.ProfileTweet-action--retweet .ProfileTweet-actionCount:hover,.ProfileTweet-action--retweet .ProfileTweet-actionCount:focus,.Icon--retweeted,.Icon--colorRetweeted,.tweet.retweeted .Icon--retweet,.tweet.retweeted .ProfileTweet-action--retweet .ProfileTweet-actionButtonUndo{color:#0F961A!important;} | |
.hearty .icon-favorite:before{content:"\f007"!important;}.Icon--heartBadge:before{content:"\f001"!important;} | |
.prf [data-type="favorites"]:hover *,.tweet-action[rel="favorite"]:hover,.tweet-detail-action[rel="favorite"]:hover,.tweet-action[rel="favorite"]:focus,.tweet-detail-action[rel="favorite"]:focus,.tweet-action[rel="favorite"]:active,.tweet-detail-action[rel="favorite"]:active,.tweet-action[rel="favorite"].is-selected,.is-favorite .icon-favorite-toggle,.hearty .icon-favorite-color{color:#FFA200!important;} | |
.tweet:before,.tweet:after,.ProfileTweet-header:before{display:inline-block;vertical-align:text-top;background-image:url(https://abs.twimg.com/a/1431997920/img/t1/twitter_web_sprite_icons.png); | |
background-repeat:no-repeat;position:absolute;top:0;right:0;visibility:hidden;width:24px;height:24px;} | |
.favorited:before,.favorited:after,.is-favorited .ProfileTweet-header:before{content:" ";background-position:-30px -450px;visibility:visible;} | |
.retweeted:before,.retweeted:after{content:" ";background-position:0 -450px;visibility:visible;} | |
.favorited.retweeted:before,.favorited.retweeted:after,.is-retweeted .ProfileTweet-header:before,.is-retweeted.is-favorited .ProfileTweet-header:before{content:" ";background-position:-60px -450px;visibility:visible;} | |
/* Belows are imitated star, with animation */ | |
/* | |
.HeartAnimation { | |
background: url("https://pbs.twimg.com/media/CS9U_wmUsAAzuUz.png:large"); | |
background-size: 2900%; | |
background-position: left; | |
} | |
.ProfileTweet-action--favorite .ProfileTweet-actionButton:hover .HeartAnimation, .ProfileTweet-action--favorite .ProfileTweet-actionButton:focus .HeartAnimation, .favorited .ProfileTweet-action--favorite .HeartAnimation { | |
background-position: right; | |
} | |
.Icon--heartBadge { | |
color: #ffac33; | |
} | |
.Icon--heartBadge:before { | |
content: ""; | |
} | |
*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
adopted a CSS found on user-style by default (the old star favour). If you like the animated one, comment out the upper section and uncomment the lower part