diff --git a/src/app/ajuda/page.js b/src/app/ajuda/page.js
index d6c0d0544505868a320c4558cb6e619fbcc3d2c7..472b5a3e232c20219489b4c936f4d1a9979c3db5 100644
--- a/src/app/ajuda/page.js
+++ b/src/app/ajuda/page.js
@@ -12,7 +12,7 @@ export default function Help() {
let info = [
{
- image: <ImArrowUp color="#FFFFFF" size="50%"/>,
+ image: <ImArrowUp className="text-button-filters" size="50%"/>,
title: "Publicando Recursos",
questions: [
"Por que enviar um recurso?",
@@ -21,7 +21,7 @@ export default function Help() {
]
},
{
- image: <BiSearchAlt color="#FFFFFF" size="50%"/>,
+ image: <BiSearchAlt className="text-button-filters" size="50%"/>,
title: "Encontrando Recursos",
questions: [
"Como fazer uma busca?",
@@ -30,7 +30,7 @@ export default function Help() {
]
},
{
- image: <BiSolidMessageAlt color="#FFFFFF" size="50%"/>,
+ image: <BiSolidMessageAlt className="text-button-filters" size="50%"/>,
title: "Participando da Rede",
questions: [
"Como comentar ou avaliar um recurso?",
@@ -38,7 +38,7 @@ export default function Help() {
]
},
{
- image: <HiPencilAlt color="#FFFFFF" size="50%"/>,
+ image: <HiPencilAlt className="text-button-filters" size="50%"/>,
title: "Gerenciando a Conta",
questions: [
"Por que se cadastrar?",
diff --git a/src/app/components/MenuProfile.js b/src/app/components/MenuProfile.js
index 4a295f578a12d3c64e818810e22bdfe4e962007e..142520a0b0be26d8dd9a44ee76314b474f146d82 100644
--- a/src/app/components/MenuProfile.js
+++ b/src/app/components/MenuProfile.js
@@ -5,6 +5,7 @@ import Menu from "@mui/material/Menu";
import MenuItem from "@mui/material/MenuItem";
import Divider from "@mui/material/Divider";
import IconButton from "@mui/material/IconButton";
+import MarkunreadIcon from '@mui/icons-material/Markunread';
import Logout from "@mui/icons-material/Logout";
import { useState, useEffect } from "react";
import { useRouter } from "next/navigation";
@@ -47,7 +48,6 @@ const items = [
icon: AccessibilityNewRoundedIcon,
target: 3
}
-
];
function getRandomBg(id) {
diff --git a/src/app/contato/page.js b/src/app/contato/page.js
index 00bdaa42797d0c53f6b5e5e6c4123a1c183311f7..f452bb9debc739630caae702acb6511c4c16c200 100644
--- a/src/app/contato/page.js
+++ b/src/app/contato/page.js
@@ -1,10 +1,12 @@
"use client";
import { Card } from "@mui/material";
-import { useState, useEffect } from "react";
+import { useState, useLayoutEffect } from "react";
import Overlay from "../components/Overlay";
import { TextField, Button, InputLabel } from "@mui/material";
import mecredApi from "@/axiosConfig";
import { Modal } from "@mui/material";
+import theme from "@/app/theme";
+
export default function Contact() {
const [userName, setUserName] = useState("");
@@ -13,6 +15,13 @@ export default function Contact() {
const [errorMessage, setErrorMessage] = useState("");
const [successOpen, setSuccessOpen] = useState(false)
+ useLayoutEffect(() => {
+ const tailwindPrimaryColor = window.getComputedStyle(document.documentElement).getPropertyValue('--input-text'); // Replace with your actual CSS variable name
+ theme.palette.primary.contrastText = tailwindPrimaryColor.trim();
+
+ }, [userName, userEmail, userMessage])
+
+
const handleUserNameChange = (e) => {
setUserName(e.target.value);
};
@@ -26,7 +35,7 @@ export default function Contact() {
setUserMessage(e.target.value);
};
- const sendMessage = async (event, name, email, message) => {
+ const sendMessage = async (event) => {
event.preventDefault();
await mecredApi
.post("/contacts", {
@@ -79,20 +88,29 @@ export default function Contact() {
}}
>
<form onSubmit={sendMessage} className="mb-5">
- <div className="flex flex-col justify-center text-center items-center gap-8 mt-16">
+ <div className="flex flex-col justify-center text-center items-center gap-8 mt-16 ">
<p className="text-2xl font-bold">Contato</p>
<p className="text-xl font-light">Entre em contato para enviar dúvidas, sugestões ou crÃticas.</p>
<TextField
+ className="outline outline-1 outline-outlineColor"
required
label="Nome"
alt="Nome"
sx={{
width: 346,
marginTop: 2,
+
+ ".MuiOutlinedInput-root": {
+ color: theme.palette.primary.contrastText
+ },
+ ".MuiInputBase-input": {
+ color: theme.palette.primary.contrastText,
+ }
}}
onChange={handleUserNameChange}
/>
<TextField
+ className="outline outline-1 outline-outlineColor"
required
label="E-mail"
alt="E-mail"
@@ -100,10 +118,18 @@ export default function Contact() {
sx={{
width: 346,
marginTop: 2,
+
+ ".MuiOutlinedInput-root": {
+ color: theme.palette.primary.contrastText
+ },
+ ".MuiInputBase-input": {
+ color: theme.palette.primary.contrastText
+ }
}}
onChange={handleUserEmailChange}
/>
<TextField
+ className="outline outline-1 outline-outlineColor"
required
multiline
rows={5}
@@ -112,6 +138,13 @@ export default function Contact() {
sx={{
width: 346,
marginTop: 2,
+
+ ".MuiOutlinedInput-root": {
+ color: theme.palette.primary.contrastText
+ },
+ ".MuiInputBase-input": {
+ color: theme.palette.primary.contrastText
+ }
}}
onChange={handleUserMessageChange}
/>
diff --git a/src/app/globals.css b/src/app/globals.css
index 223296789734b844742f8a40c370ac7cb0c3e35e..4289be45f4aac39b31b3ba1b3c5b09a9e5128e7c 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -45,6 +45,7 @@
rgba(245, 249, 249, 1)),
url("/images/fundo.webp");
--logo: url("/mecred.svg");
+ --input-text: #000000;
}
@import "themes/theme_high_contrast.css";
@import "themes/tema_especial.css";
diff --git a/src/app/themes/tema_especial.css b/src/app/themes/tema_especial.css
index 0b6560a504cb56c83393501b04bd344ad867a508..6897692ac2d7fac8d4839253558843b3f1674f3e 100644
--- a/src/app/themes/tema_especial.css
+++ b/src/app/themes/tema_especial.css
@@ -14,4 +14,6 @@ html[data-theme="tema_especial"] {
--button-filters: #771244;
--text-filter: #ffffff;
--gray-color: #ffff00;
+ --input-text: #ffffff;
+
}
\ No newline at end of file
diff --git a/src/app/themes/theme_high_contrast.css b/src/app/themes/theme_high_contrast.css
index 7301e29d14abcb5d599bd1ab32d8cf691bf2505d..001bcd3c6b085df08cae23edca4e46f3400e39e6 100644
--- a/src/app/themes/theme_high_contrast.css
+++ b/src/app/themes/theme_high_contrast.css
@@ -27,6 +27,7 @@ html[data-theme="theme_high_contrast"] {
rgba(0, 0, 0, 1)),
url("/images/fundo.webp");
--logo: url("/mecred_white.svg");
+ --input-text: #ffffff;
}
.text-main-text[data-theme="theme_high_contrast"] {
diff --git a/tailwind.config.js b/tailwind.config.js
index ade8d566a5806ffac1b8e90d2a2bf11b9c1b94cd..05fad1eb0fc987838acefceea9c9e56cdbfaa907 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -35,6 +35,7 @@ module.exports = {
"grey-button": 'var(--grey-button)',
"blue-button": 'var(--blue-button)',
"white-draw": 'var(--white-draw)',
+ "input-text": 'var(--input-text)',
},
backgroundImage: {
"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",