Clickable prototype here: http://pauginer.github.io/prototypes/flow/responsive/index.html
* Move the wikitext that was in the Flow board header to the side rail. See prototype & mocks/screenshots for styling.
* The side rail has a title, which is not editable per page: "About this discussion page"
* There is an edit pencil icon at the top of the side rail wiki content. When the user clicks the icon, an entry field appears in that location, with the content represented in VE or wikitext (as determined by the user's sticky pref). This should follow the same model as editing an existing post -- replacing the content with the editing field, with Cancel link and Save changes button.
* Responsiveness: As the browser window gets bigger/smaller, the width of the content and the side rail change. There are breakpoints for minimum width and maximum width. When the browser window hits the minimum width, the side rail content pops to the top of the page.
* Collapse toggle: The open side rail has an X at the top right. Clicking on the X collapses the side rail to a thin border, and the Flow content fills the rest of the browser window. Clicking on the icon in the border re-opens the side rail.
**Notes**:
There are separate tickets for some of the elements seen in the prototype/mocks. This ticket is limited to the elements defined above.
Do we need a mockup for editing the side rail, with cancel/save changes?
Add definition of responsive width breakpoints?
Is the full-width (collapsed rail) also responsive? What's the maximum width?