diff --git a/src/App.js b/src/App.js index a7be6ff..44ab789 100644 --- a/src/App.js +++ b/src/App.js @@ -8,13 +8,15 @@ import './css/App.css'; import UseScrollToTop from './hooks/useScrollToTop'; import NewsPage from './pages/News.jsx'; -const AboutMe = lazy(() => import('./pages/AboutMe')); +const About = lazy(() => import('./pages/AboutMe')); const Events = lazy(() => import('./pages/Events')); -const Contact = lazy(() => import('./pages/Contact.jsx')); +const Resources = lazy(() => import('./pages/Resources')); const Home = lazy(() => import('./pages/Home')); const Projects = lazy(() => import('./pages/Projects')); const ProjectSingle = lazy(() => import('./pages/ProjectSingle.jsx')); const Partnership = lazy(() => import('./pages/Partnerships.jsx')) +const Donation = lazy(() => import('./pages/Donation.jsx')) +const Contact = lazy(() => import('./pages/Contact.jsx')); function App() { @@ -28,9 +30,11 @@ function App() { } /> } /> - } /> - } /> + } /> + } /> }/> + } /> + } /> }/> diff --git a/src/components/donation/DonationComplete.jsx b/src/components/donation/DonationComplete.jsx new file mode 100644 index 0000000..732db10 --- /dev/null +++ b/src/components/donation/DonationComplete.jsx @@ -0,0 +1,52 @@ +import {donationMotivations, donationForms} from '../../data/donationData' + +const DonationComplete = () => { + + return ( +
+
+

+ Doações +

+
+
+ +
+ +
+

+ Por Que Doar? +

+
+ + {donationMotivations.map((bio) => ( +

+ {bio.bio} +

+ ))} + +
+

+ Formas de Doar +

+
+ + {donationForms.map((bio) => ( +

+ {bio.bio} +

+ ))} +
+
+
+ ); + +}; + +export default DonationComplete; diff --git a/src/components/resources/ResourceSingle.jsx b/src/components/resources/ResourceSingle.jsx new file mode 100644 index 0000000..ab147bd --- /dev/null +++ b/src/components/resources/ResourceSingle.jsx @@ -0,0 +1,38 @@ +import { motion } from 'framer-motion'; +import { Link } from 'react-router-dom'; + +const ResourceSingle = ({ title, category, image }) => { + return ( + + +
+
+ Single Resource +
+
+

+ {title} +

+ + {category} + +
+
+ + + ); +}; + +export default ResourceSingle; diff --git a/src/components/resources/ResourcesFilter.jsx b/src/components/resources/ResourcesFilter.jsx new file mode 100644 index 0000000..54478db --- /dev/null +++ b/src/components/resources/ResourcesFilter.jsx @@ -0,0 +1,43 @@ +const selectOptions = [ + 'Web Application', + 'Mobile Application', + 'UI/UX Design', + 'Branding', +]; + +const ResourcesFilter = ({ setSelectResource }) => { + return ( + + ); +}; + +export default ResourcesFilter; diff --git a/src/components/resources/ResourcesGrid.jsx b/src/components/resources/ResourcesGrid.jsx new file mode 100644 index 0000000..711da0a --- /dev/null +++ b/src/components/resources/ResourcesGrid.jsx @@ -0,0 +1,105 @@ +import { useContext } from 'react'; +import ResourceSingle from './ResourceSingle'; +import { ResourcesContext } from '../../context/ResourcesContext'; + +const ResourcesGrid = () => { + const { resources } = useContext(ResourcesContext); + + // Filtrar recursos por categoria + const bibliotecaRecursos = resources.filter( + (resource) => resource.category === 'biblioteca' + ); + const ferramentasTutoriais = resources.filter( + (resource) => resource.category === 'tutoriais' + ); + const publicacoes = resources.filter( + (resource) => resource.category === 'publicacoes' + ); + + return ( +
+
+

+ Recursos +

+
+ + {/* Biblioteca de Recursos */} +
+

+ Biblioteca de Recursos +

+
+ {bibliotecaRecursos.map((resource) => ( + + ))} +
+
+ + {/* Ferramentas e Tutoriais */} +
+

+ Ferramentas e Tutoriais +

+
+ {ferramentasTutoriais.map((resource) => ( + + ))} +
+
+ + {/* Publicações */} +
+

+ Publicações +

+
+ {publicacoes.map((resource) => ( + + ))} +
+
+
+ ); +}; + +export default ResourcesGrid; diff --git a/src/context/DonationContext.jsx b/src/context/DonationContext.jsx new file mode 100644 index 0000000..afe0db4 --- /dev/null +++ b/src/context/DonationContext.jsx @@ -0,0 +1,30 @@ +import { useState, createContext } from 'react'; +// import { donationDataResume } from '../data/donationData'; +import { clientsHeading as clientsPageHeading } from '../data/clientsData'; +import { clientsData as clientsDataJson } from '../data/clientsData'; + +const DonationContext = createContext(); + +export const DonationProvider = ({ children }) => { + // const [donation, setDonation] = useState(donationDataResume); + + const clientsHeading = clientsPageHeading; + + const [clientsData, setClientsData] = useState(clientsDataJson); + + return ( + + {children} + + ); +}; + +export default DonationContext; diff --git a/src/context/ResourcesContext.jsx b/src/context/ResourcesContext.jsx new file mode 100644 index 0000000..ff7f396 --- /dev/null +++ b/src/context/ResourcesContext.jsx @@ -0,0 +1,48 @@ +import { useState, createContext } from 'react'; +import { resourcesData } from '../data/resources'; + +// Create resources context +export const ResourcesContext = createContext(); + +// Create the resources context provider +export const ResourcesProvider = (props) => { + const [resources, setResources] = useState(resourcesData); + const [searchResource, setSearchResource] = useState(''); + const [selectResource, setSelectResource] = useState(''); + + // Search resources by resource title + const searchResourcesByTitle = resources.filter((item) => { + const result = item.title + .toLowerCase() + .includes(searchResource.toLowerCase()) + ? item + : searchResource === '' + ? item + : ''; + return result; + }); + + // Select resources by resource category + const selectResourcesByCategory = resources.filter((item) => { + let category = + item.category.charAt(0).toUpperCase() + item.category.slice(1); + return category.includes(selectResource); + }); + + return ( + + {props.children} + + ); +}; diff --git a/src/data/donationData.js b/src/data/donationData.js new file mode 100644 index 0000000..2321bdc --- /dev/null +++ b/src/data/donationData.js @@ -0,0 +1,139 @@ +export const donationMotivations = [ + { + id: 1, + bio: ( + <> + As doações são fundamentais para que a Fundação COMP+ possa continuar sua missão de promover a inclusão digital, + oferecer bolsas de estudo, e desenvolver programas educacionais que beneficiam a comunidade. Cada contribuição, + independentemente do valor, tem um impacto significativo. Os recursos arrecadados são utilizados para: + + ) + }, + { + id: 2, + bio: ( + <> +
  • + Financiar bolsas de estudo para estudantes em situação de vulnerabilidade. +
    • + + ) + }, + { + id: 3, + bio: ( + <> +
  • + Apoiar eventos e workshops que promovem a capacitação em tecnologia. +
    • + + ) + }, + { + id: 4, + bio: ( + <> +
  • + Desenvolver materiais educacionais e recursos gratuitos que são disponibilizados para a comunidade. +
    • + + ) + }, + { + id: 5, + bio: ( + <> + Sua doação ajuda a transformar vidas e a construir um futuro melhor para todos. + + ) + }, +] + +export const donationForms = [ + { + id: 1, + bio: ( + <> + Oferecemos várias opções de doação para se adequar às suas preferências: + + ) + }, + // { + // id: 2, + // bio: ( + // <> + //
  • + // Ana - Diretora Executiva
    Com mais de 15 anos de experiência em gestão de ONGs e desenvolvimento social, Ana lidera nossa organização com + // uma visão focada na inovação e no impacto comunitário. Ela é responsável por traçar a estratégia geral da fundação e garantir a implementação + // de políticas que promovam nosso crescimento sustentável. Sua liderança é reconhecida por sua abordagem colaborativa e orientada a + // resultados. + //
    • + // + // ) + // }, + // { + // id: 3, + // bio: ( + // <> + //
  • + // Carlos Oliveira - Líder de Projetos
    Especialista em planejamento de projetos e tecnologia educacional, Carlos coordena as + // principais iniciativas da fundação, garantindo que os projetos sejam executados de acordo com nossos valores e metas. + // Com uma carreira de mais de 10 anos na área de gestão de projetos, ele é peça-chave na execução das nossas + // atividades voltadas ao desenvolvimento social e educacional. + //
    • + // + // ) + // }, + // { + // id: 4, + // bio: ( + // <> + //
  • + // Maria Fernanda Lima - Gerente Financeira
    + // Maria Fernanda é uma especialista em finanças com mais de 12 anos de experiência em auditoria e controle financeiro no terceiro setor. + // Ela é responsável por manter a integridade financeira da nossa organização, assegurando que os recursos sejam utilizados de + // forma eficaz e transparente. + //
    • + // + // ) + // }, + // { + // id: 5, + // bio: ( + // <> + //
  • + // Conselho Consultivo
    + // Nosso Conselho Consultivo é formado por especialistas de renome que fornecem insights + // estratégicos para apoiar nossa missão e garantir que as melhores práticas sejam seguidas. + // Eles trabalham lado a lado com a diretoria para fortalecer nossa governança e promover a + // transparência em todas as nossas ações. + //
    • + // + // ) + // }, + // { + // id: 6, + // bio: ( + // <> + //
  • + // João Ribeiro - Especialista em Sustentabilidade e Impacto Social
    + // Com 20 anos de experiência em sustentabilidade, João oferece conselhos valiosos sobre como podemos + // maximizar nosso impacto social de maneira ética e sustentável. + //
    • + // + // ) + // }, + // { + // id: 7, + // bio: ( + // <> + //
  • + // Beatriz Martins - Consultora Jurídica
    + // Advogada com especialização em direito do terceiro setor, Beatriz garante que nossas operações estejam em + // conformidade com todas as leis e regulamentos aplicáveis. + //
    • + // + // ) + // } +] + diff --git a/src/data/resources.js b/src/data/resources.js new file mode 100644 index 0000000..0e39b17 --- /dev/null +++ b/src/data/resources.js @@ -0,0 +1,68 @@ +// Import images +import artigoImg from '../images/paper.jpg'; +import escolaImg from '../images/school.jpg'; +import videoImg from '../images/video.jpg'; +import gitImg from '../images/git.png'; +import vscodeImg from '../images/vscode.png'; +import postmanImg from '../images/postman.jpeg'; +import relatorioImg from '../images/relatorio.jpg'; +import digitalImg from '../images/digital.jpg'; +import premioImg from '../images/premio.jpg'; + +export const resourcesData = [ + { + id: 1, + title: 'Artigos', + category: 'biblioteca', + img: artigoImg, + }, + { + id: 2, + title: 'Materiais Educacionais', + category: 'biblioteca', + img: escolaImg, + }, + { + id: 3, + title: 'Vídeos', + category: 'biblioteca', + img: videoImg, + }, + { + id: 4, + title: 'GitHub', + category: 'tutoriais', + img: gitImg, + }, + { + id: 5, + title: 'VS Code', + category: 'tutoriais', + img: vscodeImg, + }, + { + id: 6, + title: 'POSTMAN', + category: 'tutoriais', + img: postmanImg, + }, + { + id: 7, + title: 'Relatóridigitalo 2023', + category: 'publicacoes', + img: relatorioImg, + }, + { + id: 8, + title: 'Inclusão Digital no Brasil', + category: 'publicacoes', + img: digitalImg, + }, + { + id: 9, + title: 'Premiações nacionais', + category: 'publicacoes', + img: premioImg, + }, +]; + diff --git a/src/images/digital.jpg b/src/images/digital.jpg new file mode 100644 index 0000000..b4ce715 Binary files /dev/null and b/src/images/digital.jpg differ diff --git a/src/images/docker.svg b/src/images/docker.svg new file mode 100644 index 0000000..5e05755 --- /dev/null +++ b/src/images/docker.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/images/git.png b/src/images/git.png new file mode 100644 index 0000000..e28a837 Binary files /dev/null and b/src/images/git.png differ diff --git a/src/images/paper.jpg b/src/images/paper.jpg new file mode 100644 index 0000000..6c9b377 Binary files /dev/null and b/src/images/paper.jpg differ diff --git a/src/images/postman.jpeg b/src/images/postman.jpeg new file mode 100644 index 0000000..f50a50d Binary files /dev/null and b/src/images/postman.jpeg differ diff --git a/src/images/postman.png b/src/images/postman.png new file mode 100644 index 0000000..2388a74 Binary files /dev/null and b/src/images/postman.png differ diff --git a/src/images/premio.jpg b/src/images/premio.jpg new file mode 100644 index 0000000..32d09c5 Binary files /dev/null and b/src/images/premio.jpg differ diff --git a/src/images/relatorio.jpg b/src/images/relatorio.jpg new file mode 100644 index 0000000..d0cad00 Binary files /dev/null and b/src/images/relatorio.jpg differ diff --git a/src/images/school.jpg b/src/images/school.jpg new file mode 100644 index 0000000..eac5875 Binary files /dev/null and b/src/images/school.jpg differ diff --git a/src/images/video.jpg b/src/images/video.jpg new file mode 100644 index 0000000..f82fe11 Binary files /dev/null and b/src/images/video.jpg differ diff --git a/src/images/vscode.jpeg b/src/images/vscode.jpeg new file mode 100644 index 0000000..5df86f4 Binary files /dev/null and b/src/images/vscode.jpeg differ diff --git a/src/images/vscode.png b/src/images/vscode.png new file mode 100644 index 0000000..ba1a656 Binary files /dev/null and b/src/images/vscode.png differ diff --git a/src/images/vscode.webp b/src/images/vscode.webp new file mode 100644 index 0000000..f0da3ee Binary files /dev/null and b/src/images/vscode.webp differ diff --git a/src/pages/Donation.jsx b/src/pages/Donation.jsx new file mode 100644 index 0000000..d416276 --- /dev/null +++ b/src/pages/Donation.jsx @@ -0,0 +1,20 @@ +import DonationComplete from '../components/donation/DonationComplete'; +import { DonationProvider } from '../context/DonationContext'; +import { motion } from 'framer-motion'; + +const About = () => { + return ( + + + + + + ); +}; + +export default About; diff --git a/src/pages/Resources.jsx b/src/pages/Resources.jsx new file mode 100644 index 0000000..8c39fc0 --- /dev/null +++ b/src/pages/Resources.jsx @@ -0,0 +1,14 @@ +import ResourcesGrid from '../components/resources/ResourcesGrid'; +import { ResourcesProvider } from '../context/ResourcesContext'; + +const Resources = () => { + return ( + +
    + +
    +     + ); +}; + +export default Resources;