[Webkit-unassigned] [Bug 273208] multi-column in grid context layout
bugzilla-daemon at webkit.org
bugzilla-daemon at webkit.org
Mon Apr 29 20:59:02 PDT 2024
https://bugs.webkit.org/show_bug.cgi?id=273208
--- Comment #15 from Karl Dubost <karlcow at apple.com> ---
With hover:
=============================================
version-section {
& ol {
& > li {
padding-block: 0.125lh;
padding-inline: 3ch;
color: rgb(250 50 50 / 0.3);
}
}
}
version-section {
& ol {
& > li {
&:hover {
color: rgb(255 100 100 / 1);
opacity: 1;
}
}
}
}
=============================================
Without hover:
=============================================
version-section {
& ol {
& > li {
padding-block: 0.125lh;
padding-inline: 3ch;
color: rgb(250 50 50 / 0.3);
}
}
}
=============================================
Disabling in
body:has(version-section ol > li:nth-child(1):hover) [version="0"], body:has(version-section ol > li:nth-child(2):hover) [version="1"], body:has(version-section ol > li:nth-child(3):hover) [version="2"], body:has(version-section ol > li:nth-child(4):hover) [version="3"] {
filter: grayscale(0);
transition: filter 1s ease-in-out;
animation: blinker 1s ease-in-out infinite alternate;
}
this rule:
animation: blinker 1s ease-in-out infinite alternate;
fixes the issue.
But Safari is losing obviously the visual animation.
So the background blinking shadowy color is what seems to modify the content here.
aka
@keyframes blinker {
from { filter: invert(0%) drop-shadow(3px 3px 2px red); }
to { filter: invert(25%) drop-shadow(3px 3px 2px blue); }
}
ok let's get rid of the animation.
And just try two states:
ok if I set a value different from grayscale(0) on
body:has(version-section ol > li:nth-child(1):hover) [version="0"], body:has(version-section ol > li:nth-child(2):hover) [version="1"], body:has(version-section ol > li:nth-child(3):hover) [version="2"], body:has(version-section ol > li:nth-child(4):hover) [version="3"] {
/* THIS HERE */
filter: grayscale(0);
/* transition: filter 1s ease-in-out; */
/* animation: blinker 1s ease-in-out infinite alternate; */
}
the top of the 2nd column disappears. When I put it back to 0. It takes *too much time* to reappear.
--
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20240430/fec17a9a/attachment.htm>
More information about the webkit-unassigned
mailing list