From 4f357ecdee4110410190597b78effb029d36c9ee Mon Sep 17 00:00:00 2001 From: Kevin Batdorf Date: Sun, 2 Aug 2026 22:08:52 +0700 Subject: [PATCH] Stop pinning transform:none on blocks after their entrance animation MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The post-animation cleanup rule (.ext-animate[data-ext-animated]) pinned transform: none !important forever. Its specificity (0,2,0) beats the (0,1,0) that WP core gives block custom CSS — core wraps style.css in :root :where(.wp-custom-css-) — so any user transform (a tilted heading via the Agent's custom-CSS escape hatch, or the block editor's Additional CSS panel) previews fine, saves fine, then silently renders untransformed on every reload of an animated block. The transform line was redundant: animation: none !important already removes the keyframe-supplied transforms, and the interactivity JS's inline transform reset (setType('none') path) is non-important, so it still yields to a user's !important custom rule. opacity stays pinned because .ext-animate's opacity: 0 base would otherwise re-hide the element. Found live-testing the extendify-sdk schema-based block-updating branch: "tilt this heading slightly" on a launched site (entrance animations on by default) lost the tilt after reload. --- assets/css/animations.css | 1 - 1 file changed, 1 deletion(-) diff --git a/assets/css/animations.css b/assets/css/animations.css index 150d5fec..6d7582e8 100644 --- a/assets/css/animations.css +++ b/assets/css/animations.css @@ -39,7 +39,6 @@ .ext-animate[data-ext-animated] { opacity: 1 !important; - transform: none !important; animation: none !important; }