From 4f3da917d2991b6e2cb08bf9ee72b1c2b07a6bc0 Mon Sep 17 00:00:00 2001 From: Andrei Draganescu Date: Fri, 11 Oct 2024 14:01:42 +0300 Subject: [PATCH] Always preview style variations using desktop device type (#66023) * always preview style variations using desktop device type * Improve comment --------- Co-authored-by: draganescu Co-authored-by: getdave Co-authored-by: ramonjd Co-authored-by: richtabor Co-authored-by: juanfra --- .../components/global-styles/screen-style-variations.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/edit-site/src/components/global-styles/screen-style-variations.js b/packages/edit-site/src/components/global-styles/screen-style-variations.js index 4fefbe39ac55c..70727ac669880 100644 --- a/packages/edit-site/src/components/global-styles/screen-style-variations.js +++ b/packages/edit-site/src/components/global-styles/screen-style-variations.js @@ -4,6 +4,8 @@ import { Card, CardBody } from '@wordpress/components'; import { __ } from '@wordpress/i18n'; import { useZoomOut } from '@wordpress/block-editor'; +import { useDispatch } from '@wordpress/data'; +import { store as editorStore } from '@wordpress/editor'; /** * Internal dependencies @@ -12,9 +14,12 @@ import ScreenHeader from './header'; import SidebarNavigationScreenGlobalStylesContent from '../sidebar-navigation-screen-global-styles/content'; function ScreenStyleVariations() { - // Move to zoom out mode when this component is mounted - // and back to the previous mode when unmounted. + // Style Variations should only be previewed in with + // - a "zoomed out" editor + // - "Desktop" device preview + const { setDeviceType } = useDispatch( editorStore ); useZoomOut(); + setDeviceType( 'desktop' ); return ( <>