diff --git a/src/components/BudgetContact/__tests__/BudgetContact.spec.tsx b/src/components/BudgetContact/__tests__/BudgetContact.spec.tsx
new file mode 100644
index 0000000..a60621e
--- /dev/null
+++ b/src/components/BudgetContact/__tests__/BudgetContact.spec.tsx
@@ -0,0 +1,12 @@
+import budgetEmail from '@/data/budgetEmail.json';
+import { render, screen } from '@/utils/testUtils';
+import { BudgetContact } from '..';
+
+test('button have the budget email link to reach me out', async () => {
+ render();
+
+ const button = screen.getByText(/obtenha um orçamento agora/i);
+ const emailLink = `mailto:${budgetEmail.recipient}?subject=${budgetEmail.subject}&body=${budgetEmail.body}`;
+
+ expect(button).toHaveAttribute('href', emailLink);
+});
diff --git a/src/components/BudgetContact/index.tsx b/src/components/BudgetContact/index.tsx
new file mode 100644
index 0000000..1c8b9da
--- /dev/null
+++ b/src/components/BudgetContact/index.tsx
@@ -0,0 +1,20 @@
+import budgetEmail from '@/data/budgetEmail.json';
+import { EnvelopeSimple } from '@phosphor-icons/react';
+
+export const BudgetContact: React.FC = () => {
+ const emailLink = `mailto:${budgetEmail.recipient}?subject=${budgetEmail.subject}&body=${budgetEmail.body}`;
+
+ return (
+
+
+ Obtenha um Orçamento Agora
+
+ );
+};
diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
index b36901f..0278e3d 100644
--- a/src/components/Header/index.tsx
+++ b/src/components/Header/index.tsx
@@ -1,5 +1,5 @@
import imgLogo from '@/assets/imgs/logo.svg';
-import { SendMeAnEmail } from '@/components/SendMeAnEmail';
+import { BudgetContact } from '@/components/BudgetContact';
import { Folders, IdentificationCard } from '@phosphor-icons/react';
type THeaderProps = React.HTMLAttributes;
@@ -46,7 +46,7 @@ export const Header: React.FC = ({ ...props }) => {
Projetos
-
+
diff --git a/src/components/MySocials/index.tsx b/src/components/MySocials/index.tsx
index e01ad8d..afd002f 100644
--- a/src/components/MySocials/index.tsx
+++ b/src/components/MySocials/index.tsx
@@ -20,7 +20,7 @@ export const MySocials: React.FC = ({ ...props }) => {
LinkedIn
@@ -29,7 +29,7 @@ export const MySocials: React.FC = ({ ...props }) => {
GitHub
@@ -38,7 +38,7 @@ export const MySocials: React.FC = ({ ...props }) => {
Currículo
diff --git a/src/components/SendMeAnEmail/__tests__/SendMeAnEmail.spec.tsx b/src/components/SendMeAnEmail/__tests__/SendMeAnEmail.spec.tsx
deleted file mode 100644
index 4800b07..0000000
--- a/src/components/SendMeAnEmail/__tests__/SendMeAnEmail.spec.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import { sendEmail } from '@/utils';
-import { fireEvent, render, screen } from '@/utils/testUtils';
-import { SendMeAnEmail, draftEmail } from '..';
-
-vi.mock('@/utils', () => ({
- sendEmail: vi.fn(),
-}));
-
-test('renders button with correct text', () => {
- render();
-
- expect(screen.getByText('Me mande um e-mail')).toBeInTheDocument();
-});
-
-test('call sendEmail function when button is clicked', () => {
- render();
-
- fireEvent.click(screen.getByText('Me mande um e-mail'));
- expect(sendEmail).toHaveBeenCalledTimes(1);
- expect(sendEmail).toHaveBeenCalledWith(draftEmail);
-});
diff --git a/src/components/SendMeAnEmail/index.tsx b/src/components/SendMeAnEmail/index.tsx
deleted file mode 100644
index 4a848ec..0000000
--- a/src/components/SendMeAnEmail/index.tsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import { sendEmail } from '@/utils';
-import { EnvelopeSimple } from '@phosphor-icons/react';
-
-export const draftEmail = {
- subject: 'Olá, Alberto! Acabo de ver seu portfólio, vamos conversar?',
- body: 'Seu email...',
- recipient: 'albertovinicius3@gmail.com',
-};
-
-export const SendMeAnEmail: React.FC = () => {
- return (
-
- );
-};
diff --git a/src/data/budgetEmail.json b/src/data/budgetEmail.json
new file mode 100644
index 0000000..113e044
--- /dev/null
+++ b/src/data/budgetEmail.json
@@ -0,0 +1,5 @@
+{
+ "subject": "Solicitação de Orçamento para Desenvolvimento de Website/E-commerce/Landing page",
+ "body": "Olá, Alberto! Espero que esteja tudo bem com você. Estou entrando em contato para discutir a possibilidade de agendar uma reunião ou uma chamada para discutir melhor as necessidades e os detalhes do meu projeto [Seu projeto]...",
+ "recipient": "albertovinicius3@gmail.com"
+}
\ No newline at end of file
diff --git a/src/styles/global.css b/src/styles/global.css
index 8d39004..6d198fe 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -37,10 +37,6 @@
@apply decoration-accent;
}
- button {
- @apply rounded bg-accent px-2 py-[2px] hover:bg-accent/90 active:bg-accent/70;
- }
-
a {
@apply underline hover:opacity-80;
}
@@ -101,8 +97,13 @@
}
@layer components {
- .social-link {
- @apply flex items-center gap-1 rounded-md px-2 py-1 text-lg font-normal shadow-2xl shadow-black/30 hover:opacity-50;
+ button,
+ .btn {
+ @apply rounded px-2 py-1;
+ }
+
+ .btn-accent {
+ @apply bg-accent hover:bg-accent/90 active:bg-accent/70;
}
.section__title {