Task #531

Article Detail - Content Styling

Added by Pea Lutz about 1 year ago. Updated 12 months ago.

Status:Closed Start date:04/07/2012
Priority:High Due date:05/06/2012
Assignee:Pea Lutz % Done:

100%
Category:development
Target version:0.6 (05-31-2012)
Tag:

Description

Update display of Article Detail to be inline with design comp.

  • General styling/typography tweaks needed.

Example Story: http://live.occupywallstreet-net.gotpantheon.com/story/people-parties
Design Reference: http://projects.occupy.net/documents/63

History

#1
Updated by Pea Lutz about 1 year ago

  • Due date changed from 04/11/2012 to 04/23/2012
  • Priority changed from Normal to Urgent

#2
Updated by Pea Lutz about 1 year ago

  • Target version changed from 0.5 to 0.6 (05-31-2012)

#3
Updated by Pea Lutz about 1 year ago

  • Due date changed from 04/23/2012 to 05/06/2012
  • Status changed from New to In Progress
  • Assignee changed from Thiago de Mello Bueno to Pea Lutz
  • Priority changed from Urgent to High

I'm working on this. Assigning to self.

#4
Updated by Pea Lutz about 1 year ago

  • % Done changed from 0 to 70

#5
Updated by Pea Lutz about 1 year ago

Working on this locally and have committed some CSS updates to dev.

#6
Updated by Pea Lutz 12 months ago

  • Status changed from In Progress to Feedback

#7
Updated by Pea Lutz 12 months ago

Devin wrote:

This is much better but I think the text wrap is still problematic. I'd prefer a full width image if it's horizontal and a half width if it's vertical. I think this begins to open the door to another conversation - which is how we can develop a process of designing the site that is responsive to the content providers as well as the developers. Maybe we could hold one of those meetings after this code is pushed and before the next set of priorities are established?

By wrap, you're referring to the way the text wraps around the image? If so, that isn't so much of a content or development issue as a design consideration. Looking at the comps, it seems that the image size implemented is actually too large. They should extend 5 columns (380px wide) rather than 8 column (540px wide). That can be easily fixed.

#8
Updated by Pea Lutz 12 months ago

  • % Done changed from 70 to 90

Styling updated for Stories and Events.
Byline and image fields wrapped in div to help style.

.group-byline
.group-image-wrapper
.image-metadata-wrapper
.group_event_details

#9
Updated by Pea Lutz 12 months ago

  • % Done changed from 90 to 100
From Devin Story Page
  • deeper gray for byline and image captions - for readability

Text color changed to a darker gray #333333.

#10
Updated by Pea Lutz 12 months ago

  • Status changed from Feedback to Closed

Also available in: Atom PDF