Quick summary

Changing font size, color, and other Typography styles for the Navigation block results in some changes showing in the Site Editor, and others are only visible on the live site.

Steps to reproduce

1. Install theme Meraki on a test site
2. Open Site Editor and create a navigation block with a few menu items
3. Under the nav block's block settings, adjust all settings under the Display module

What you expected to happen

Changes made to the menu's color and typography are reflected in the Site Editor

What actually happened

The following properties appear in the site editor correctlY:

• Color: Text, Background, and Submenu & overlay background
• Typography: Appearance, Decoration

The following properties are only visible on Submenu menu items:

• Typography: Font family, Size, and Letter case

The last item is not visible at all:

• Color: Submenu & overlay text

Live Site

On the live site, all changes are visible, except that the Submenu & overlay text color is improperly applied to the main menu, and not applied to the submenu.

Context

Reported here: 36018994-hc
Customer was trying to change font size, and noting that things looked different between editor and live site

Follow Up Ticket: 5360428-zd-woothemes

Simple, Atomic or both?

Atomic

Theme-specific issue?

Meraki

Browser, operating system and other notes

Only had a change to test this on Atomic

I did a quick test on other FSE themes and the issues did not present in the same way

Reproducibility

Consistent

Severity

Some (< 50%)

Available workarounds?

Yes, difficult to implement

Workaround details

• Open up the live site in a new tab/window
• Return to the Site Editor and adjust the Navigation Block's display settings
• Select Save to save that change
• Refresh view of live site to see the results