Difference between revisions of "Team:Pasteur Paris/test"

m (Replaced content with "{{Pasteur_Paris/wiki}} <html> <style> div.woaou{ overflow:hidden; }")
 
(42 intermediate revisions by the same user not shown)
Line 6: Line 6:
 
   overflow:hidden;
 
   overflow:hidden;
 
}
 
}
 +
</style>
 +
      <style>
 +
      div.video {
 +
        width:70%;
 +
        margin-left:20%;
 +
        cursor:auto;
 +
        height:auto;
 +
        cursor:pointer;
 +
        overflow:hidden;
 +
      }
 +
      div.video2 {
 +
        width:85%;
 +
        left:7%;
 +
        display:none;
 +
        top:4%;
 +
        cursor:auto;
 +
        height:auto;/*45vw*/
 +
        height:90%;
 +
        cursor:pointer;
 +
        position:fixed;
 +
      }
 +
      div.fond {
 +
        width:100vw;
 +
        height:100vh;
 +
        background-color:rgba(0,0,0,0.8);
 +
        z-index:4;
 +
        position:fixed;
 +
        top:0;
 +
        left:0;
 +
        color:white;
 +
        display:none;
 +
      }
 +
      div.fermeT {
 +
      background-color:white;
 +
      }
 +
      div.fermeT:hover {
 +
      background-color:rgb(200,200,200);
 +
        cursor:pointer;
 +
      }
 +
      div#main {
 +
      width:100%;
 +
        height:auto;
 +
        position:absolute;
 +
        left:0;
 +
        top:260px;
 +
      }
 +
      div.margeG {
 +
      margin-left:20%;
 +
      }
 +
      html {
 +
        scroll-behavior: smooth;
 +
      }
 +
      #mySVG {
 +
        position:relative;
 +
        width: 100vw;
 +
        height: 100vh;
 +
        margin-left:0px;
 +
      }
 +
      path.st0 {
 +
        fill: none;
 +
        stroke-dashoffset: 3px;
 +
        stroke: white;
 +
        stroke-width: 5;
 +
        stroke-miterlimit: 10;
 +
        stroke-dasharray: 40;
 +
      }
 +
    </style>
 +
    <div id="fond" class="fond">
 +
      <div class="fermeT" style="height:50px;width:50px;position:fixed;top:0;right:0;opacity:1;">
 +
        <div style="height:10%;width:80%;background-color:black;position:relative;top:45%;transform-origin:50% 50%;transform:rotate(45deg);left:10%;border-radius:3px 3px;">
 +
        </div>
 +
        <div style="height:10%;width:80%;background-color:black;position:relative;top:35%;transform-origin:50% 50%;transform:rotate(-45deg);left:10%;border-radius:3px 3px;">
 +
        </div>
 +
      </div>
 +
    </div>
 +
    <div id="video2" style="z-index:5;" class="video2"><iframe src="https://www.youtube.com/embed/m8sa2u1treQ"
 +
 +
        allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
 +
 +
        allowfullscreen="" height="100%" frameborder="0" width="100%"></iframe>
 +
    </div>
 +
    <div id="barre_kote" style="width:10%;height:500px;position:fixed;background-color:#2a5f5f;top:20%;border:1px solid #265555;min-width:200px;">
 +
      <div style="width:100%;height:100px;border:1px solid white;">
 +
        <div style="float:left;height:100%;width:50%;border:1px solid dodgerblue;">
 +
          <svg id="mySVG"  viewBox="0 0 200 200" style="width: 100%; height: 100%; overflow: visible;transform:rotate(90deg);top:50%;left:-50%;">
 +
      <path id="myline" class="st0" stroke-dasharray="10" d="M-100,0a100,100 0 1,0 200,0a100,100 0 1,0 -200,0" /> Sorry, your browser does not support inline SVG.
 +
    </svg>
 +
        </div>
 +
      </div>
 +
    </div>
 +
    <div id="main">
 +
      <div style="width:48%;margin-left:20%;height:auto;padding:100px 0px;">
 +
        <div style="margin-bottom:0px;">
 +
          <h1 style="font-family:'Lato',sans-serif;font-size:45px;color:white;font-weight:600">
 +
            Entrepreneurship </h1>
 +
        </div>
 +
        <div>
 +
          <p style="font-family:roboto;color:white;font-size:25px;font-weight:100;text-align:justify">
 +
            We want to create new standards for medical diagnostics by becoming
 +
            major actors in the field of health, in order to bring down the
 +
            empirical antibiotic treatment era. </p>
 +
        </div>
 +
      </div>
 +
      <div id="video" class="video"> <video autoplay="autoplay" loop="" width="100%">
 +
          <source src="https://www.uber-assets.com/video/upload/v1557263289/videos/webloops/1920x1080/WEBM/Ellis_TVC_WebLoop_1920x1080_h264_.webmhd.webm"
 +
 +
            type="video/webm"> <source src="https://www.uber-assets.com/video/upload/v1557263268/videos/webloops/1920x1080/H264/Ellis_TVC_WebLoop_1920x1080_h264.mp4"
 +
 +
            type="video/mp4"> </video>
 +
        <div style="position:relative;bottom:0px;height:80px;margin-top:-15%;margin-bottom:5%;">
 +
          <p id="paragraphe" style="font-family:'Lato',sans-serif;color:white;margin-left:7%;font-size:60px;width:auto;line-height:0;">
 +
            Play full video </p>
 +
        </div>
 +
      </div>
 +
      <div style="width:60%;margin-left:20%;margin-top:50px;">
 +
        <div style="margin-bottom:50px;margin-top:100px;">
 +
          <h1 style="font-family:'Lato',sans-serif;font-size:45px;color:white;font-weight:600">
 +
            Our Work </h1>
 +
        </div>
 +
        <div id="nav">
 +
          <p style="font-family:roboto;color:white;font-size:18px;text-align:justify;font-weight:100;line-height:23px;">
 +
            The birth of DIANE was possible thanks to a motivated, close-knit
 +
            and dynamic team of 10 hardworking students from different fields of
 +
            study (i.e law (Paris Sud), biology (Sup ‘Biotech), chemistry
 +
            (Chimie ParisTech, ENS Cachan), and physics (ESPCI)). <br>
 +
            Our main asset was the diversity of knowledge distributed amongst
 +
            the team members: but we’re only students, and as such, we lack
 +
            expertise. Thus, we have involved experts from diverse fields to
 +
            help us build our project : Ms. Sylvie Renard Dubois, Dr Marcel
 +
            Hollenstein, Dr Lebeaux, Dr Clauteaux, Ms. Couture and others, in
 +
            order to learn from their experience and listen carefully to their
 +
            advices. Our project relies on a strong bond between all the members
 +
            of our team, and on mutual support. We have organized our working
 +
            time by making sure we could all fully understand every aspect of
 +
            the project, by reporting back to others during bi-weekly meetings.
 +
            Those meetings helped us develop autonomous behaviors, by including
 +
            the opinions of others on all the subjects. </p>
 +
          <br>
 +
          <p style="font-family:roboto;color:white;font-size:18px;text-align:justify;font-weight:100;">
 +
            Moreover, we have worked with short iterations, and by creating
 +
            numerous milestones along the way. This working method, called <a href="#agile"
 +
 +
              style="text-decoration:none;color:white;"><u>Agile method</u></a>
 +
            (learn start up method) helped us minimize the risk of failure by
 +
            involving as much customers and experts in our domain, to help us
 +
            find solutions and answers to hypotheses we claimed, and ensure that
 +
            we can get maximum reactivity on any oncoming problem. We kept in
 +
            touch with reality by making little steps forward every day. We
 +
            wanted to make sure that we would create a product that would stand
 +
            up to the expectations of our market. In order to enforce this
 +
            method in our team, at the end of each development phase, we have
 +
            reviewed our strengths and weaknesses and made sure that we would
 +
            get better at each new phase. This working mindset has helped us
 +
            consolidate our project, by compensating our flaws with new
 +
            solutions. </p>
 +
        </div>
 +
      </div>
 +
      <div id="agile" class="margeG" style="width:60%;padding-top:100px;padding-bottom:30px;">
 +
        <div style="height:100px;width:100px;border:3px solid white;border-radius:50%;float:left;">
 +
          <p style="font-family:roboto;font-size:50px;color:white;margin-left:38%;margin-top:22%">
 +
            ? </p>
 +
        </div>
 +
        <div style="float:inline-start;height:100px;">
 +
          <p style="font-family:roboto;color:white;font-size:18px;font-weight:100;margin-left:135px;">
 +
            <a style="">Agile Methode :</a> based on the Manifeste Agile written
 +
            in 2001, this method is used for project development and relies on 4
 +
            fundamental values : individuals and interactions, working software,
 +
            customer relationship, resilience. </p>
 +
        </div>
 +
      </div>
 +
     
 +
      <div style="width:70%;margin-left:20%;">
 +
        <div style="width:48%;float:left;border:1px solid black;height:20px;">
 +
          photo 1
 +
        </div>
 +
        <div style="width:48%;float:left;border:1px solid black;height:20px;">
 +
          photo 2
 +
        </div>
 +
      </div>
 +
<p id="lol" style="height:40px;width:500px;border:3px solid dodgerblue;position:fixed;top:50px;">
 +
      coucou
 +
    </p>
 +
    </div> <!-- main !-->
 +
   
 +
 
 +
    <script>
 +
 +
      document.getElementById("video").addEventListener("click", print);
 +
 +
      function print(){     
 +
        document.getElementById("video2").style.display = "block";
 +
document.getElementById("fond").style.display = "block";
 +
        document.getElementById("fond").addEventListener("click",deprint);
 +
        document.getElementById("video2").innerHTML = '<iframe width="100%" height="100%" src="https://www.youtube.com/embed/m8sa2u1treQ?&autoplay=1" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>';
 +
      }
 +
   
 +
      function deprint(){
 +
        document.getElementById("fond").style.display = "none";
 +
        document.getElementById("video2").style.display = "none";
 +
        document.getElementById("video2").innerHTML = null;
 +
      }
 +
      // Get the id of the <path> element and the length of <path>
 +
      var myline = document.getElementById("myline");
 +
      var length = myline.getTotalLength();
 +
var scrl;
 +
      window.addEventListener("scroll", myFunction);
 +
 +
     
 +
      // The start position of the drawing
 +
      document.getElementById("myline").style.strokeDasharray = length;
 +
 +
      // Hide the triangle by offsetting dash. Remove this line to show the triangle before scroll draw
 +
      document.getElementById("myline").style.strokeDashoffset = length;
 +
 +
      // Find scroll percentage on scroll (using cross-browser properties), and offset dash same amount as percentage scrolled
 +
     
 +
      function myFunction() {
 +
        // What % down is it?
 +
        if (document.documentElement.scrollTop>2000){
 +
        document.getElementById("myline").style.strokeDashoffset = 0;
 +
        }
 +
        else if(document.documentElement.scrollTop>1000){
 +
        var scrollpercent = (document.documentElement.scrollTop -1000) / (-1000+2000);
 +
        // Length to offset the dashes
 +
        var draw = length * scrollpercent;
 +
        // Reverse the drawing (when scrolling upwards)
 +
        document.getElementById("myline").style.strokeDashoffset = -(length - draw);}
 +
        else if (document.documentElement.scrollTop<1000){
 +
        document.getElementById("myline").style.strokeDashoffset = length;
 +
        }
 +
       
 +
        document.getElementById("lol").innerHTML = document.documentElement.scrollTop;
 +
      }
 +
    </script>
 +
</html>

Latest revision as of 15:33, 13 October 2019

  • Safety
  • Juddging Form
  • Human Pratices

  • Education
    Law
    Events
  • Project
  • Description
    Design
    Results
    Entrepreneurship
    Demonstrate
    Chalenges
    Improve
  • Team
  • Team members
    Collaborations
    Attributions
  • Sciences
  • Notebook
    Results Attributions
  • Awards
  • About Us

    • SAFETY

    JUDGING  FORM

    HUMAN  PRACTICES

  • Interview Collaboration Law & Ethics

    • PROJECT

  • Description Entrepreneurship Demonstrate Improve

    • HOME

    TEAM

  • Team members Attributions
    • Picto Sciences

    Sciences

  • Notebook Results
    • 1

    AWARDS

  • Medals Demonstrate Special Prizes
    • iGEMPASTEURPARIS2019

    ABOUT  US

    ecr-v-1
    ecr-p-2
    ecr-v-1
    ecr-p-2
    ecr-p-2
    ecr-p-2
    ecr-v-1
    ecr-p-2
    ecr-p-2
    ecr-v-1
    ecr-p-2
    ecr-v-1
    ecr-p-2
    ecr-p-2
    ecr-v-1
    ecr-p-2
    ecr-v-1
    ecr-p-2
    Sorry, your browser does not support inline SVG.

    Entrepreneurship

    We want to create new standards for medical diagnostics by becoming major actors in the field of health, in order to bring down the empirical antibiotic treatment era.

    Play full video

    Our Work

    ?

    Agile Methode : based on the Manifeste Agile written in 2001, this method is used for project development and relies on 4 fundamental values : individuals and interactions, working software, customer relationship, resilience.

    photo 1
    photo 2

    coucou