Code playgrounds (aka "codepen")

[ghost]

Todo:

• [x] figure out where to put the playground button
• [x] need to add max-width setting
• [ ] call out interesting settings that people might want to play with
• [x] only present playground for "after" in comparisons
• [ ] vertically center output

First draft of popup code playgrounds is in. Right now this is a big ugly "Experiment!" button beneath every "live" specimen.

Next step is making that more attractive and unobtrusive. Click it and the "playground" UI takes over the screen, with a close button.

[dberlow]

This looks great.

On Dec 14, 2018, at 2:42 PM, Chris Lewis notifications@github.com wrote:

First draft of popup code playgrounds is in. Right now this is a big ugly "Experiment!" button beneath every "live" specimen.

Next step is making that more attractive and unobtrusive. Click it and the "playground" UI takes over the screen, with a close button.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or mute the thread.

[dberlow]

...also on that list, we only need to present the “after”, varied version, not both, for experimentation. This structure of giving both parts of the example to the user is off course. Thanks.

On Dec 15, 2018, at 4:47 PM, Chris Lewis notifications@github.com wrote:

need to add max-width setting call out interesting settings that people might want to play with — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or mute the thread.

[ghost]

Playground seems to be broken right now. Will fix.

[ghost]

Fixed the Javascript errors that were causing this to not load.