fix: preserve reusable contact linework ratio

This commit is contained in:
Keith Solomon
2026-06-27 21:38:58 -05:00
parent f0c5c47297
commit ca8f5c939d
2 changed files with 5 additions and 0 deletions
+4
View File
@@ -385,9 +385,12 @@ test("mobile contact card matches the 402px reference geometry", async ({
const media = clone.querySelector(".contact-block__media"); const media = clone.querySelector(".contact-block__media");
const content = clone.querySelector(".contact-block__content"); const content = clone.querySelector(".contact-block__content");
const linework = clone.querySelector(".contact-block__linework");
const lineworkBox = linework.getBoundingClientRect();
const styles = { const styles = {
borderRadius: getComputedStyle(clone).borderRadius, borderRadius: getComputedStyle(clone).borderRadius,
contentPaddingLeft: getComputedStyle(content).paddingLeft, contentPaddingLeft: getComputedStyle(content).paddingLeft,
lineworkRatio: lineworkBox.width / lineworkBox.height,
maskImage: getComputedStyle(media).maskImage, maskImage: getComputedStyle(media).maskImage,
overlay: getComputedStyle(media, "::after").backgroundImage, overlay: getComputedStyle(media, "::after").backgroundImage,
}; };
@@ -398,6 +401,7 @@ test("mobile contact card matches the 402px reference geometry", async ({
expect(reusableStyles.borderRadius).toBe("12px 12px 0px 0px"); expect(reusableStyles.borderRadius).toBe("12px 12px 0px 0px");
expect(reusableStyles.contentPaddingLeft).toBe("24px"); expect(reusableStyles.contentPaddingLeft).toBe("24px");
expectNear(reusableStyles.lineworkRatio, 628 / 282, 0.03);
expect(reusableStyles.maskImage).toContain("linear-gradient"); expect(reusableStyles.maskImage).toContain("linear-gradient");
expect(reusableStyles.overlay).toBe("none"); expect(reusableStyles.overlay).toBe("none");
}); });
@@ -76,6 +76,7 @@
.contact-block .contact-block__linework { .contact-block .contact-block__linework {
bottom: 0.75rem; bottom: 0.75rem;
height: auto;
max-width: 112%; max-width: 112%;
right: -32%; right: -32%;
width: 22rem; width: 22rem;