mirror of
https://github.com/pbakaus/impeccable.git
synced 2026-09-14 15:16:35 +03:00
Paul BakausandClaude Fable 5
8ebcfccc64
The static engine's checkHtmlPatterns ran its CSS-property regexes over the entire source string, so documentation ABOUT css flagged as css: impeccable.style's changelog line naming background-clip: text inside a <code> tag tripped gradient-text, the purple hexes in a <pre> sample read as the AI palette, and a commented-out stripe rule counted as a live one. The browser path shared the exposure through outerHTML. The fix is engine-level, not a per-rule patch. The pattern pass now scans scoped corpora: styleText carries <style> block contents, style="" attribute values, and the linked stylesheets the static engine already reads for the cascade; classText carries class attribute values for the utility-class scans. The static engine builds both from its parsed document, so escaped code samples never contribute; other callers fall back to a tag-scoped extraction in buildHtmlPatternCorpora, and bare CSS input stays its own style text so direct callers keep working. The pulsing-dot and marquee scanners take a second markup argument for the parts that really are markup: landmark ranges, Tailwind class positions, the <marquee> tag itself. Rendered-text checks (theater phrases) and markup-shaped checks (svg scenes, img hover classes) keep the full source on purpose. No registry ids change; this is scoping, not a new rule. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
36 lines
1.4 KiB
HTML
36 lines
1.4 KiB
HTML
<!DOCTYPE html>
|
|
<!--
|
|
Companion to css-in-prose-should-pass.html: the same patterns applied as
|
|
real styling. The scoped-corpus scan must still catch every carrier a page
|
|
can style itself with — a <style> rule, an inline style="" attribute, and
|
|
Tailwind utility classes.
|
|
-->
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Real gradient-text styling</title>
|
|
<style>
|
|
body { font-family: Georgia, serif; margin: 0; padding: 40px 24px; background: #fdfcf9; color: #1f2933; }
|
|
/* SHOULD FLAG (gradient-text + ai-color-palette): a real style rule. */
|
|
.gradient-heading {
|
|
background: linear-gradient(135deg, #7c3aed, #a855f7);
|
|
-webkit-background-clip: text;
|
|
background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
font-size: 44px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1 class="gradient-heading">Ship Faster With Us</h1>
|
|
|
|
<!-- SHOULD FLAG (gradient-text): the same construction inline. -->
|
|
<h2 style="background: linear-gradient(90deg, #667eea, #764ba2); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; font-size: 28px;">Inline gradient heading</h2>
|
|
|
|
<!-- SHOULD FLAG (gradient-text, Tailwind): bg-clip-text + bg-gradient-to- classes. -->
|
|
<h2 class="bg-clip-text bg-gradient-to-r from-purple-500 to-pink-500 text-transparent">Tailwind gradient heading</h2>
|
|
|
|
<p>Body copy long enough to make this a real page for the scanners to read.</p>
|
|
</body>
|
|
</html>
|