Who’s who on Twitter

Twitter Styles

Jeff Barr posted a lazy web request for a better view of Twitter contacts and Wes Maldonado responded with a slick Greasemonkey script.

Well, not to be outdone by the scripting folks, I made two similar scripts for , a Firefox plugin that allows you to apply custom CSS on certain webpages (see what I did for Tangler a couple days ago).

To apply these styles, install the extension and then add either of these styles to Twitter.com:

.code { border: 1px solid #ccc; list-style-type: decimal-leading-zero; padding: 5px; margin: 0; }
.code code { display: block; padding: 3px; margin-bottom: 0; }
.code li { background: #ddd; border: 1px solid #ccc; margin: 0 0 2px 2.2em; }

No avatars

  1. @-moz-document domain("twitter.com") {
  2. #friends {margin-top: 12px;}
  3. #friends a[rel=contact] {display:block;text-decoration: none !important;margin-bottom:3px;}
  4. #friends a[rel=contact] img {display:none;}
  5. #friends a[rel=contact]:after {content: attr(title);}
  6. }

With avatars

  1. @-moz-document domain("twitter.com") {
  2. #friends a[rel=contact] {display:block;text-decoration: none !important;margin-bottom:3px;}
  3. #friends a[rel=contact] img {margin-right: 3px; text-decoration: none !important;}
  4. #friends a[rel=contact]:after {content: attr(title);}
  5. }

Author: Chris Messina

Inventor of the hashtag. #1 Product Hunter. Techmeme Ride Home podcaster. Ever-curious product designer and technologist. Previously: Google, Uber, Republic, YC W'18.

5 thoughts on “Who’s who on Twitter”

  2. It was both badly needed, and it used to be there. I have never understood why they made it so hard to list contacts. It used to be clear and easy to read. Almost exactly like how you’ve redone it to look.

  4. I can’t seem to extract CSS from your code for Firefox’s Stylish so that I may implement this in Safari with Stand.
    I must be an idiot 🙂
    Can you reduce it to simple CSS for me?
    Thanks!

  5. never mind.
    I’m not an idiot. Safari was chaching the stylesheet and not applying mine.
    Thanks! This is just what twitter needed!

Leave a comment