From 25e32b90f38cd3316933176e686b65f747ebd337 Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Wed, 18 Oct 2023 23:45:52 +0200 Subject: [PATCH 1/9] add popup and img for it --- src/assets/img/new-folder-dynamic-color.png | Bin 0 -> 6516 bytes src/assets/img/puzzle-dynamic-color.png | Bin 0 -> 8344 bytes src/assets/img/thumb-up-dynamic-color.png | Bin 0 -> 8657 bytes src/components/PopupHowToCollaborate.tsx | 67 ++++++++++++++++++++ src/components/SloganComponent.tsx | 16 +++-- 5 files changed, 79 insertions(+), 4 deletions(-) create mode 100644 src/assets/img/new-folder-dynamic-color.png create mode 100644 src/assets/img/puzzle-dynamic-color.png create mode 100644 src/assets/img/thumb-up-dynamic-color.png create mode 100644 src/components/PopupHowToCollaborate.tsx diff --git a/src/assets/img/new-folder-dynamic-color.png b/src/assets/img/new-folder-dynamic-color.png new file mode 100644 index 0000000000000000000000000000000000000000..538b764c3d1e0a0774a23b594a181bd18d4fed39 GIT binary patch literal 6516 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 iqdA(RIhv!_lKu~}ytEH{NBkcE00001yT`l_^4 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 literal 0 HcmV?d00001 diff --git a/src/components/PopupHowToCollaborate.tsx b/src/components/PopupHowToCollaborate.tsx new file mode 100644 index 0000000..58c7663 --- /dev/null +++ b/src/components/PopupHowToCollaborate.tsx @@ -0,0 +1,67 @@ +import React, { useState } from 'react'; +import CardComponent from "./CardComponent"; +import selector from '../assets/img/sel_right.png'; +import folder from '../assets/img/new-folder-dynamic-color.png'; +import puzzle from '../assets/img/puzzle-dynamic-color.png'; +import thumb_up from '../assets/img/thumb-up-dynamic-color.png'; + +const Popup: React.FC = () => { + const [isPopupOpenLocal, setisPopupOpenLocal] = useState(false); + + return ( +
+

+ setisPopupOpenLocal(true)} + > + Icono de selector + + ¿Cómo colaborar? +

+ + {isPopupOpenLocal && ( +
+
+

¿Cómo coloborar en proyectos IT Academy?

+ +
+ + + + + +
+
+
+ )} +
+ ); +}; + +export default Popup; diff --git a/src/components/SloganComponent.tsx b/src/components/SloganComponent.tsx index 13e0121..1b77a80 100644 --- a/src/components/SloganComponent.tsx +++ b/src/components/SloganComponent.tsx @@ -1,3 +1,5 @@ +import React, { useState } from 'react'; +import Popup from "./PopupHowToCollaborate"; import angularLogo from "../assets/img/angular.png"; import phpLogo from "../assets/img/php.png"; import javaLogo from "../assets/img/java.png"; @@ -10,8 +12,11 @@ import itacademyLogo from "../assets/img/itacademylogo.png"; import HeaderComponent from "./HeaderComponent"; import selector from "../assets/img/sel_right.png"; -const SloganComponent = () => ( - <> +const SloganComponent = () => { + const [isPopupOpen, setIsPopupOpen] = useState(false); // Estado para controlar el popup + + return ( + <>
@@ -42,7 +47,9 @@ const SloganComponent = () => ( {/* */}
-

+ +

setIsPopupOpen(true)}> Icono de selector @@ -121,7 +128,8 @@ const SloganComponent = () => (

+ {isPopupOpen && } ); - +}; export default SloganComponent; From acf940a8bca290a50930f83e011db21c61398082 Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Wed, 25 Oct 2023 00:49:32 +0200 Subject: [PATCH 2/9] popup how tu collaborate --- src/components/ButtonCollaborate.tsx | 14 ++++++++ src/components/PopupHowToCollaborate.tsx | 41 +++++++----------------- src/components/SloganComponent.tsx | 14 +++----- 3 files changed, 31 insertions(+), 38 deletions(-) create mode 100644 src/components/ButtonCollaborate.tsx diff --git a/src/components/ButtonCollaborate.tsx b/src/components/ButtonCollaborate.tsx new file mode 100644 index 0000000..c855e33 --- /dev/null +++ b/src/components/ButtonCollaborate.tsx @@ -0,0 +1,14 @@ +import React from 'react'; +import selector from '../assets/img/sel_right.png'; + +const ButtonColloborate: React.FC<{ onClick: () => void }> = ({ onClick }) => ( + + Icono de selector + ¿Cómo colaborar? + +); + +export default ButtonColloborate; diff --git a/src/components/PopupHowToCollaborate.tsx b/src/components/PopupHowToCollaborate.tsx index 58c7663..1b76fca 100644 --- a/src/components/PopupHowToCollaborate.tsx +++ b/src/components/PopupHowToCollaborate.tsx @@ -1,60 +1,43 @@ import React, { useState } from 'react'; import CardComponent from "./CardComponent"; -import selector from '../assets/img/sel_right.png'; +import ButtonCollaborate from './ButtonCollaborate'; import folder from '../assets/img/new-folder-dynamic-color.png'; import puzzle from '../assets/img/puzzle-dynamic-color.png'; import thumb_up from '../assets/img/thumb-up-dynamic-color.png'; -const Popup: React.FC = () => { +const PopupHowToCollaborate: React.FC = () => { const [isPopupOpenLocal, setisPopupOpenLocal] = useState(false); return (

- setisPopupOpenLocal(true)} - > - Icono de selector - - ¿Cómo colaborar? + setisPopupOpenLocal(true)} />

{isPopupOpenLocal && (

¿Cómo coloborar en proyectos IT Academy?

- -
- +
@@ -64,4 +47,4 @@ const Popup: React.FC = () => { ); }; -export default Popup; +export default PopupHowToCollaborate; diff --git a/src/components/SloganComponent.tsx b/src/components/SloganComponent.tsx index 1b77a80..1fa17dd 100644 --- a/src/components/SloganComponent.tsx +++ b/src/components/SloganComponent.tsx @@ -1,5 +1,6 @@ import React, { useState } from 'react'; import Popup from "./PopupHowToCollaborate"; +import ButtonColloborate from './ButtonCollaborate'; import angularLogo from "../assets/img/angular.png"; import phpLogo from "../assets/img/php.png"; import javaLogo from "../assets/img/java.png"; @@ -10,10 +11,9 @@ import nodejsLogo from "../assets/img/nodejs.png"; import gitLogo from "../assets/img/git.png"; import itacademyLogo from "../assets/img/itacademylogo.png"; import HeaderComponent from "./HeaderComponent"; -import selector from "../assets/img/sel_right.png"; const SloganComponent = () => { - const [isPopupOpen, setIsPopupOpen] = useState(false); // Estado para controlar el popup + const [isPopupOpen, setIsPopupOpen] = useState(false); return ( <> @@ -41,19 +41,15 @@ const SloganComponent = () => {
-
+
{/* */}
-

setIsPopupOpen(true)}> - - Icono de selector - - ¿Cómo colaborar? + setIsPopupOpen(true)} />

@@ -132,4 +128,4 @@ const SloganComponent = () => { ); }; -export default SloganComponent; +export default SloganComponent; \ No newline at end of file From 5d3bfdd8327cfc4410414ca8fa7cf7e3937a3417 Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Wed, 25 Oct 2023 12:22:21 +0200 Subject: [PATCH 3/9] popup done #81 --- .../CardComponentPopupCollaborate.tsx | 47 +++++++++++++++++++ src/components/PopupHowToCollaborate.tsx | 31 +++++------- 2 files changed, 60 insertions(+), 18 deletions(-) create mode 100644 src/components/CardComponentPopupCollaborate.tsx diff --git a/src/components/CardComponentPopupCollaborate.tsx b/src/components/CardComponentPopupCollaborate.tsx new file mode 100644 index 0000000..ea89e27 --- /dev/null +++ b/src/components/CardComponentPopupCollaborate.tsx @@ -0,0 +1,47 @@ +import React from 'react'; + +interface CardComponentPopupCollaborateProps { + pos: string; + imgSrc1: string; // Aquí está la imagen + title: string; + description: string; +} + +const CardComponentPopupCollaborate: React.FC = ({ + pos, + imgSrc1, // Utiliza imgSrc1 para la imagen + title, + description, +}) => { + return ( +
+ + + +
+
+

+ {pos} +

+
+
+ Logo +
+
+

{title}

+

{description}

+
+
+
+ ); +}; + +export default CardComponentPopupCollaborate; diff --git a/src/components/PopupHowToCollaborate.tsx b/src/components/PopupHowToCollaborate.tsx index 1b76fca..e3c3c86 100644 --- a/src/components/PopupHowToCollaborate.tsx +++ b/src/components/PopupHowToCollaborate.tsx @@ -1,39 +1,36 @@ -import React, { useState } from 'react'; -import CardComponent from "./CardComponent"; -import ButtonCollaborate from './ButtonCollaborate'; +/* import React, { useState } from 'react'; */ +/* import ButtonCollaborate from './ButtonCollaborate'; */ import folder from '../assets/img/new-folder-dynamic-color.png'; import puzzle from '../assets/img/puzzle-dynamic-color.png'; import thumb_up from '../assets/img/thumb-up-dynamic-color.png'; +import CardComponentPopupCollaborate from './CardComponentPopupCollaborate'; +import CardComponentPopupCollaboratePopupCollaborate from './CardComponentPopupCollaborate'; const PopupHowToCollaborate: React.FC = () => { - const [isPopupOpenLocal, setisPopupOpenLocal] = useState(false); + /* const [isPopupOpenLocal, setisPopupOpenLocal] = useState(false); */ return ( -
-

- setisPopupOpenLocal(true)} /> -

- - {isPopupOpenLocal && ( -
-
-

¿Cómo coloborar en proyectos IT Academy?

+
+

¿Cómo coloborar en proyectos IT Academy?

+ +
+
- - - {
- )} -
); }; From e04df43986731946c91fbfeecaae0e01d1bd9438 Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Sat, 28 Oct 2023 00:46:56 +0200 Subject: [PATCH 4/9] add cloce button for popup --- .../CardComponentPopupCollaborate.tsx | 5 +- src/components/PopupHowToCollaborate.tsx | 67 +++++++++++-------- src/components/SloganComponent.tsx | 3 + 3 files changed, 44 insertions(+), 31 deletions(-) diff --git a/src/components/CardComponentPopupCollaborate.tsx b/src/components/CardComponentPopupCollaborate.tsx index ea89e27..e66729b 100644 --- a/src/components/CardComponentPopupCollaborate.tsx +++ b/src/components/CardComponentPopupCollaborate.tsx @@ -2,14 +2,15 @@ import React from 'react'; interface CardComponentPopupCollaborateProps { pos: string; - imgSrc1: string; // Aquí está la imagen + imgSrc1: string; title: string; description: string; + className?: string; } const CardComponentPopupCollaborate: React.FC = ({ pos, - imgSrc1, // Utiliza imgSrc1 para la imagen + imgSrc1, title, description, }) => { diff --git a/src/components/PopupHowToCollaborate.tsx b/src/components/PopupHowToCollaborate.tsx index e3c3c86..e2132a7 100644 --- a/src/components/PopupHowToCollaborate.tsx +++ b/src/components/PopupHowToCollaborate.tsx @@ -1,45 +1,54 @@ -/* import React, { useState } from 'react'; */ -/* import ButtonCollaborate from './ButtonCollaborate'; */ -import folder from '../assets/img/new-folder-dynamic-color.png'; -import puzzle from '../assets/img/puzzle-dynamic-color.png'; -import thumb_up from '../assets/img/thumb-up-dynamic-color.png'; -import CardComponentPopupCollaborate from './CardComponentPopupCollaborate'; -import CardComponentPopupCollaboratePopupCollaborate from './CardComponentPopupCollaborate'; +import React, { useState } from "react"; +import cross from "../assets/img/cross.png"; +import folder from "../assets/img/new-folder-dynamic-color.png"; +import puzzle from "../assets/img/puzzle-dynamic-color.png"; +import thumb_up from "../assets/img/thumb-up-dynamic-color.png"; +import CardComponentPopupCollaborate from "./CardComponentPopupCollaborate"; +import CardComponentPopupCollaboratePopupCollaborate from "./CardComponentPopupCollaborate"; const PopupHowToCollaborate: React.FC = () => { - /* const [isPopupOpenLocal, setisPopupOpenLocal] = useState(false); */ + const [, setIsPopupOpen] = useState(true); + + const closePopup = () =>{ setIsPopupOpen(false);} - return ( -
-

¿Cómo coloborar en proyectos IT Academy?

- -
- -
+ return ( +
+
+ button_close +
+

+ ¿Cómo coloborar en proyectos IT Academy? +

+
-
- ); + ); }; export default PopupHowToCollaborate; diff --git a/src/components/SloganComponent.tsx b/src/components/SloganComponent.tsx index 1fa17dd..15e6b43 100644 --- a/src/components/SloganComponent.tsx +++ b/src/components/SloganComponent.tsx @@ -15,6 +15,9 @@ import HeaderComponent from "./HeaderComponent"; const SloganComponent = () => { const [isPopupOpen, setIsPopupOpen] = useState(false); + const closePopup = () => { + setIsPopupOpen(false); // Cierra el popup al cambiar el estado a false + }; return ( <>
From a8c09c860928b9ac1d5769614312e8019a3b8bc7 Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Sun, 29 Oct 2023 13:18:34 +0100 Subject: [PATCH 5/9] closing button popup #81 --- src/components/ButtonCollaborate.tsx | 4 ++-- src/components/CloseButtonCollaborate.tsx | 16 ++++++++++++++++ src/components/PopupHowToCollaborate.tsx | 14 +++++++------- src/components/SloganComponent.tsx | 18 +++++++++++------- 4 files changed, 36 insertions(+), 16 deletions(-) create mode 100644 src/components/CloseButtonCollaborate.tsx diff --git a/src/components/ButtonCollaborate.tsx b/src/components/ButtonCollaborate.tsx index c855e33..23b614c 100644 --- a/src/components/ButtonCollaborate.tsx +++ b/src/components/ButtonCollaborate.tsx @@ -2,13 +2,13 @@ import React from 'react'; import selector from '../assets/img/sel_right.png'; const ButtonColloborate: React.FC<{ onClick: () => void }> = ({ onClick }) => ( - Icono de selector ¿Cómo colaborar? - + ); export default ButtonColloborate; diff --git a/src/components/CloseButtonCollaborate.tsx b/src/components/CloseButtonCollaborate.tsx new file mode 100644 index 0000000..e97c225 --- /dev/null +++ b/src/components/CloseButtonCollaborate.tsx @@ -0,0 +1,16 @@ +import React from 'react'; +import cross from '../assets/img/cross.png'; + +interface CloseButtonCollaborateProps { + onClick: () => void; +} + +const CloseButtonCollaborate: React.FC = ({ onClick }) => { + return ( + + ); +}; + +export default CloseButtonCollaborate; \ No newline at end of file diff --git a/src/components/PopupHowToCollaborate.tsx b/src/components/PopupHowToCollaborate.tsx index e2132a7..fa7d8a1 100644 --- a/src/components/PopupHowToCollaborate.tsx +++ b/src/components/PopupHowToCollaborate.tsx @@ -1,17 +1,16 @@ -import React, { useState } from "react"; import cross from "../assets/img/cross.png"; import folder from "../assets/img/new-folder-dynamic-color.png"; import puzzle from "../assets/img/puzzle-dynamic-color.png"; import thumb_up from "../assets/img/thumb-up-dynamic-color.png"; import CardComponentPopupCollaborate from "./CardComponentPopupCollaborate"; -import CardComponentPopupCollaboratePopupCollaborate from "./CardComponentPopupCollaborate"; -const PopupHowToCollaborate: React.FC = () => { - const [, setIsPopupOpen] = useState(true); +const PopupHowToCollaborate: React.FC<{ onClose: () => void }> = ({ onClose }) => { + const closePopup = () => { + onClose(); + }; - const closePopup = () =>{ setIsPopupOpen(false);} - return ( +
{ ¿Cómo coloborar en proyectos IT Academy?
- { />
+
); }; diff --git a/src/components/SloganComponent.tsx b/src/components/SloganComponent.tsx index 15e6b43..fc4a654 100644 --- a/src/components/SloganComponent.tsx +++ b/src/components/SloganComponent.tsx @@ -1,6 +1,6 @@ -import React, { useState } from 'react'; -import Popup from "./PopupHowToCollaborate"; -import ButtonColloborate from './ButtonCollaborate'; +import { useState } from 'react'; +import PopupHowToCollaborate from "./PopupHowToCollaborate"; +import ButtonCollaborate from './ButtonCollaborate'; import angularLogo from "../assets/img/angular.png"; import phpLogo from "../assets/img/php.png"; import javaLogo from "../assets/img/java.png"; @@ -15,9 +15,13 @@ import HeaderComponent from "./HeaderComponent"; const SloganComponent = () => { const [isPopupOpen, setIsPopupOpen] = useState(false); + const openPopup = () => { + setIsPopupOpen(true); + }; const closePopup = () => { - setIsPopupOpen(false); // Cierra el popup al cambiar el estado a false + setIsPopupOpen(false); }; + return ( <>
@@ -52,8 +56,8 @@ const SloganComponent = () => {

setIsPopupOpen(true)}> - setIsPopupOpen(true)} /> -

+ +

@@ -127,7 +131,7 @@ const SloganComponent = () => {
- {isPopupOpen && } + {isPopupOpen && } ); }; From 0abdb6ffc77efb80c2fa8b9f82fc6eced1a87d0d Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Mon, 30 Oct 2023 12:24:32 +0100 Subject: [PATCH 6/9] hot fix --- src/components/ButtonCollaborate.tsx | 2 +- src/components/CardComponentPopupCollaborate.tsx | 1 - 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/ButtonCollaborate.tsx b/src/components/ButtonCollaborate.tsx index 23b614c..25b4022 100644 --- a/src/components/ButtonCollaborate.tsx +++ b/src/components/ButtonCollaborate.tsx @@ -3,7 +3,7 @@ import selector from '../assets/img/sel_right.png'; const ButtonColloborate: React.FC<{ onClick: () => void }> = ({ onClick }) => ( ); From 1ae62013be88306ca1ce5740678a55c9b378efb8 Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Mon, 30 Oct 2023 12:49:38 +0100 Subject: [PATCH 8/9] hot fix style --- src/components/ButtonCollaborate.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/ButtonCollaborate.tsx b/src/components/ButtonCollaborate.tsx index dfdaf85..3efd832 100644 --- a/src/components/ButtonCollaborate.tsx +++ b/src/components/ButtonCollaborate.tsx @@ -6,7 +6,7 @@ const ButtonColloborate: React.FC<{ onClick: () => void }> = ({ onClick }) => ( className="inline-flex items-center cursor-pointer" onClick={onClick} > - Icono de selector + Icono de selector ¿Cómo colaborar? ); From 50f61bff8aaaceb7cc1799cb1fa31cee524c9807 Mon Sep 17 00:00:00 2001 From: Darya Bochkovska <123471637+Dar-ya218@users.noreply.github.com> Date: Mon, 30 Oct 2023 13:29:42 +0100 Subject: [PATCH 9/9] hot fix --- src/components/PopupHowToCollaborate.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/PopupHowToCollaborate.tsx b/src/components/PopupHowToCollaborate.tsx index fa7d8a1..49fd513 100644 --- a/src/components/PopupHowToCollaborate.tsx +++ b/src/components/PopupHowToCollaborate.tsx @@ -29,7 +29,6 @@ const PopupHowToCollaborate: React.FC<{ onClose: () => void }> = ({ onClose }) = imgSrc1={folder} title="Pregunta a tu mentor" description="Resolvera todas tus dudas y te ayudara con setup del proyecto" - className="border-2 bg-white rounded-xl p-4" />