Twenty Twelve: add support for Status post format

[lancewillett]

As discussed in #wordpress-dev IRC team meeting today, task is to enable the Status post format.

Drew will provide styles.

[lancewillett]

In [21726]:

Twenty Twelve: add support for Status post format. See #21743.

[lancewillett]

Support is added, with a right-floated 48 pixel avatar.

Passing to Drew for a style review.

[lancewillett]

I pinged Drew again today to review this for design integration, so I can close it.

[drewstrojny]

Added styles for Status post format (screenshot attached).

[lancewillett]

Update RTL styles to match

[lancewillett]

@drewstrojny I think the "clear" class you added is unnecessary. Did you see any float clearing problems?

In my testing it works fine without it.

(I'd also prefer to keep it out of the markup if possible.)

[lancewillett]

Also, I think we can use the_author() instead of echo get_the_author_meta( 'display_name' ) to output the Display Name: ​http://codex.wordpress.org/Function_Reference/the_author.

[drewstrojny]

Replying to lancewillett:

@drewstrojny I think the "clear" class you added is unnecessary. Did you see any float clearing problems?

I added it to make the module itself a bit more bulletproof. If someone increases the size of the avatar and adds some extra meta it will still clear completely and look good. If the <header> isn't cleared the content could start wrapping up against it in that scenario.

Feel free to move the clear stuff to the stylesheet if you prefer it. I know you guys extracted the old clearing method we were using with Sass and replaced it with something else. I poked around a bit and found the clear class.

In summary, I think I'd prefer we keep it, but it doesn't have to be in the markup.

[drewstrojny]

Replying to lancewillett:

Also, I think we can use the_author() instead of echo get_the_author_meta( 'display_name' ) to output the Display Name: ​http://codex.wordpress.org/Function_Reference/the_author.

Good idea. I was initially toying with using the user's URL in that spot and forgot about the_author.

[lancewillett]

Replying to drewstrojny:

Replying to lancewillett:

@drewstrojny I think the "clear" class you added is unnecessary. Did you see any float clearing problems?

I added it to make the module itself a bit more bulletproof. If someone increases the size of the avatar and adds some extra meta it will still clear completely and look good. If the <header> isn't cleared the content could start wrapping up against it in that scenario.

Gotcha, I tested out a huge gravatar image and the content below (paragraph) actually looks OK wrapped against it. And it's cleared below by .entry-meta element so the flow is reset before the element below.

[lancewillett]

In [21932]:

Twenty Twelve: update status post format styles and markup, props drewstrojny. See #21743.

[drewstrojny]

Gotcha, I tested out a huge gravatar image and the content below (paragraph) actually looks OK wrapped against it. And it's cleared below by .entry-meta element so the flow is reset before the element below.

I was testing it with a medium size image (say 80px) and some ugliness creeps in. I'll upload a couple screenshots.

[lancewillett]

OK, we can solve this pretty easily by adding clear: both; — that will force the paragraph element (first part of the real post content) to not wrap around the header element.

[lancewillett]

Looking more closely, I think I'll rework the markup in the template to match the pattern we use elsewhere, entry-header and entry-content separated out.

[lancewillett]

In [21933]:

Twenty Twelve: rework markup and styles for status post format after discussion with drewstrojny and testing for float clearing. Closes #21743.