Make partials system for new content cells based on older split-view design

I need to update the documentation to reflect use of the content_for blocks but I converted all of your example pages to show how it works.

Is the modal box (content#new) going to be widely used / is content regularly going to be placed above the div.C-full? I need to know if that page should always be a special case or if we'll have more like that.

Actually, Brian, here's how content#new is supposed to work: the user first sees the modal selector (MS) to select a content type. Then we take that selection to load the appropriate form partial. If the user clicks the Back button from that form (which is attached to the content cell), we return them to the MS to select a different type of content. They should never be together on the same page - I only did that to illustrate how they should look before you split them up.

With that said, here's where it might get tricksy: I could see some cases in which multiple content cells appear on the same page. If possible, I'd like to have the ability to have multiple content cells - with sidebars, perhaps - on the same page. But I understand that loading multiple sets of partials may not work well, so I'm willing to think of other ways around this. But for example, the new dashboard is going to have multiple content areas that layer on top of one another. If we could do all that with content cells in the current design, that would be ideal.

Sounds good. You should have all the CSS you need in base.css, but let me know if you need anything from me. And yes, div class="C-full" is the "full" content cell wrapper.

I don't think it is going to be very easy to build a partial-based system for rendering these pages and using content_for too heavily will hurt caching (and be very very confusing).

Instead, I went back to the original design and cleaned up the HTML a bunch substituting HTML5 elements where it made sense.

A content "cell" is an HTML5 section. What was div.C-Full became section.C-Full and the Modal thing is a section as well. The header div is now just a header tag, with the styles descending from the C-Full or the Modal section. There is still div.c-cont which wraps the content + sidebar, but there isn't an HTML5 semantic element we can substitute for that (c-cont is only for styling purposes to my knowledge). The old content div is now an article, and the sidebar div is now an aside element.

Essentially I replaced div's + classes with an equivalent HTML5 element. We might have to add a line or two of code to enable this to work in older browsers (http://remysharp.com/downloads/html5.js) but I think it is worth it. Blind people will be able to understand our content (in theory).

Here's the skinny on the markdown:

section.MS-frame.sm
  header
  div.C-cont
    article
    aside

section.C-full
  header
  div.MS-outer
    article

Did you mistakenly switch the markdown elements? Looks like they're mixed up and should be the following:

section.C-full.sm
  header
  div.C-cont
    article
    aside

section.MS-frame
  header
  div.MS-outer
    article

I'm cool using HTML5 semantic elements. It's something I've been meaning to look into using for cleanliness purposes. We should include the JS file app-wide.

Good catch on the typo. Copy & paste gone awry.