[wp-trac] [WordPress Trac] #31195: Add a user-friendly way to preview site responsiveness in the Customizer

[WordPress Trac]

#31195: Add a user-friendly way to preview site responsiveness in the Customizer
-------------------------------------+-------------------------------------
 Reporter:  celloexpressions         |       Owner:  westonruter
     Type:  feature request          |      Status:  accepted
 Priority:  normal                   |   Milestone:  4.5
Component:  Customize                |     Version:
 Severity:  normal                   |  Resolution:
 Keywords:  has-screenshots has-     |     Focuses:  ui, accessibility,
  patch commit                       |  administration
-------------------------------------+-------------------------------------

Comment (by westonruter):

 Replying to [comment:98 celloexpressions]:
 > Is there a particular reason to make the hover and focus styles
 different? I'd be hesitant to make further changes to those at this point
 after the extensive back and forth that we already went through to agree
 on the current styles. That being said, I'd prefer to have the border for
 both and drop the background change from the focus styles. I'd also say
 that a higher contrast change would call for a longer transition, if
 anything, since no transition at all is more jarring.

 @celloexpressions an argument I see for letting the focus and hover styles
 be different is that if they are the same, then when you click on a
 different device there are two that have the same blue border. If the
 focus has a different style, then it is clear that there is one that is in
 an intermediate state (the one being clicked). I'll leave this up to you
 guys to finalize :)

 > I also just noticed - should we be running `api.trigger` or
 `api.preview.send` instead of only `api.set` when the device value is
 changed? Not sure whether themes can hook into the value change binding
 from the preview.

 You mean instead of `api.previewedDevice.set()`? No. There is no need to
 `trigger` an event for this change because if any plugin is interested in
 the change to the `previewedDevice`, they just need to add a listener on
 that `Value`, e.g.:

 {{{#!js
 wp.customize.previewedDevice.bind( function( newDevice ) {  /*...*/ } );
 }}}

 > Replying to [comment:97 ocean90]:
 > > [attachment:31195.10.diff] and [attachment:31195.9.diff] are looking
 good. I'm only curious why the word "also" was removed in
 [attachment:31195.2.diff]?
 >
 > I was looking at something else, must've forgotten to remove it from the
 patch.

 I restored “also” in [attachment:31195.11.diff].

 Unless there are any objections, I'll go ahead and commit this and any
 other revisions can be committed subsequently as small iterative tweaks
 along with any other feedback after this gets into `trunk`.

--
Ticket URL: <https://core.trac.wordpress.org/ticket/31195#comment:99>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform