diff --git a/static/styles/style.css b/static/styles/style.css
index d5c64d8be31708fa21616811c3c62e27673c7a6b..0b26a38efc104304fda99d14a05f97afe8ae0ecb 100644
--- a/static/styles/style.css
+++ b/static/styles/style.css
@@ -379,6 +379,24 @@ td {
}
}
+
+.eduBar{
+ background-image: url(https://static.igem.wiki/teams/5441/edu/edusidebar.png);
+ height: 100px;
+ background-size: 100% 100%;
+ padding: 5%;
+ block-size: max-content;
+}
+
+.eduT{
+ width: 20%;
+ vertical-align: middle;
+ margin-right: 5%;
+}
+
+.eduD{
+ width: 70%;
+}
a{
color: #6a0000;
text-decoration: underline 0.15em rgba(248, 141, 0, 0.5);
diff --git a/wiki/pages/education.html b/wiki/pages/education.html
index cf5d1479d0fe35547a01aa265c34065d5a4dc8b5..9b272cb087dc559458889f267b5ec93a4c99371e 100644
--- a/wiki/pages/education.html
+++ b/wiki/pages/education.html
@@ -6,6 +6,98 @@
{% block page_content %}
+<div class="row mt-4">
+ <div class="eduBar">
+ <div style="
+ display: flex;
+">
+ <div class="eduT">
+ Primary
+ </div>
+ <div class = "eduD">
+ Introduction to gene and DNA bases
+ </div>
+ </div>
+ <div class="eduBar">
+ <div style="
+ display: flex;
+">
+ <div class="eduT">
+ Year 7
+ </div>
+ <div class="eduD">
+ Basic concept of gene and gene expression
+ <br>
+ Having an idea of what cancer is
+
+ </div>
+ </div>
+ </div>
+ <div class="eduBar">
+ <div class="eduT">
+ Year 8
+ </div>
+ <div class = "eduD">
+ Basic concept of gene and gene expression
+ <br>
+Basic concept of plasmid and GFP
+
+ </div>
+ </div>
+ <div class="eduBar">
+ <div style="
+ display: flex;
+">
+ <div class="eduT">
+ Year 9
+ </div>
+ <div class="eduD">
+ Understand the means to conduct a cancer-related research
+ <br>
+ Drug life cycle
+ </div>
+ </div>
+ </div>
+ <div class="eduBar">
+ <div style="
+ display: flex;
+">
+ <div class="eduT">
+ Senior Secondary
+ </div>
+ <div class="eduD">
+ Engage in iGEM competition
+ </div>
+ </div>
+ </div>
+ <div class="eduBar">
+ <div style="
+ display: flex;
+">
+ <div class="eduT">
+ University
+ </div>
+ <div class="eduD">
+ Exchange ideas on gene construction and cell culture
+ </div>
+ </div>
+ </div>
+ <div class="eduBar">
+ <div style="
+ display: flex;
+">
+ <div class="eduT">
+ General Public
+ </div>
+ <div class="eduD">
+ Symptoms of prostate cancer
+ <br>
+ How cancer cells are detected and killed
+ </div>
+ </div>
+ </div>
+</div>
+
<div class="row mt-4">
<h2>Overview</h2>
diff --git a/wiki/pages/human-practices.html b/wiki/pages/human-practices.html
index 0140bf17ca93add2fb1fc5b5fcda8758fcebbdb1..155d244a36c46054e6af2ed53baec79b7e5bd2b0 100644
--- a/wiki/pages/human-practices.html
+++ b/wiki/pages/human-practices.html
@@ -206,17 +206,17 @@
</div>
<div class="row mt-4">
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:160px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/20240124-162838.jpg">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:160px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/20240124-161835.jpg">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:280px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/20240124-163021.jpg">
</div>
@@ -243,11 +243,11 @@
<img src="https://static.igem.wiki/teams/5441/pictures/former-team-min.png">
</div><div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:280px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc00193.jpg">
</div><div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:280px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc00189.jpg">
@@ -287,12 +287,12 @@
</div>
<div class="row mt-4">
<div class="col-lg-6" style="border:0px"><img src="https://static.igem.wiki/teams/5441/pictures/tkp-min.png"></div><div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:280px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc00082.jpg">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:280px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc00099.jpg">
</div>
@@ -319,11 +319,11 @@
</div><div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:330px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/img-20240513-161513.jpg">
</div><div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:280px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc09445.jpg">
</div></div>
@@ -343,17 +343,17 @@
</div>
<div class="row mt-4">
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:350px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/img-6502.png">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:300px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/img-6501.png">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:290px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/img-6500.png">
</div>
@@ -403,11 +403,11 @@
<img src="https://static.igem.wiki/teams/5441/pictures/bayer-meeting-min.png"></div><div style=" border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:290px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc09571.jpg">
</div><div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:290px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc09601.jpg">
</div></div>
@@ -427,12 +427,12 @@
</div>
<div class="row mt-4">
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:290px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/edupro1-min.jpg">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:290px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/edupro2-min.jpg">
</div>
@@ -458,17 +458,17 @@
</div>
<div class="row mt-4">
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:400px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/pictures/dsc00283.png">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:400px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/notebook/whatsapp-image-2024-09-27-at-10-25-33-pm.jpeg">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:400px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/notebook/whatsapp-image-2024-09-27-at-10-25-34-pm.jpeg">
</div>
@@ -506,13 +506,28 @@
<p><span>We also organised a sharing session with cancer patients to better </span><strong>understand their needs and concerns about cancer.</strong><span> This provided us with an invaluable chance to </span><strong>have a deeper and better insight into the daily life of a cancer patient</strong><span>, which further </span><strong>strengthened our determination and commitment to developing a new and effective way to diagnose and cure cancer</strong><span>.</span></p>
<p><span>Moreover, we invited our </span><strong>school band</strong><span> (</span><strong>serve as music therapy)</strong><span> to perform, aiming to provide our participants with a </span><strong>moment of joy and serenity</strong><span> through a live musical performance. We believe that music can be a way to </span><strong>relieve stress</strong><span> and provide them with a relaxed environment in which to discuss their experiences with us.</span></p>
<p><span>We sincerely hope to </span><strong>promote the importance of early cancer</strong> <strong>diagnosis </strong><span>by sharing </span><strong>real-life experiences from cancer patient</strong><span>s. Through this collaboration, not only have we learnt about </span><strong>their difficulties and adjusted our product to fit more realistic demands</strong><span>, but we can also raise awareness and encourage proactive health measures. Additionally, we strive to provide a supportive and uplifting environment, demonstrating our care and concern by offering joyful and relaxing experiences for patients and their families.</span></p>
- <div>
-
- <img src="https://static.igem.wiki/teams/5441/ihp/social.png" style="width:400px">
+ <img src="https://static.igem.wiki/teams/5441/ihp/social.png" style="width:400px">
+</div>
-
- </div>
+<div class="row mt-4">
+ <div style="border: 30px solid transparent;
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0; width: 500px;
+">
+ <img src="https://static.igem.wiki/teams/5441/ihp/canv1.jpg">
+</div>
+<div style="border: 30px solid transparent;
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0; width: 500px;
+">
+ <img src="https://static.igem.wiki/teams/5441/ihp/canv2.jpg">
</div>
+<div style="border: 30px solid transparent;
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0; width: 500px;
+">
+ <img src="https://static.igem.wiki/teams/5441/ihp/canv3.jpg">
+</div>
+
+</div>
+
<div style="
background-image: url(https://static.igem.wiki/teams/5441/ihp/ihpperson.png);
background-repeat: no-repeat;
@@ -531,17 +546,17 @@
</div>
<div class="row mt-4">
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:400px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/notebook/whatsapp-image-2024-09-27-at-11-04-17-pm.jpeg">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:400px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/notebook/whatsapp-image-2024-09-27-at-11-04-36-pm.jpeg">
</div>
<div style="border: 30px solid transparent;
- border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;width:400px
+ border-image: url(https://static.igem.wiki/teams/5441/ihp/borderwhite.png) 110 round;block-size: max-content;padding:0;width:400px
">
<img src="https://static.igem.wiki/teams/5441/notebook/whatsapp-image-2024-09-27-at-11-03-50-pm.jpeg">
</div>