Skip to content
Snippets Groups Projects
Commit d7d4c3af authored by HouTeng Chan's avatar HouTeng Chan
Browse files

Update file home.html

parent fbfe07dd
No related branches found
No related tags found
No related merge requests found
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<link rel="license" href="https://creativecommons.org/licenses/by/4.0/"/> <link rel="license" href="https://creativecommons.org/licenses/by/4.0/"/>
<title>Home | Tsinghua - IGEM 2024</title> <title>Home | Tsinghua - IGEM 2024</title>
<style> <style>
@import url('https://fonts.googleapis.com/css2?family=Baskerville&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Baskerville&family=Merriweather:ital@0;1&display=swap');
body { body {
font-family: Calibri, sans-serif; font-family: Calibri, sans-serif;
...@@ -81,15 +81,20 @@ ...@@ -81,15 +81,20 @@
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
margin-top: 50px; margin-top: 50px;
align-items: center;
} }
.card { .card, .additional-content {
width: 100%; width: 90%;
max-width: 1000px;
margin-bottom: 30px; margin-bottom: 30px;
background-color: #ffffff; background-color: #ffffff;
border-radius: 15px; border-radius: 15px;
overflow: hidden; overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.card {
transition: all 0.3s ease; transition: all 0.3s ease;
cursor: pointer; cursor: pointer;
} }
...@@ -102,7 +107,6 @@ ...@@ -102,7 +107,6 @@
.card-content { .card-content {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.card-image { .card-image {
...@@ -138,14 +142,9 @@ ...@@ -138,14 +142,9 @@
} }
.additional-content { .additional-content {
width: 100%;
margin-top: 50px;
background-color: #ffffff;
border-radius: 15px;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
display: flex; display: flex;
align-items: center; align-items: center;
margin-top: 50px;
} }
.additional-content-text { .additional-content-text {
...@@ -166,10 +165,10 @@ ...@@ -166,10 +165,10 @@
} }
.additional-content-image { .additional-content-image {
width: 200px; width: 200px;
height: auto; height: auto;
object-fit: contain; object-fit: contain;
margin: 30px; margin: 30px;
} }
</style> </style>
</head> </head>
...@@ -219,7 +218,7 @@ ...@@ -219,7 +218,7 @@
<div class="card-full-content"> <div class="card-full-content">
<p>"I consider myself a fortunate IBD patient, as I've remained in remission. Unlike many others on strict diets, I enjoy a varied diet, avoiding only spicy foods and caffeine. My doctor recommends enteral nutritional powder to address potential deficiencies and advises not to stray too far from the hospital. However, I make my own choices. I even participated in an exchange program in the U.S. Thanks to Tsinghua University's medication subsidies, which alleviate my financial burdens. Aside from regular check-ups, life is generally good.</p> <p>"I consider myself a fortunate IBD patient, as I've remained in remission. Unlike many others on strict diets, I enjoy a varied diet, avoiding only spicy foods and caffeine. My doctor recommends enteral nutritional powder to address potential deficiencies and advises not to stray too far from the hospital. However, I make my own choices. I even participated in an exchange program in the U.S. Thanks to Tsinghua University's medication subsidies, which alleviate my financial burdens. Aside from regular check-ups, life is generally good.</p>
<p>Yet, I faced dark times when I was first diagnosed with IBD, especially while preparing for the Gaokao, China's Advanced Level Examination. The symptoms hit hard, leading to frustration and a destructive mindset. I often asked myself, 'Why me?'</p> <p>Yet, I faced dark times when I was first diagnosed with IBD, especially while preparing for the Gaokao, China's Advanced Level Examination. The symptoms hit hard, leading to frustration and a destructive mindset. I often asked myself, 'Why me?'</p>
<p>Over time, I accepted my fate and resolved to make the most of it. This is my destiny. Would I be more successful in a healthy body? Perhaps. But it is what it is, and Ive grown stronger through the challenges I face."</p> <p>Over time, I accepted my fate and resolved to make the most of it. This is my destiny. Would I be more successful in a healthy body? Perhaps. But it is what it is, and I've grown stronger through the challenges I face."</p>
</div> </div>
</div> </div>
</div> </div>
...@@ -231,25 +230,23 @@ ...@@ -231,25 +230,23 @@
<p class="card-preview">A patient battling both IBD and tuberculosis.</p> <p class="card-preview">A patient battling both IBD and tuberculosis.</p>
<div class="card-full-content"> <div class="card-full-content">
<p>"What could be worse than having IBD? Having both IBD and tuberculosis. The nature of their treatments is incompatible; stopping either one could end my life, yet taking both poses the same risk.</p> <p>"What could be worse than having IBD? Having both IBD and tuberculosis. The nature of their treatments is incompatible; stopping either one could end my life, yet taking both poses the same risk.</p>
<p>I find myself at the gastroenterology clinic most frequently, with psychiatry close behind. The pain is relentless, and after being betrayed by my husband, I often feel like Im living in hell. There are moments when I wish for an escape from this suffering, but I have two children and a family who love me dearly. Their love gives me strength, even though Im uncertain how much longer I can endure. All I wish for is to attend my kids parent day at school."</p> <p>I find myself at the gastroenterology clinic most frequently, with psychiatry close behind. The pain is relentless, and after being betrayed by my husband, I often feel like I'm living in hell. There are moments when I wish for an escape from this suffering, but I have two children and a family who love me dearly. Their love gives me strength, even though I'm uncertain how much longer I can endure. All I wish for is to attend my kids' parent day at school."</p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="additional-content">
<div class="additional-content-text">
<h3>IBD</h3>
<p>Inflammatory Bowel Disease (IBD) is a term for two conditions (Crohn's disease and ulcerative colitis) that are characterized by chronic inflammation of the gastrointestinal (GI) tract. This prolonged inflammation results in damage to the GI tract. IBD can be debilitating and sometimes leads to life-threatening complications.</p>
<p>While the exact cause of IBD is unknown, it's believed to be the result of a defective immune system. A properly functioning immune system attacks foreign organisms, such as viruses and bacteria, to protect the body. In IBD, the immune system responds incorrectly to environmental triggers, which causes inflammation of the gastrointestinal tract.</p>
</div>
<img src="https://static.igem.wiki/teams/5187/wiki-home-fig/home-pic.jpg" alt="IBD Logo" class="additional-content-image">
</div>
</div> </div>
</div> </div>
<div class="additional-content">
<div class="additional-content-text">
<h3>IBD</h3>
<p>Inflammatory Bowel Disease (IBD) is a term for two conditions (Crohn's disease and ulcerative colitis) that are characterized by chronic inflammation of the gastrointestinal (GI) tract. This prolonged inflammation results in damage to the GI tract. IBD can be debilitating and sometimes leads to life-threatening complications.</p>
<p>While the exact cause of IBD is unknown, it's believed to be the result of a defective immune system. A properly functioning immune system attacks foreign organisms, such as viruses and bacteria, to protect the body. In IBD, the immune system responds incorrectly to environmental triggers, which causes inflammation of the gastrointestinal tract.</p>
</div>
<img src="https://static.igem.wiki/teams/5187/art/logo.png" alt="IBD Logo" class="additional-content-image">
</div>
{% include 'footer.html' %} {% include 'footer.html' %}
<script> <script>
window.addEventListener('load', function() { window.addEventListener('load', function() {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment