Introduction.tsx

import { ButtonOne } from "../../components/Buttons";
import { H5 } from "../../components/Headings";
import PreCyse from "../../components/precyse";
import {  BlockQuoteB } from "../../components/Quotes";
import { Section } from "../../components/sections";
import { useNavigation } from "../../utils";
import { useTabNavigation } from "../../utils/TabNavigation";


export function HPIntroduction(){
    const {goToPageAndScroll} = useNavigation(); 
    useTabNavigation();
    return(
        <Section title="Introduction" id="Introduction">
            <H5 text="- Connecting our project to real life -"/>
            <BlockQuoteB text="Science and everyday life cannot and should not be separated." cite="Rosalind Franklin"/>
            <div className="row align-items-center">
            <div className="col ">
                <ButtonOne openclass="intro-cycletab" text="Our Understanding of HP" open="understanding"></ButtonOne>
                </div>
                <div className="col ">
                <ButtonOne openclass="intro-cycletab" text="Our Mission & Vision" open="mission"></ButtonOne>
                </div>
                <div className="col ">
                <ButtonOne openclass="intro-cycletab" text="Our Approach" open="approach"></ButtonOne>
                </div>
                <div className="col ">
                <ButtonOne openclass="intro-cycletab" text="Our Target Groups" open="targets"></ButtonOne>
                </div>
            </div>
            <br/>
            <div className="col intro-cycletab" id="understanding" style={{display: "block"}}>
                 <p>This year, we at iGEM Bielefeld-CeBiTec have consciously chosen a <b>human-centered project design</b>. At the heart of our iGEM project is 
                    one key pillar: <b>Human Practice</b>. Our goal is to understand the impact of our project on society, the scientific community and the world 
                    as whole. This is not just about the technical effectiveness of our parts, but also about how the solution is embraced in everyday 
                    practice, and the potential long-term impact it could have for  Cystic Fibrosis patients and their families all over the world.
            </p>
            <p>With our human-centered approach, we aim to address fundamental iGEM Human Practice questions and beyond:
            </p>
            <p style={{textAlign: "center"}}> <b>How does our project affect the world around us?</b></p>
            <p style={{textAlign: "center"}}> <b>How does the world around us influence our project?            </b></p>
            <p>From the very beginning, it was our priority to identify various stakeholders and meet people affected by  Cystic Fibrosis early on to <b>actively involve</b> them throughout the planning and development process. This collaborative approach allowed us to ensure that our project 
                addresses real needs and contributes to solutions for as many different people as possible. Without the critical advice, varied perspectives 
                and input from our stakeholders, it would have been impossible to identify and reflect on all aspects of our project. We made every 
                effort to <b>deeply understand</b> their values and backgrounds, allowing us to integrate their feedback into our solutions.
            </p>
            </div>
            <div className="col intro-cycletab" id="mission" style={{display: "none"}}>
                <p>We view Human Practice as an opportunity to <b>go beyond practical lab work and traditional science</b> and to learn about 
                    the needs of people affected by  Cystic Fibrosis. It’s a chance for us to creatively engage with different aspects of our project 
                    while developing an awareness of the responsibilities that come with it. 
                </p>
                <p>
                As part of our <PreCyse/> project, we performed intensive brainstorming sessions and expert consultations. We conducted comprehensive  
                <a onClick={() => goToPageAndScroll("our-surveys-on--Cystic Fibrosis-and-gene-therapy", "/human-practices")}> surveys</a> among the public and people with  Cystic Fibrosis and their relatives. We focused on critical aspects such as the <b>needs of our 
                target groups, safety, ethics, design, implementation, and business</b> — each guided by the core values of our team. Based on these interactions 
                and the recommendations of the Human Practice committee, we have developed an optimal strategy for our project, ensuring that our work is not 
                only innovative but also mindful of its broader impact on society.
                </p>
            </div>
            <div className="col intro-cycletab" id="approach" style={{display: "none"}}>
                <p>It was important to us as a team to not only offer technical solutions, but to show that our project can contribute to the larger context of ongoing initiatives and movements to optimize health care. We wanted to really understand the feedback and insights of the stakeholders to gain a better understanding of how our project fits into the overall picture of living with  Cystic Fibrosis, the current state of research and how it can be used to reduce the health care gap.
                </p>
                <p><b>Our strategy includes:</b></p>
                <ul>
                <li>Identifying key target groups</li>
                <li>Establishing meaningful and lasting communication with stakeholders</li>
                <li>Effectively engaging with the diverse backgrounds of those involved</li>
                <li>Understand the ethical, social and scientific values that inspired our project</li>
                <li>Integrating feedback and adapting our approach to align with stakeholder goals</li>
                <li>Designing and incorporating representative surveys</li>
                <li>Reflect on how these values have been incorporated into our project</li>
                </ul>
                <p><b>With this approach and the support of our stakeholders, our ultimate goals are to:</b></p>
                <ul>
                <li>Improve care for  Cystic Fibrosis patients</li>
                <li>Optimize the availability of essential medications</li>
                </ul>

            </div>
            <div className="col intro-cycletab" id="targets" style={{display: "none"}}>
                <p>Our target groups are composed of <b>academic and clinical experts</b> to build a bridge between research and practical application. 
                    In addition, engaging with CF <b>patients</b> across different age groups and countries and their relatives leads to an awareness of 
                    the special needs and demands of our project and to an understanding of the limitations and challenges in everyday CF life. The 
                    integration of regulatory ethics serves to evaluate how our project might be implemented in German and international <b>government </b> 
                    regulations for gene therapeutics. The exchange with <b>companies</b> contributes to understanding the chances and challenges in business of 
                    establishing a start-up and what it takes to get our idea on the market for real life application. The continuous exchange between the 
                    different groups contributes significantly to the successful implementation of the project. First-hand information from our target groups 
                    and the matching and merging of the information is therefore essential for defining and achieving our goals.
                </p>
            </div>
            
        </Section>
    )
}