Colouring in the tags

[facetofcathy]

I like the Podfic community, and one of the things I like about them is that they are a community with that spirit of let's get together and organize stuff! Yay!

One of the things they did is produce a consistency of tagging and presentation of their posts on the AO3 so that they are really easy to recognize.

Almost every one has [Podfic] in the title and is tagged as Podfic and/or Podfic and Podficced Works.

So given that beautiful organization, I had this idea to make Podfics in a page of work blurbs even easier to spot for people who like to browse by category or fandom or pairing.

.work .blurb a.tag[href*="Podfic"] {
background-color: COLOUR;
}

will make the background of any tag which contains the work Podfic in it the colour of your choice.

You can do the same thing for works tagged as Vids too--they're also beautifully orgainized:

.work .blurb a.tag[href*="vid"],
.work .blurb a.tag[href*="Vid"],
.work .blurb a.tag[href*="AMV"] {
background-color: OTHERCOLOUR;
}

I imagine you could do Fanart as well.

Try it out, either in a script or a skin--but you might want to be judicious in your colour choices.

Comments

[cantarina]

Accessibility tip: Whatever background colour you choose, make sure it's got a high contrast with the text's colour. Without that contrast, some people with vision loss may not be able to read that it's a podfic at all.

[samjohnsson]

That'll only function in a site skin, which is user specific. ^^ (Work skins can't target the blurb list.)

[facetofcathy]

Yeah, this is the sort of thing you put in a personal site skin or in a greasemonkey script. People get to do whatever they like for colour choices there.

No one else sees it.

Also, since this is a personal tweak, I left off the other rule you should follow, never change the background colour without re-stating the text colour. Not really needed in something like this.