From 71e9aa9383b85fbec81d84f7f902d52d195a4251 Mon Sep 17 00:00:00 2001 From: Gabriel372 Date: Sat, 27 Apr 2024 17:26:42 -0300 Subject: [PATCH] update --- src/components/BtnToggleMode.tsx | 8 ++++++-- src/components/MyTechs.tsx | 8 ++++---- src/components/MyTechsForMobile.tsx | 5 ++--- src/modals/ModalProject.module.css | 14 ++++++++++---- src/modals/ModalProject.tsx | 4 ++++ src/pages/Footer.tsx | 5 ++++- src/pages/Header.tsx | 2 +- 7 files changed, 31 insertions(+), 15 deletions(-) diff --git a/src/components/BtnToggleMode.tsx b/src/components/BtnToggleMode.tsx index 768726c..a70bfe5 100644 --- a/src/components/BtnToggleMode.tsx +++ b/src/components/BtnToggleMode.tsx @@ -37,8 +37,12 @@ setThemeIsDark(!ThemeIsDark) ; -return () diff --git a/src/components/MyTechs.tsx b/src/components/MyTechs.tsx index 2ca1a20..0b49398 100644 --- a/src/components/MyTechs.tsx +++ b/src/components/MyTechs.tsx @@ -19,15 +19,15 @@ function MyTechs() { const [TechClicked,setTechClicked] = useState('react') ; const StyleForLi = 'cursor-pointer flex flex-col rounded-t-xl px-2 pb-1 shadow-2xl border ml-3 ' -const ThemeForComponent = ThemeIsDark ? 'text-white bg-gray-800 duration-500 bg-gray-500 border-x-gray-500 border-b-gray-700' +const ThemeForComponent = ThemeIsDark ? 'text-white bg-gray-800 duration-500 border-x-gray-500 border-b-gray-700' :'duration-500 bg-white from-gray-600 to-white bg-gray-200 border-x-gray-300 border-t-gray-300 border-b-gray-300' function CatchTechGiveStyle (tech:string ){ if (ThemeIsDark) { - return (tech === TechClicked ? 'bg-gray-800 border-b-0 ' : 'bg-gray-900 border-gray-500 border-b-gray-500' ) + return (tech === TechClicked ? 'bg-gray-800 border-b-0 ' : 'bg-gray-900 border-gray-500 border-b-gray-500 hover:bg-gray-700' ) } else { - return (tech === TechClicked ? 'bg-white border-b-0 border-x-gray-300 border-t-gray-500' : 'bg-gray-200 border-b-gray-300' ) + return (tech === TechClicked ? 'bg-white border-b-0 border-x-gray-300 border-t-gray-500' : 'bg-gray-200 border-b-gray-300 hover:bg-white' ) } } @@ -58,7 +58,7 @@ onClick={()=>setTechClicked('react')}>React js image -
  • setTechClicked('typescript')}>Typescript image
    • diff --git a/src/components/MyTechsForMobile.tsx b/src/components/MyTechsForMobile.tsx index f24f96f..1b044b2 100644 --- a/src/components/MyTechsForMobile.tsx +++ b/src/components/MyTechsForMobile.tsx @@ -10,7 +10,6 @@ import CssImg from '../images/css3d.png' import Htmlimg from '../images/html3d.png' import GitImg from '../images/git3d.webp' import FirebaseImg from '../images/firebaseLogo.webp' -// import Firebase from '../images/firebaseLogo.webp' import { ReactText,TypescriptText,NextText,TailwindText,CssText,HtmlText,GitText,GithubText,FirebaseText,BoostrapText,JavascriptText } from './Content' import { MyContext } from "@/context/MyContext" import { TstateTheme } from "@/types/Types" @@ -38,10 +37,10 @@ function ReturnText() { } function CatchTechGiveStyle (tech:string ){ if (ThemeIsDark) { - return (tech === TechClicked ? 'bg-gray-700' : 'bg-gray-900 border-gray-500' ) + return (tech === TechClicked ? 'bg-gray-700' : 'bg-gray-900 border-gray-500 hover:bg-gray-700' ) } else { - return (tech === TechClicked ? 'bg-white border-gray-400' : 'bg-gray-200 border-b-gray-300' ) + return (tech === TechClicked ? 'bg-white border-gray-400' : 'bg-gray-200 border-b-gray-300 hover:bg-white' ) } } diff --git a/src/modals/ModalProject.module.css b/src/modals/ModalProject.module.css index 0248dd6..9a86211 100644 --- a/src/modals/ModalProject.module.css +++ b/src/modals/ModalProject.module.css @@ -43,16 +43,22 @@ color: white; background-color: black; color: white; } - + .divScroll{ + height: 100%; + width: 100%; + overflow-y: scroll; + display: flex; + justify-content: center; + align-items: center; + } + @media only screen and (max-height: 500px) { .dadSquare { - overflow-y: scroll; height: 100%; } .squareMod{ - max-height: 130vh; - + max-height: 150vh; } } diff --git a/src/modals/ModalProject.tsx b/src/modals/ModalProject.tsx index 0eb84a0..0680179 100644 --- a/src/modals/ModalProject.tsx +++ b/src/modals/ModalProject.tsx @@ -10,6 +10,8 @@ return (<> { Modal.IsOpen &&
    setModal({IsOpen:false,img:''})} className={`${style.containerMod} `} > +
    +

    e.stopPropagation()} src={Modal.img} alt="imagem" @@ -19,6 +21,8 @@ className={`${style.squareMod }`}/>
    +
    + } diff --git a/src/pages/Footer.tsx b/src/pages/Footer.tsx index aa3298d..5f50337 100644 --- a/src/pages/Footer.tsx +++ b/src/pages/Footer.tsx @@ -4,8 +4,11 @@ import { TstateTheme } from "@/types/Types"; function Footer() { const {ThemeIsDark} = useContext(MyContext) as TstateTheme ; - const ThemeForComponent = ThemeIsDark ? 'text-white bg-gray-800 duration-500 border-t-gray-700 ':'duration-500 bg-gradient-to-t from-gray-600 to-white' + const ThemeForComponent = ThemeIsDark ? 'bg-gradient-to-b from-black to-gray-500 text-white duration-500 border-t-gray-800 ':'duration-500 bg-gradient-to-t from-gray-600 to-white border-t-0' +//const ThemeForComponent = ThemeIsDark ? 'text-white bg-gradient-to-t from-black to-gray-400 duration-700 border-b-gray-800 border border-t-0 border-x-0':'duration-800 bg-gradient-to-b from-gray-600 to-white' + + return (