From 993efbc9ead792254b7a2010199de6ac84e7fb07 Mon Sep 17 00:00:00 2001 From: rharkor Date: Mon, 27 May 2024 13:01:50 +0200 Subject: [PATCH] fix: emails colors --- apps/app/.env.example | 2 +- apps/app/src/constants/medias.ts | 3 ++- packages/emails/components/body.tsx | 2 +- packages/emails/components/button.tsx | 2 +- packages/emails/components/card.tsx | 2 +- packages/emails/components/footer.tsx | 4 ++-- packages/emails/components/header.tsx | 4 +++- packages/emails/components/link.tsx | 2 +- packages/emails/{contants.ts => constants.ts} | 2 +- packages/emails/emails/change-email-otp.tsx | 7 ++++--- packages/emails/emails/reset-password.tsx | 5 +++-- packages/emails/emails/verify-email.tsx | 5 +++-- 12 files changed, 23 insertions(+), 17 deletions(-) rename packages/emails/{contants.ts => constants.ts} (95%) diff --git a/apps/app/.env.example b/apps/app/.env.example index f3642cd9..e5cfd98a 100644 --- a/apps/app/.env.example +++ b/apps/app/.env.example @@ -26,7 +26,7 @@ SMTP_PASSWORD=secret SMTP_FROM_NAME=FromName SMTP_FROM_EMAIL=email@example.com NEXT_PUBLIC_ENABLE_MAILING_SERVICE=false -SUPPORT_EMAIL=support@example.com +SUPPORT_EMAIL=louis@huort.com S3_REGION=fr-par NEXT_PUBLIC_S3_BUCKET_NAME=secret S3_ACCESS_KEY_ID=secret diff --git a/apps/app/src/constants/medias.ts b/apps/app/src/constants/medias.ts index df457e90..9dceb56b 100644 --- a/apps/app/src/constants/medias.ts +++ b/apps/app/src/constants/medias.ts @@ -1 +1,2 @@ -export const logoUrl = "https://upload.wikimedia.org/wikipedia/commons/5/5e/Vercel_logo_black.svg" +export const logoUrl = + "https://imgs.search.brave.com/I_nW-x21BB6_TTk_xXuYVy5pZlaMfv0h4q35oqhrxvc/rs:fit:860:0:0/g:ce/aHR0cHM6Ly9zZWVr/bG9nby5jb20vaW1h/Z2VzL04vbmV4dC1q/cy1pY29uLWxvZ28t/RUUzMDJENURCRC1z/ZWVrbG9nby5jb20u/cG5n" diff --git a/packages/emails/components/body.tsx b/packages/emails/components/body.tsx index dfc11104..3b72f538 100644 --- a/packages/emails/components/body.tsx +++ b/packages/emails/components/body.tsx @@ -2,7 +2,7 @@ import React, { ReactNode } from "react" import { Body as OBody, BodyProps } from "@react-email/components" -import { background, foreground } from "../contants" +import { background, foreground } from "../constants" export const Body = ({ children, diff --git a/packages/emails/components/button.tsx b/packages/emails/components/button.tsx index a83be600..deb7fb4d 100644 --- a/packages/emails/components/button.tsx +++ b/packages/emails/components/button.tsx @@ -2,7 +2,7 @@ import React, { ReactNode } from "react" import { Button as OButton, ButtonProps } from "@react-email/components" -import { foreground, primary } from "../contants" +import { foreground, primary } from "../constants" export const Button = ({ children, diff --git a/packages/emails/components/card.tsx b/packages/emails/components/card.tsx index dc60c4b8..6a6865dd 100644 --- a/packages/emails/components/card.tsx +++ b/packages/emails/components/card.tsx @@ -2,7 +2,7 @@ import React, { ReactNode } from "react" import { Section as OSection, SectionProps } from "@react-email/components" -import { content1 } from "../contants" +import { content1 } from "../constants" export const Card = ({ children, diff --git a/packages/emails/components/footer.tsx b/packages/emails/components/footer.tsx index 381aed03..0387928e 100644 --- a/packages/emails/components/footer.tsx +++ b/packages/emails/components/footer.tsx @@ -2,7 +2,7 @@ import React from "react" import { Container, Hr, Img, Text } from "@react-email/components" -import { mutedForeground } from "../contants" +import { mutedForeground } from "../constants" import { Link } from "./link" @@ -32,7 +32,7 @@ export const Footer = ({
- Next boilerplate + Next boilerplate © {curYear} Next boilerplate - All rights reserved ) diff --git a/packages/emails/components/header.tsx b/packages/emails/components/header.tsx index d1f84636..71c03244 100644 --- a/packages/emails/components/header.tsx +++ b/packages/emails/components/header.tsx @@ -1,9 +1,11 @@ +import React from "react" + import { Img, Text } from "@react-email/components" export const Header = ({ logoUrl, titleText }: { logoUrl: string; titleText: string }) => { return ( <> - Next boilerplate + Next boilerplate {titleText} ) diff --git a/packages/emails/components/link.tsx b/packages/emails/components/link.tsx index 05d15380..0c716832 100644 --- a/packages/emails/components/link.tsx +++ b/packages/emails/components/link.tsx @@ -2,7 +2,7 @@ import React, { ReactNode } from "react" import { Link as OLink, LinkProps } from "@react-email/components" -import { primary } from "../contants" +import { primary } from "../constants" export const Link = ({ children, diff --git a/packages/emails/contants.ts b/packages/emails/constants.ts similarity index 95% rename from packages/emails/contants.ts rename to packages/emails/constants.ts index eac1f99d..838fcc24 100644 --- a/packages/emails/contants.ts +++ b/packages/emails/constants.ts @@ -1,5 +1,5 @@ export const primary = "#006FEE" -export const background = "#FFFFFF" +export const background = "#f4f4f5" export const content1 = "#FFFFFF" export const content2 = "#f4f4f5" export const content3 = "#e4e4e7" diff --git a/packages/emails/emails/change-email-otp.tsx b/packages/emails/emails/change-email-otp.tsx index ae41bf96..209a001a 100644 --- a/packages/emails/emails/change-email-otp.tsx +++ b/packages/emails/emails/change-email-otp.tsx @@ -1,4 +1,3 @@ -import { Header } from "components/header" import * as React from "react" import { CodeInline, Container as OContainer, Head, Html, Preview, Text } from "@react-email/components" @@ -7,7 +6,8 @@ import { Body } from "../components/body" import { Card } from "../components/card" import { Container } from "../components/container" import { Footer } from "../components/footer" -import { muted } from "../contants" +import { Header } from "../components/header" +import { muted } from "../constants" interface ChangeEmailProps { previewText: string @@ -54,7 +54,8 @@ export const ChangeEmail = ({ ) export const previewProps: ChangeEmailProps = { - logoUrl: "https://upload.wikimedia.org/wikipedia/commons/5/5e/Vercel_logo_black.svg", + logoUrl: + "https://imgs.search.brave.com/I_nW-x21BB6_TTk_xXuYVy5pZlaMfv0h4q35oqhrxvc/rs:fit:860:0:0/g:ce/aHR0cHM6Ly9zZWVr/bG9nby5jb20vaW1h/Z2VzL04vbmV4dC1q/cy1pY29uLWxvZ28t/RUUzMDJENURCRC1z/ZWVrbG9nby5jb20u/cG5n", name: "John Doe", previewText: "Confirm your new email", supportEmail: "louis@huort.com", diff --git a/packages/emails/emails/reset-password.tsx b/packages/emails/emails/reset-password.tsx index e641d21f..ba09878f 100644 --- a/packages/emails/emails/reset-password.tsx +++ b/packages/emails/emails/reset-password.tsx @@ -1,4 +1,3 @@ -import { Header } from "components/header" import * as React from "react" import { Head, Html, Preview, Text } from "@react-email/components" @@ -8,6 +7,7 @@ import { Button } from "../components/button" import { Card } from "../components/card" import { Container } from "../components/container" import { Footer } from "../components/footer" +import { Header } from "../components/header" interface ResetPasswordProps { resetLink: string @@ -54,7 +54,8 @@ export const ResetPassword = ({ ) export const previewProps: ResetPasswordProps = { - logoUrl: "https://upload.wikimedia.org/wikipedia/commons/5/5e/Vercel_logo_black.svg", + logoUrl: + "https://imgs.search.brave.com/I_nW-x21BB6_TTk_xXuYVy5pZlaMfv0h4q35oqhrxvc/rs:fit:860:0:0/g:ce/aHR0cHM6Ly9zZWVr/bG9nby5jb20vaW1h/Z2VzL04vbmV4dC1q/cy1pY29uLWxvZ28t/RUUzMDJENURCRC1z/ZWVrbG9nby5jb20u/cG5n", name: "John Doe", previewText: "Reset password request.", supportEmail: "louis@huort.com", diff --git a/packages/emails/emails/verify-email.tsx b/packages/emails/emails/verify-email.tsx index e8aa9a93..89c145ce 100644 --- a/packages/emails/emails/verify-email.tsx +++ b/packages/emails/emails/verify-email.tsx @@ -1,4 +1,3 @@ -import { Header } from "components/header" import * as React from "react" import { Head, Html, Preview, Text } from "@react-email/components" @@ -8,6 +7,7 @@ import { Button } from "../components/button" import { Card } from "../components/card" import { Container } from "../components/container" import { Footer } from "../components/footer" +import { Header } from "../components/header" interface VerifyEmailProps { verificationLink: string @@ -54,7 +54,8 @@ export const VerifyEmail = ({ ) export const previewProps: VerifyEmailProps = { - logoUrl: "https://upload.wikimedia.org/wikipedia/commons/5/5e/Vercel_logo_black.svg", + logoUrl: + "https://imgs.search.brave.com/I_nW-x21BB6_TTk_xXuYVy5pZlaMfv0h4q35oqhrxvc/rs:fit:860:0:0/g:ce/aHR0cHM6Ly9zZWVr/bG9nby5jb20vaW1h/Z2VzL04vbmV4dC1q/cy1pY29uLWxvZ28t/RUUzMDJENURCRC1z/ZWVrbG9nby5jb20u/cG5n", name: "John Doe", previewText: "Verify your email address to complete your registration.", supportEmail: "louis@huort.com",