Wp-calypso: Settings: Traffic: update AMP card for WordPress.com sites

[rickybanister]

After reviewing all the new stats work we've done, I redesigned the AMP card for .com sites (who get to toggle it on/off) so that it will match our other settings:

cc @jasmussen (who I believe worked on the original implementation), @johnHackworth, @oskosk, @tyxla

related to #12801

[rickybanister]

I hacked that together in the inspector so some of the wonkiness of spacing and alignment were from that, not on purpose. Using the correct components should alleviate any of those quirks.

[jasmussen]

Looks good. Perhaps throw in a "mobile" phrase somewhere in the verbiage, as right now you'll likely see the amp version only if you visit on a mobile device.

[tyxla]

Just to confirm: this will be only for .com sites, right? So the Jetpack AMP card will remain as-is (see #12801)?

[rickybanister]

@tyxla yes, since AMP is not yet part of Jetpack, let's leave that card 'informational' and simply link over to the plugin management area and the customizer. This is .com only.

@jasmussen we can tweak the verbiage for sure, but the toggle already mentions mobile and the description (which I didn't change) mentions phones and tablets. Maybe we just have editorial audit the text here?

@michelleweber could you help us out with some wording (non-urgent)

[jasmussen]

I missed that it's in the actual name, for some reason, mobile pushed duh. I think a verbiage change to clarify would be neat but clearly not _needed_. 👍

[michelleweber]

Some suggested tweaks to add a full title to the section and make the actual toggle text a little simpler:

Accelerated Mobile Pages (AMP)

(o) Improve the loading speed of your site on phones and tablets

_Your WordPress.com supports the use of Accelerated Mobile Pages, a Google-led initiative that dramatically speeds up loading times on mobile devices._

[rickybanister]

Awesome, thanks!

[tyxla]

This one is being addressed in #13457, feel free to have a look.