Use dots for pager

[Cassidy James Blaede]

Instead of the relatively bulky number buttons for page switching, it'd be nice to have dots for the page. I imagine the active dot being the fg color and the inactive dot being around 50% opacity.

The buttons should remain the same size, just with a .flat class added.

Dan and I discussed that we could use two icons (active and inactive), a single symbolic icon with opacity on the inactive, or the bullet character (•) with the `dim-label` class for inactive buttons.

[Cassidy James Blaede (cassidyjames)]

I threw together a quick mockup in GIMP :)

[Danielle Foré (danrabbit)]

It looks like we have a class already for "switcher". We need a bit of custom CSS anyways because flat:active buttons are still depressed looking. So we could achieve the desired effect with something like:

.switcher {
    font-size: 16px;
    padding: 0;
    opacity: 0.5;
    border: none;
    box-shadow: none;
}

.switcher:checked {
    background-color: transparent;
    opacity: 1;
}

We also have to be careful about which bullet character we're using. One of them isn't completely round in the font. ∙ seems to be round while • is not.