Twenty Twelve: Default to a gray background color

[nacin]

The plain white slate is nice, but the default gray color of #e6e6e6 on ​http://twentytwelvedemo.wordpress.com/ really makes the theme stand out as "whoa." I think this should be the default.

[iandstewart]

+1

[drewstrojny]

I too like the gray background better than plain white, but I worry about this. Mainly because it's super easy to add a custom background, but not so easy to take it away. Therefore, a user who actually wants a white background will have trouble achieving that goal. I guess we could hack something in for the white background case, but that seems, well, hacky :)

[lancewillett]

We can do this pretty easily. Set body bg color to gray, then in the stylesheet set the shadowing and extra spacing as the default. Then, add a body_class value for the white bg color if it exists, and in CSS account for that by removing the spacing and shadow.

[lancewillett]

Make default color #e6e6e6 and handle both white and empty cases

[lancewillett]

I'm attaching a patch so you can play with it.

[drewstrojny]

Replying to lancewillett:

We can do this pretty easily. Set body bg color to gray, then in the stylesheet set the shadowing and extra spacing as the default. Then, add a body_class value for the white bg color if it exists, and in CSS account for that by removing the spacing and shadow.

I think that would be a workable solution, but it just seems backwards to me, especially for a developer. It's kind of like giving someone a new car with a bumper sticker on it. Yeah, they can peel it off, but it's a bit of a pain.

I would think the background color / image as a progressive enhancement of sorts is an easier starting point for developers. More of a blank slate if you will. This is especially true for a default theme, where a blank slate adds significant value. If it were a commercial or niche theme, it wouldn't be as important.

[lancewillett]

Can other folks chime in? What do you think is a nicer first-run look and feel? Better to have it be clean slate to build from, or feel more "set up" a certain way that you have to then undo.

[helenyhou]

I think it's nicer to have the background color on first run. It was actually very confusing for me to see the demo site and then have the initial install of the theme not look anything like it at all because the spacing and box shadow are rather different. Doesn't feel like a clean slate so much as a different slate at the moment.

[SergeyBiryukov]

Minor edit (fixed whitespace in line 75)

[SergeyBiryukov]

I think I'd prefer having the background color on the first run. Looks cleaner and less confusing as to why it's not like on the demo site.

[nacin]

I agree with gray by default. Not for the demo site (which no one will see) but because it is simply a better design. If you wanted a "clean slate" as a developer, you should use _s, toolbox, or sandbox.

Getting 21226.diff​ to work in the customizer via postMessage would be gravy.

[lancewillett]

In [21325]:

Twenty Twelve: set gray background as default, handling empty and white as fallback cases. See #21226.

Also fix incorrect logic for full-width-page.php page template check in twentytwelve_body_class function.

[lancewillett]

Replying to nacin:

Getting 21226.diff​ to work in the customizer via postMessage would be gravy.

Leaving this ticket open to work on the Theme Customizer integration. Changing the background color should change the body_class value there and update the spacing immediately.

[lancewillett]

In [21343] Twenty Twelve: enable async body class value changes for custom background color changes in Theme Customizer. See #21226.

Closing as fixed, we can open new tickets for new issues relating to Theme Customizer as needed.