Ku6epXBOCTuK/easy-png-tools2
1
0
Fork 0
mirror of https://github.com/Ku6epXBOCTuK/easy-png-tools.git synced 2026-09-14 21:46:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: fix cdp audit css selectors specifity

Browse Source
This commit is contained in:
Ku6epXBOCTuK
2026-08-30 21:21:31 +05:00
parent 87dbb200d9
commit 11b4c87486
7 changed files with 132 additions and 408 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/audit/cdp-audit-768x1024.txt
+21 -53
View File
@@ -1,26 +1,19 @@
CDP visual audit
2026-08-30T14:39:15.776Z
2026-08-30T16:20:46.245Z
viewport 768x1024, tolerance 1px, theme light
=== [768x1024] /preview/demo (vs demo.html) — 174 differences ===
=== [768x1024] /preview/demo (vs demo.html) — 172 differences ===
body > main > header [topbar]
position: — → sticky
top: — → 0px
z-index: — → 20
h: 79 → 64 (-15px)
body > main > header > a > span:nth-of-type(1) [brand-mark] "EP"
w: 30 → 14.6 (-15.4px)
body > main > header > a > span:nth-of-type(3) [version] "/ WORKSPACE"
color: #6d7883 [var(--muted)] → #1769d2 [var(--blue)]
body > main > header > div > span > i [status-dot]
display: — → inline-block
width: 6px → 8px
height: 6px → 8px
box-shadow: — → 0 0 0 2px color-mix(in srgb, #25a96a 25%, transparent) [0 0 0 2px color-mix(in srgb, var(--success) 25%, transparent)]
w: 0 → 4.7 (+4.7px)
h: 0 → 6 (+6px)
body > main > header > div > button:nth-of-type(1) [icon-btn icon-btn--bare]
display: grid → inline-flex
@@ -492,12 +485,12 @@ body > main > div > section:nth-of-type(2) > div:nth-of-type(1) > div:nth-of-typ
font-size: inherit → 16px
line-height: inherit → 1.5
body > main > div > section:nth-of-type(1) > div:nth-of-type(1) [eyebrow] "PNG PROCESSING WORKSPACE"
color: #1769d2 [var(--blue)] → #6d7883 [var(--muted)]
body > main > div > section:nth-of-type(1) > div:nth-of-type(1) > span "/"
color: #6d7883 [var(--muted)] → #1769d2 [var(--blue)]
body > main > div > section:nth-of-type(1) > div:nth-of-type(2) [title-row]
align-items: center → flex-end
body > main > div > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(1) > h1 "Build your image pipeline."
max-width: 700px → —
line-height: 1 → 0.9
@@ -1063,11 +1056,6 @@ body > main > div > section:nth-of-type(1) > div:nth-of-type(5) > button [reset
body > main > div > section:nth-of-type(1) > div:nth-of-type(5) > button > svg [lucide lucide-icon lucide-rotate-ccw]
line-height: inherit → 1.5
body > main > div > section:nth-of-type(1) > div:nth-of-type(5) > span > i [status-dot]
width: 6px → 8px
height: 6px → 8px
box-shadow: — → 0 0 0 2px color-mix(in srgb, #25a96a 25%, transparent) [0 0 0 2px color-mix(in srgb, var(--success) 25%, transparent)]
body > main > div > section:nth-of-type(1) > div:nth-of-type(3) [section-label]
row-gap: — → 16px
column-gap: — → 16px
@@ -1125,25 +1113,18 @@ body >div
✗ present in reference, absent in project
=== [768x1024] /preview/list-tools (vs list-tools.html) — 155 differences ===
=== [768x1024] /preview/list-tools (vs list-tools.html) — 154 differences ===
body > main > header [topbar]
position: — → sticky
top: — → 0px
z-index: — → 20
h: 79 → 64 (-15px)
body > main > header > a > span:nth-of-type(1) [brand-mark] "EP"
w: 30 → 15 (-15px)
body > main > header > a > span:nth-of-type(3) [version] "/ CATALOG"
color: #6d7883 [var(--muted)] → #1769d2 [var(--blue)]
w: 30 → 15.4 (-14.6px)
body > main > header > div > span > i [status-dot]
display: — → inline-block
width: 6px → 8px
height: 6px → 8px
box-shadow: — → 0 0 0 2px color-mix(in srgb, #25a96a 25%, transparent) [0 0 0 2px color-mix(in srgb, var(--success) 25%, transparent)]
w: 0 → 3.3 (+3.3px)
h: 0 → 6 (+6px)
body > main > header > div > button:nth-of-type(1) [icon-btn icon-btn--bare]
display: grid → inline-flex
@@ -1228,6 +1209,7 @@ body > main > div > div:nth-of-type(1) [catalog-head]
body > main > div > div:nth-of-type(1) > div:nth-of-type(1) > div [eyebrow] "EASY-PNG-TOOLS / CATALOG"
margin-bottom: 18px → 0.5rem
color: #1769d2 [var(--blue)] → #6d7883 [var(--muted)]
letter-spacing: 0.12em → 0.18em
body > main > div > div:nth-of-type(1) > div:nth-of-type(1) > h1 "Tool catalog"
@@ -1896,25 +1878,18 @@ body >div
✗ present in reference, absent in project
=== [768x1024] /preview/tools/linear-gradient-png (vs gradient.html) — 93 differences ===
=== [768x1024] /preview/tools/linear-gradient-png (vs gradient.html) — 92 differences ===
body > main > header [topbar]
position: — → sticky
top: — → 0px
z-index: — → 20
h: 79 → 64 (-15px)
body > main > header > a > span:nth-of-type(1) [brand-mark] "EP"
w: 30 → 14.6 (-15.4px)
body > main > header > a > span:nth-of-type(3) [version] "/ GRADIENT"
color: #6d7883 [var(--muted)] → #1769d2 [var(--blue)]
body > main > header > div > span > i [status-dot]
display: — → inline-block
width: 6px → 8px
height: 6px → 8px
box-shadow: — → 0 0 0 2px color-mix(in srgb, #25a96a 25%, transparent) [0 0 0 2px color-mix(in srgb, var(--success) 25%, transparent)]
w: 0 → 4.7 (+4.7px)
h: 0 → 6 (+6px)
body > main > header > div > button:nth-of-type(1) [icon-btn icon-btn--bare]
display: grid → inline-flex
@@ -1992,7 +1967,7 @@ body > main > div [tool-page]
body > main > div > div:nth-of-type(1) [eyebrow] "PNG PROCESSING SINGLE TOOL"
margin-bottom: 18px → —
color: #6d7883 [var(--muted)] → #17212b [var(--foreground)]
color: #1769d2 [var(--blue)] → #17212b [var(--foreground)]
font-family: — → "IBM Plex Sans", sans-serif [var(--font-sans)]
font-size: — → 16px
line-height: — → 1.5
@@ -2566,25 +2541,18 @@ body >div
✗ present in reference, absent in project
=== [768x1024] /preview/tools/remove-background-png (vs background-remover.html) — 101 differences ===
=== [768x1024] /preview/tools/remove-background-png (vs background-remover.html) — 100 differences ===
body > main > header [topbar]
position: — → sticky
top: — → 0px
z-index: — → 20
h: 79 → 64 (-15px)
body > main > header > a > span:nth-of-type(1) [brand-mark] "EP"
w: 30 → 14.6 (-15.4px)
body > main > header > a > span:nth-of-type(3) [version] "/ BACKGROUND REMOVER"
color: #6d7883 [var(--muted)] → #1769d2 [var(--blue)]
body > main > header > div > span > i [status-dot]
display: — → inline-block
width: 6px → 8px
height: 6px → 8px
box-shadow: — → 0 0 0 2px color-mix(in srgb, #25a96a 25%, transparent) [0 0 0 2px color-mix(in srgb, var(--success) 25%, transparent)]
w: 0 → 4.8 (+4.8px)
h: 0 → 6 (+6px)
body > main > header > div > button:nth-of-type(1) [icon-btn icon-btn--bare]
display: grid → inline-flex
@@ -2662,7 +2630,7 @@ body > main > div [tool-page]
body > main > div > div:nth-of-type(1) [eyebrow] "PNG PROCESSING SINGLE TOOL"
margin-bottom: 18px → —
color: #6d7883 [var(--muted)] → #17212b [var(--foreground)]
color: #1769d2 [var(--blue)] → #17212b [var(--foreground)]
font-family: — → "IBM Plex Sans", sans-serif [var(--font-sans)]
font-size: — → 16px
line-height: — → 1.5
@@ -2816,7 +2784,7 @@ body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-typ
body > main > div > div:nth-of-type(3) > section:nth-of-type(1) > div:nth-of-type(2) > div:nth-of-type(2) [color-reference] "sampled from image background"
display: flex → —
justify-content: space-between → —
justify-content: flex-start → —
row-gap: 8px → —
column-gap: 8px → —
margin-top: 10px → —