Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(tailwind): extract pseudo classes to stylesheet #1864

Open
wants to merge 35 commits into
base: canary
Choose a base branch
from
Open
Changes from 1 commit
Commits
Show all changes
35 commits
Select commit Hold shift + click to select a range
aaabd3e
chore(deps): update dependency @changesets/cli to v2.27.10 (#1794)
renovate[bot] Dec 9, 2024
cb24580
chore(deps): bump next from 14.2.3 to 15.0.4 (#1810)
dependabot[bot] Dec 9, 2024
4b0d2ae
feat(tailwind): extract pseudo classes to stylesheet
Sjoertjuh Jan 13, 2025
1748335
fix(react-email): Respect user NODE_ENV (#1756)
AshotN Jan 9, 2025
6c4de38
Merge remote-tracking branch 'upstream/canary' into feature/extract-t…
Sjoertjuh Jan 13, 2025
c97cd9e
chore(tailwind): formatting
Sjoertjuh Jan 13, 2025
fe2573d
chore(tailwind): add changeset
Sjoertjuh Jan 13, 2025
20843ee
fix name for tests
gabrielmfern Jan 14, 2025
5275dfc
remove obsolete snaps
gabrielmfern Jan 14, 2025
a15b0b0
add test to ensure the media query is handled properly
gabrielmfern Jan 14, 2025
1d9227a
feat(tailwind): add support for pseudo selectors with media queries
Sjoertjuh Jan 20, 2025
cde2372
fix(react-email): Respect user NODE_ENV (#1756)
AshotN Jan 9, 2025
ef85014
fix(react-email): Active state for root emails not appearing
gabrielmfern Jan 15, 2025
c01b9ad
fix(all): Use optional chain (#1820)
bukinoshita Jan 16, 2025
0aea791
chore(all): use biome (#1833)
bukinoshita Jan 16, 2025
840f1fc
fix(render): Prettier breaking if mso comments (#1839)
gabrielmfern Jan 22, 2025
12d007e
chore: upgrade esbuild (#1817)
LucianBuzzo Jan 22, 2025
25d67a7
chore(deps): update dependency vite to v5.4.12 [security] (#1873)
renovate[bot] Jan 22, 2025
0763b87
chore(root): Bump for canary release (#1875)
gabrielmfern Jan 22, 2025
0c79f23
chore(deps-dev): bump vite from 5.4.12 to 5.4.13 (#1876)
dependabot[bot] Jan 22, 2025
ee6d8fb
fix(deps): update dependency tinybench to v3 (#1868)
renovate[bot] Jan 22, 2025
aef20d1
chore(tailwind): extract selector processing from sanitization functions
Sjoertjuh Jan 23, 2025
70e2e53
Merge remote-tracking branch 'upstream/canary' into feature/extract-t…
Sjoertjuh Jan 23, 2025
1e5edc1
chore: linting
Sjoertjuh Jan 23, 2025
c78b55d
chore(tailwind): dont capitalize test name
Sjoertjuh Jan 24, 2025
6c964e6
fix(react-email): Respect user NODE_ENV (#1756)
AshotN Jan 9, 2025
e140d3a
fix(react-email): Active state for root emails not appearing
gabrielmfern Jan 15, 2025
555b1de
fix(render): Prettier breaking if mso comments (#1839)
gabrielmfern Jan 22, 2025
a752e40
chore: upgrade esbuild (#1817)
LucianBuzzo Jan 22, 2025
3fcb720
chore(deps): update dependency vite to v5.4.12 [security] (#1873)
renovate[bot] Jan 22, 2025
4402a44
chore(root): Bump for canary release (#1875)
gabrielmfern Jan 22, 2025
736710d
chore(deps-dev): bump vite from 5.4.12 to 5.4.13 (#1876)
dependabot[bot] Jan 22, 2025
6b36890
fix(deps): update dependency tinybench to v3 (#1868)
renovate[bot] Jan 22, 2025
301f54b
fix(render): Prettier cutting off templates under certain conditions …
gabrielmfern Jan 27, 2025
3f49802
Merge remote-tracking branch 'upstream/canary' into feature/extract-t…
Sjoertjuh Jan 28, 2025
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
The table of contents is too big for display.
Diff view
Diff view
Prev Previous commit
Next Next commit
chore(all): use biome (#1833)
Signed-off-by: dependabot[bot] <[email protected]>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: gabriel miranda <[email protected]>
3 people committed Jan 22, 2025

Unverified

This commit is not signed, but one or more authors requires that any commit attributed to them is signed.
commit 0aea7915dfec19dfa7752c71812d47926dc51dff
4 changes: 1 addition & 3 deletions .changeset/config.json
Original file line number Diff line number Diff line change
@@ -2,9 +2,7 @@
"$schema": "https://unpkg.com/@changesets/[email protected]/schema.json",
"changelog": "@changesets/cli/changelog",
"commit": false,
"fixed": [
["react-email-starter", "create-email"]
],
"fixed": [["react-email-starter", "create-email"]],
"linked": [],
"access": "public",
"baseBranch": "main",
42 changes: 6 additions & 36 deletions .github/workflows/tests.yml
Original file line number Diff line number Diff line change
@@ -5,37 +5,7 @@ on:
- main
pull_request:
jobs:
format:
runs-on: buildjet-4vcpu-ubuntu-2204
container:
image: node:18
steps:
- name: Checkout
uses: actions/checkout@v4

- name: Enable Corepack
id: pnpm-setup
run: |
corepack enable
corepack prepare pnpm@latest --activate
pnpm config set script-shell "/usr/bin/bash"
echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"

- name: pnpm Cache
uses: buildjet/cache@v4
with:
path: ${{ steps.pnpm-setup.outputs.pnpm_cache_dir }}
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-pnpm-store-

- name: Install packages
run: pnpm install --frozen-lockfile

- name: Run Format Check
run: pnpm format:check

test:
lint:
runs-on: buildjet-4vcpu-ubuntu-2204
container:
image: node:18
@@ -65,10 +35,10 @@ jobs:
- name: Run Build
run: pnpm build

- name: Run Tests
run: pnpm test
- name: Run Lint
run: pnpm lint

lint:
test:
runs-on: buildjet-4vcpu-ubuntu-2204
container:
image: node:18
@@ -98,8 +68,8 @@ jobs:
- name: Run Build
run: pnpm build

- name: Run Lint
run: pnpm lint
- name: Run Tests
run: pnpm test

build:
runs-on: buildjet-4vcpu-ubuntu-2204
1 change: 0 additions & 1 deletion .prettierignore

This file was deleted.

1 change: 0 additions & 1 deletion .prettierrc

This file was deleted.

88 changes: 44 additions & 44 deletions apps/demo/emails/magic-links/aws-verify-email.tsx
Original file line number Diff line number Diff line change
@@ -10,19 +10,19 @@ import {
Preview,
Section,
Text,
} from "@react-email/components";
import * as React from "react";
} from '@react-email/components';
import * as React from 'react';

interface AWSVerifyEmailProps {
verificationCode?: string;
}

const baseUrl = process.env.VERCEL_URL
? `https://${process.env.VERCEL_URL}`
: "";
: '';

export default function AWSVerifyEmail({
verificationCode = "596853",
verificationCode = '596853',
}: AWSVerifyEmailProps) {
return (
<Html>
@@ -68,11 +68,11 @@ export default function AWSVerifyEmail({
This message was produced and distributed by Amazon Web Services,
Inc., 410 Terry Ave. North, Seattle, WA 98109. © 2022, Amazon Web
Services, Inc.. All rights reserved. AWS is a registered trademark
of{" "}
of{' '}
<Link href="https://amazon.com" target="_blank" style={link}>
Amazon.com
</Link>
, Inc. View our{" "}
, Inc. View our{' '}
<Link href="https://amazon.com" target="_blank" style={link}>
privacy policy
</Link>
@@ -85,88 +85,88 @@ export default function AWSVerifyEmail({
}

const main = {
backgroundColor: "#fff",
color: "#212121",
backgroundColor: '#fff',
color: '#212121',
};

const container = {
padding: "20px",
margin: "0 auto",
backgroundColor: "#eee",
padding: '20px',
margin: '0 auto',
backgroundColor: '#eee',
};

const h1 = {
color: "#333",
color: '#333',
fontFamily:
"-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif",
fontSize: "20px",
fontWeight: "bold",
marginBottom: "15px",
fontSize: '20px',
fontWeight: 'bold',
marginBottom: '15px',
};

const link = {
color: "#2754C5",
color: '#2754C5',
fontFamily:
"-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif",
fontSize: "14px",
textDecoration: "underline",
fontSize: '14px',
textDecoration: 'underline',
};

const text = {
color: "#333",
color: '#333',
fontFamily:
"-apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif",
fontSize: "14px",
margin: "24px 0",
fontSize: '14px',
margin: '24px 0',
};

const imageSection = {
backgroundColor: "#252f3d",
display: "flex",
padding: "20px 0",
alignItems: "center",
justifyContent: "center",
backgroundColor: '#252f3d',
display: 'flex',
padding: '20px 0',
alignItems: 'center',
justifyContent: 'center',
};

const coverSection = { backgroundColor: "#fff" };
const coverSection = { backgroundColor: '#fff' };

const upperSection = { padding: "25px 35px" };
const upperSection = { padding: '25px 35px' };

const lowerSection = { padding: "25px 35px" };
const lowerSection = { padding: '25px 35px' };

const footerText = {
...text,
fontSize: "12px",
padding: "0 20px",
fontSize: '12px',
padding: '0 20px',
};

const verifyText = {
...text,
margin: 0,
fontWeight: "bold",
textAlign: "center" as const,
fontWeight: 'bold',
textAlign: 'center' as const,
};

const codeText = {
...text,
fontWeight: "bold",
fontSize: "36px",
margin: "10px 0",
textAlign: "center" as const,
fontWeight: 'bold',
fontSize: '36px',
margin: '10px 0',
textAlign: 'center' as const,
};

const validityText = {
...text,
margin: "0px",
textAlign: "center" as const,
margin: '0px',
textAlign: 'center' as const,
};

const verificationSection = {
display: "flex",
alignItems: "center",
justifyContent: "center",
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
};

const mainText = { ...text, marginBottom: "14px" };
const mainText = { ...text, marginBottom: '14px' };

const cautionText = { ...text, margin: "0px" };
const cautionText = { ...text, margin: '0px' };
80 changes: 40 additions & 40 deletions apps/demo/emails/magic-links/linear-login-code.tsx
Original file line number Diff line number Diff line change
@@ -11,16 +11,16 @@ import {
Preview,
Section,
Text,
} from "@react-email/components";
import * as React from "react";
} from '@react-email/components';
import * as React from 'react';

interface LinearLoginCodeEmailProps {
validationCode?: string;
}

const baseUrl = process.env.VERCEL_URL
? `https://${process.env.VERCEL_URL}`
: "";
: '';

export const LinearLoginCodeEmail = ({
validationCode,
@@ -58,7 +58,7 @@ export const LinearLoginCodeEmail = ({
);

LinearLoginCodeEmail.PreviewProps = {
validationCode: "tt226-5398x",
validationCode: 'tt226-5398x',
} as LinearLoginCodeEmailProps;

export default LinearLoginCodeEmail;
@@ -70,66 +70,66 @@ const logo = {
};

const main = {
backgroundColor: "#ffffff",
backgroundColor: '#ffffff',
fontFamily:
'-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif',
};

const container = {
margin: "0 auto",
padding: "20px 0 48px",
maxWidth: "560px",
margin: '0 auto',
padding: '20px 0 48px',
maxWidth: '560px',
};

const heading = {
fontSize: "24px",
letterSpacing: "-0.5px",
lineHeight: "1.3",
fontWeight: "400",
color: "#484848",
padding: "17px 0 0",
fontSize: '24px',
letterSpacing: '-0.5px',
lineHeight: '1.3',
fontWeight: '400',
color: '#484848',
padding: '17px 0 0',
};

const paragraph = {
margin: "0 0 15px",
fontSize: "15px",
lineHeight: "1.4",
color: "#3c4149",
margin: '0 0 15px',
fontSize: '15px',
lineHeight: '1.4',
color: '#3c4149',
};

const buttonContainer = {
padding: "27px 0 27px",
padding: '27px 0 27px',
};

const button = {
backgroundColor: "#5e6ad2",
borderRadius: "3px",
fontWeight: "600",
color: "#fff",
fontSize: "15px",
textDecoration: "none",
textAlign: "center" as const,
display: "block",
padding: "11px 23px",
backgroundColor: '#5e6ad2',
borderRadius: '3px',
fontWeight: '600',
color: '#fff',
fontSize: '15px',
textDecoration: 'none',
textAlign: 'center' as const,
display: 'block',
padding: '11px 23px',
};

const reportLink = {
fontSize: "14px",
color: "#b4becc",
fontSize: '14px',
color: '#b4becc',
};

const hr = {
borderColor: "#dfe1e4",
margin: "42px 0 26px",
borderColor: '#dfe1e4',
margin: '42px 0 26px',
};

const code = {
fontFamily: "monospace",
fontWeight: "700",
padding: "1px 4px",
backgroundColor: "#dfe1e4",
letterSpacing: "-0.3px",
fontSize: "21px",
borderRadius: "4px",
color: "#3c4149",
fontFamily: 'monospace',
fontWeight: '700',
padding: '1px 4px',
backgroundColor: '#dfe1e4',
letterSpacing: '-0.3px',
fontSize: '21px',
borderRadius: '4px',
color: '#3c4149',
};
Loading