Profile

Wikiweb Block Quotes

Screen_shot_2012-02-02_at_5

7 Responses

  1. Profile Andy Mangold

    Working on a stylesheet for all of Wikipedia, and this is how I chose to approach blockquotes. It's all CSS with no control over the markup and it has to work at iPhone and iPad size, both horizontal and vertical. I thought the torn edge leant some nice character, while also making it abundantly clear that the content is in fact a blockquote, taken out of context from another source.

    I'm excited for us to drop this one.

    4 months ago

  2. Pro Andrew_5 Andrew Witherspoon

    I can't wait either. Have you guys named the app?

    4 months ago

  3. 296277_603499380284_4303499_32530746_1404323508_n Trevor Baum

    Good solution, Andy. I would maybe make the torn edge slightly less ragged/irregular - with everything else being so orderly and blocky, it could possibly look distracting.

    likes

    4 months ago

  4. Profile Andy Mangold

    @Andrew Witherspoon we're calling it Wikiweb.
    @Trevor Baum I'm currently working on making some other things a bit less blocky as well...

    4 months ago

  5. Pro Dsdribbble David Sizemore

    A stylesheet for all of Wikipedia. No biggie!

    I agree with Trevor—the tear, with the straight down shadow, seems out of place. I'm not saying it's not worth pursuing further, though.

    4 months ago

  6. Brad_avatar Brad McNally

    Love it, how are you planning on distributing it? Stylebot?

    4 months ago

  7. Profile Andy Mangold

    @Brad McNally It's part of an iOS app we're working on. It will be universal, for both the iPad and iPhone, and the Wikipedia reader is only one half of it. See: http://dribbble.com/shots/283036-Wikiweb.

    @David Sizemore the hard edged drop shadow isn't ideal, but it's partially a limitation of CSS and the fact that the element needs to work at any size. Perhaps I could overlay some semi-transparent white fades in the corners though...

    4 months ago

keyboard shortcuts: previous shot next shot L or F like