fix(css): a theme's .kit button:hover still reached our controls - #54
Merged
Conversation
The previous commit answered `.elementor-kit-6 button` (0,1,1) and stopped
there. The same kit ships a second rule:
.elementor-kit-6 button:hover,
.elementor-kit-6 button:focus { background: #000216; color: #fff;
border: 1px solid #000216 }
A state is a pseudo-class, so that weighs (0,2,1) — heavier than the (0,2,0)
our control rules had just been raised to. It therefore won every property the
hovered control's *own* hover rule does not restate, and there are always some:
the float menu's items declare `border: none` and their colour in the base rule
only, so hovering one drew a 1px near-black box around it and flipped the label
to #fff — white on white on the light theme, which is what the report showed.
Themes animate `transform` on hover as often as they recolour, and no control
of ours declares that at all, so restating properties per control would not
have closed it either.
Raise the band one notch instead, still with no `!important` anywhere:
theme base (0,1,1) < theme state (0,2,1) < the reset (0,2,2) ≤ ours (0,2,2)
- the containment reset gains `:is(:enabled, :disabled)`, an always-true union
over form controls that changes nothing about what it matches and is there
for the one class of weight
- all 33 control rules gain `html body` (light-theme overrides take the
attribute onto the `html` it is already set on), landing on (0,2,2); the tie
with the reset is settled by source order, which the existing guard already
asserts
Guards, both mutation-tested:
- the unit test now measures against the (0,2,1) state rule rather than the
(0,1,1) base rule, at both edges of the band
- the e2e hostile page serves the real `:hover`/`:focus` twin off azulle.com,
and the spec asserts a hovered menu item and a focused primary button keep
our colour and our border. Those reads settle the element's transitions
first — sampling the frame straight after `page.hover()` returns the
transition's start value and reads exactly like a specificity failure.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Collaborator
Author
|
@codex review |
|
You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard. |
1 similar comment
|
You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Background
Solution
.kit button:hoverstill reached our controlsAffected Files
CLAUDE.mdcontent/content.csstest/e2e/input-translation.spec.jstest/unit/host-css-containment.test.mjs