huhj

wiki/menu.html

@@ -97,7 +97,7 @@
               <span class="underline"></span>
             </li>
             <li>
-              <a class="dropdown-item" href="{{ url_for('pages', page='education_communication') }}">
+              <a class="dropdown-item" href="{{ url_for('pages', page='communication') }}">
                 Education & Communication
               </a>
             </li>

wiki/pages/communication.html

 {% extends "layout.html" %}
-  
-{% block title %}Communication{% endblock %}
-{% block lead %}Develop and implement education, science communication, and/or outreach materials related to synthetic biology.{% endblock %}
+
+{% block title %}Education and Communcation{% endblock %}
+{% block lead %}Innovative educational tools and outreach activities have the ability to establish a two-way dialogue
+with new communities by discussing public values and the science behind synthetic biology.{% endblock %}
 
 {% block page_content %}
+<script src=" {{ url_for('static', filename='jsons/educom.js') }}"></script>
+<link href="{{ url_for('static', filename = 'css/boring_pages.css') }}" rel="stylesheet">
+<link href="{{ url_for('static', filename = 'css/educom.css') }}" rel="stylesheet">
 
-<div class="row mt-4">
-  <div class="col">
-    <div class="bd-callout bd-callout-info">
-      <h4>Gold Medal Criterion #6: Education & Communication</h4>
-      <p>Develop and implement education, science communication, and/or outreach materials related to synthetic biology.<p>
-      <p>All activities must follow Safety policies for <a href="https://responsibility.igem.org/safety-policies/human-subjects">Human Subjects Research</a>.</p>
-      <hr>
-      <p>Please see the <a href="https://competition.igem.org/judging/medals">2022 Medals Page</a> for more information.</p>
+<section class="page_heading mt-5 mb-5">
+  <div class="container">
+    <div class="row d-flex align-content-center justify-content-center">
+      <div class=" ts-20 page-header fade_from_top" id="distribution_title" style="font-size: 4vw;">
+        Education and Communication
+      </div>
+      <hr class="hr-divider width-2 fade_from_static">
+      <p class="section-text mb-0 text-center fade_from_left">
+        One of the goals of our Estonia_TUIT team is to bridge the knowledge and fill the communication gap
+        between the field of
+        science and the general public. Each year we aim to find new approaches in education and communication
+        that would be not
+        only academically informative but also easily accessible and entertaining for everyone, including people
+        of different
+        educational and cultural backgrounds and from all age groups. When reaching out to the public, we not
+        only spread the
+        knowledge about science and synthetic biology but also introduce people to iGEM and our project and then
+        take into
+        account different perspectives regarding our project. To facilitate science education and open dialogue
+        between
+        scientists and the public, this year, our team organized various workshops, educational lectures and
+        courses, info
+        sessions, and public events, as well as participated in a number of education fairs, festivals, and
+        multiple other
+        events. Additionally, our team was actively taking part in different meetups with other iGEM teams with
+        the goal of
+        facilitating communication and information exchange within the scientific community.
+      </p>
+      <div class="arc-divider">
+        <img src="https://static.igem.wiki/teams/4440/wiki/wiki/half-arc-divider.svg"
+          class="img-fluid fade_from_bottom">
+      </div>
     </div>
   </div>
+</section>
+<!-- 
+<section class="text-section width-12 flex justify-content-center">
+    <div class="width-10">
+        <div class=" flex row">
+            <p class="section-text mb-0 text-center">
+                One of the goals of our Estonia_TUIT team is to bridge the knowledge and fill the communication gap
+                between the field of
+                science and the general public. Each year we aim to find new approaches in education and communication
+                that would be not
+                only academically informative but also easily accessible and entertaining for everyone, including people
+                of different
+                educational and cultural backgrounds and from all age groups. When reaching out to the public, we not
+                only spread the
+                knowledge about science and synthetic biology but also introduce people to iGEM and our project and then
+                take into
+                account different perspectives regarding our project. To facilitate science education and open dialogue
+                between
+                scientists and the public, this year, our team organized various workshops, educational lectures and
+                courses, info
+                sessions, and public events, as well as participated in a number of education fairs, festivals, and
+                multiple other
+                events. Additionally, our team was actively taking part in different meetups with other iGEM teams with
+                the goal of
+                facilitating communication and information exchange within the scientific community.
+
+            </p>
+        </div>
+    </div>
+</section> -->
+
+<section class="text-section width-12 flex justify-content-center">
+
+  {% include 'custom-svgs/educom.html' %}
+
+</section>
+
+
+
+
+
+
 </div>
 
+
+<script>
+  rotateGradient('distribution_title', '#9071f1', '#e2b025');
+
+  const boxes = Array.from(document.getElementsByClassName('educom-hover'));
+  // console.log(boxes);
+  boxes.forEach(box => {
+    const boxId = box.id;
+    console.log(boxId);
+    const info = educomJson[boxId];
+    box.onclick = () => {
+      createSimpleHTMLModal(info.title, info.content);
+
+      const wlbtns = Array.from(document.getElementsByClassName('workshop-btn'));
+      const texts = Array.from(document.getElementsByClassName('workshop-text'));
+
+      wlbtns.forEach(btn => {
+
+        const textId = btn.id + '-text';
+        const textElement = document.getElementById(textId);
+
+        btn.onclick = () => {
+          texts.forEach(a => {
+            a.style.display = 'none';
+          });
+
+          textElement.style.display = 'flex';
+        }
+
+
+
+      })
+    }
+  })
+</script>
+
+
+
 {% endblock %}
\ No newline at end of file