From e89f76bc9c9fc25706559939cbfb7c8799fa9cc4 Mon Sep 17 00:00:00 2001
From: HouTeng Chan <ht-chen21@mails.tsinghua.edu.cn>
Date: Mon, 30 Sep 2024 12:17:43 +0000
Subject: [PATCH] Update file human-practices.html
---
wiki/pages/human-practices.html | 90 +++++++++++++++++----------------
1 file changed, 46 insertions(+), 44 deletions(-)
diff --git a/wiki/pages/human-practices.html b/wiki/pages/human-practices.html
index 9c458473..7794ab68 100644
--- a/wiki/pages/human-practices.html
+++ b/wiki/pages/human-practices.html
@@ -27,47 +27,49 @@
}
.expert-card {
- background-color: white;
- border: 1px solid #ddd;
- border-radius: 8px;
- padding: 20px;
- margin-bottom: 20px;
- transition: box-shadow 0.3s ease;
- }
- .expert-card:hover {
- box-shadow: 0 4px 8px rgba(0,0,0,0.1);
- }
- .expert-image {
- width: 200px;
- height: 200px;
- object-fit: cover;
- }
- .expert-details {
- display: flex;
- flex-direction: column;
- }
- .expert-name {
- font-size: 1.5rem;
- font-weight: bold;
- }
- .expert-role {
- font-size: 1.2rem;
- color: #666;
- }
- .expert-takeaway {
- margin-top: 15px;
- font-weight: bold;
- }
- .expert-content {
- margin-top: 10px;
- display: none;
- }
- .click-for-more {
+ background-color: white;
+ border: 1px solid #ddd;
+ border-radius: 8px;
+ padding: 20px;
+ margin-bottom: 20px;
+ transition: box-shadow 0.3s ease;
+ position: relative;
+ }
+ .expert-card:hover {
+ box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+ }
+ .expert-image {
+ width: 200px;
+ height: 200px;
+ object-fit: cover;
+ }
+ .expert-details {
+ display: flex;
+ flex-direction: column;
+ }
+ .expert-name {
+ font-size: 1.5rem;
+ font-weight: bold;
+ }
+ .expert-role {
+ font-size: 1.2rem;
+ color: #666;
+ }
+ .expert-takeaway {
+ margin-top: 15px;
+ font-weight: bold;
+ }
+ .expert-content {
+ margin-top: 10px;
+ display: none;
+ }
+ .toggle-button {
position: absolute;
bottom: 10px;
- right: 20px;
- font-size: 0.8rem;
- color: #888;
+ right: 10px;
+ background-color: #f8f9fa;
+ border: 1px solid #ddd;
+ padding: 5px 10px;
cursor: pointer;
}
</style>
@@ -168,9 +170,9 @@
<p>Moreover, in the early stages of our Muscure project, since we chose yeast as the chassis organism, it was necessary for us to culture yeast. However, there were relatively few yeast laboratories at Tsinghua University, and we couldn't find a source to obtain yeast, nor did we know how to culture it. It was Dr Li Peng who provided us with the yeast strains he had preserved from the past and taught us how to culture them. Dr Li Peng also gave us his molecular biology laboratory manual, guiding us on the process of yeast transformation. During our initial meetings when we were selecting topics, Dr. Li Peng also listened attentively on the side, offering us advice on feasibility and other aspects.</p>
<p>Dr Li Peng provided us with tremendous support in terms of experimental safety, materials, and methods, largely laying the foundation for our project.</p>
</div>
+ <button class="toggle-button" onclick="toggleContent(this)">Click for more</button>
</div>
</div>
- <span class="click-for-more">Click for more</span>
</div>
</div>
</div>
@@ -758,15 +760,15 @@
<script>
- function toggleContent(card) {
+ function toggleContent(button) {
+ var card = button.closest('.expert-card');
var content = card.querySelector('.expert-content');
- var clickForMore = card.querySelector('.click-for-more');
if (content.style.display === 'none' || content.style.display === '') {
content.style.display = 'block';
- clickForMore.textContent = 'Click to collapse';
+ button.textContent = 'Click to collapse';
} else {
content.style.display = 'none';
- clickForMore.textContent = 'Click for more';
+ button.textContent = 'Click for more';
}
}
</script>
--
GitLab