This PR is a variant on PR #41732 where we added a preview to the mobile view of the Style step in Gutenboarding. In this variant, instead of listing all the buttons below the preview, we list a drop-down button above the preview.
Because we need to display correctly rendered font pairs in the drop-down, I couldn’t use the native select element or the pre-existing WordPress components for SelectControl or Panel/PanelBody. Instead, I’ve gone with a simple approach of a button that displays the selected fonts, and when you click it, we display the set of font buttons styled to look more like they’re in a drop down list (similar to the domain categories drop down). Selecting a font then closes the drop down.
Changes proposed in this Pull Request
Add preview to style step.
Add drop-down button on mobile to show/hide the font selection buttons, and style them to look like the drop-down used in domain categories.
Add fixed footer bottom-bar-mobile component.
Go to /new and complete the steps until you get to the Style step.
Test in a variety of viewport sizes
Make sure the desktop viewport layout is unaffected by this PR