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

Head of West Coast Business Development at Republic. Ever-curious product designer and technologist. Hashtag inventor. Previously: Molly.com (YC W18), Uber, Google.

5 thoughts on “Who’s who on Twitter”

  1. 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.

  2. 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!

  3. 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 Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

%d bloggers like this: