From 6f457161ad8e7bb61c4f0eb798bdd25812257eee Mon Sep 17 00:00:00 2001 From: Dominik Hryshaiev Date: Sun, 14 Dec 2025 21:02:15 +0100 Subject: [PATCH] feat: add more intricate sample email html to showcase postcss parsing --- .../custom/email-content-preview.tsx | 2 +- src/lib/sample-email-html.ts | 243 ++++++++++++++---- 2 files changed, 187 insertions(+), 58 deletions(-) diff --git a/src/components/custom/email-content-preview.tsx b/src/components/custom/email-content-preview.tsx index 5abcfea..e7ed02f 100644 --- a/src/components/custom/email-content-preview.tsx +++ b/src/components/custom/email-content-preview.tsx @@ -56,7 +56,7 @@ export function EmailContentPreview({ html }: EmailPreviewProps) { return (
-
+

Preview

{EMAIL_CLIENTS.map((client) => { diff --git a/src/lib/sample-email-html.ts b/src/lib/sample-email-html.ts index 731cb31..ad901b3 100644 --- a/src/lib/sample-email-html.ts +++ b/src/lib/sample-email-html.ts @@ -16,6 +16,18 @@ export const sampleEmailHtml = ` @@ -61,38 +202,42 @@ export const sampleEmailHtml = ` - - + +
- + - + - + -
- Acme Inc +
+ Acme Inc +
- Weekly Digest +
+ Weekly Digest +
-

+

+

Your Week in Review

-

- Hi Dominik, here's what happened this week at Acme. We shipped some exciting updates and have a special offer just for you. +

+ Hi there, here's what happened this week at Acme. We shipped some exciting updates and have a special offer just for you.

- + - @@ -101,43 +246,27 @@ export const sampleEmailHtml = ` - + @@ -155,11 +284,11 @@ export const sampleEmailHtml = ` From the Blog - +
- + + View Dashboard →
- - - - - - - - - -
- - - - -
-

🚀

-

New: Dark Mode

-

- Easy on the eyes, day or night. Enable it in settings. -

-
- 		  - - - - -
-

📊

-

Analytics v2

-

- Redesigned charts with real-time data updates. -

-
-
+
+ +
+

🚀

+

New: Dark Mode

+

+ Easy on the eyes, day or night. +

+
+ +
+

📊

+

Analytics v2

+

+ Redesigned with real-time updates. +

+
+
- + How We Reduced Load Times by 60%

@@ -184,22 +313,22 @@ export const sampleEmailHtml = `

- +
- Twitter + Twitter - LinkedIn + LinkedIn - GitHub + GitHub