diff --git a/packages/edit-post/src/components/header/pinned-plugins/style.scss b/packages/edit-post/src/components/header/pinned-plugins/style.scss index b01dd0480d5ee5..030d6305ae9033 100644 --- a/packages/edit-post/src/components/header/pinned-plugins/style.scss +++ b/packages/edit-post/src/components/header/pinned-plugins/style.scss @@ -7,6 +7,10 @@ .components-icon-button { margin-left: 4px; + + &.is-toggled { + margin-left: 5px; + } } // Colorize plugin icons to ensure contrast and cohesion, but allow plugin developers to override. @@ -19,7 +23,9 @@ // Forcefully colorize hover and toggled plugin icon states to ensure legibility and consistency. .components-icon-button.is-toggled svg, - .components-icon-button.is-toggled svg * { + .components-icon-button.is-toggled svg *, + .components-icon-button.is-toggled:hover svg, + .components-icon-button.is-toggled:hover svg * { stroke: $white !important; fill: $white !important; stroke-width: 0; // !important is omitted here, so stroke-only icons can override easily.